I have the following code set in PG but on export, I get two errors:
The CSS of the block (on the live site) is not properly outputting the padding top. Here is what shows up instead: class=“wp-block-tb-new-tb-list g-list props.attributes.padding_top, ‘padding_top’ pb-2” (I’ve seen this bug before but was able to fix it (this may have to do with copy and pasting attributes?)
The li items won’t save the text/content entered in the admin so the output is blank.
<ul class="dot-list g-list pb-2 pt-2" style="columns: 2;" cms-block="tb-list" cms-block-title="List Unordered" cms-block-description="Create a dot list or checkmark list with option for multiple columns." cms-block-category="design" cms-block-keywords="list, dot, checkmark" cms-block-icon="list-view" cms-block-field="dot_or_check" cms-block-field-type="class" cms-block-field-class-replace="dot-list" cms-block-field-title="Switch to Checkmark?" cms-block-field-control="toggle" cms-block-inner-content cms-block-inner-content-template="[
[ '${this}/list-item', {list_text: "Create your list"} ],
[ '${this}/list-item', {list_text: "Create your list"} ],
[ '${this}/list-item', {list_text: "Create your list"} ],
[ '${this}/list-item', {list_text: "Create your list"} ]
]" cms-block-field-checkbox-value="check-list" cms-block-field-title-2="Padding Top" cms-block-field-type-2="class" cms-block-field-class-replace-2="pt-2" cms-block-field-control-2="select" cms-block-field-values-2="1=pt-1
2=pt-2
3=pt-3
4=pt-4
5=pt-5
6=pt-6" cms-block-field-values-3="1=pb-1
2=pb-2
3=pb-3
4=pb-4
5=pb-5
6=pb-6" cms-block-field-title-3="Padding Bottom" cms-block-field-3="padding_bottom" cms-block-field-type-3="class" cms-block-field-class-replace-3="pb-2" cms-block-field-control-3="select" cms-block-field-4="num_column" cms-block-field-type-4="style" cms-block-field-style-4="columns" cms-block-field-title-4="How Many Columns?" cms-block-field-control-4="select" cms-block-field-values-4="1
2
3
4" cms-block-field-2="padding_top">
<li cms-block="list-item" cms-block-title="List Items" cms-block-icon="editor-ul" cms-block-category="design" cms-block-parent="tb-new/tb-list" cms-block-field="list_text" cms-block-field-type="content" cms-block-field-title="Enter Bullet Text">Create your list</li>
</ul>```
I completely rebuilt the block by hand with a different name and I’m still getting the same error so it’s not related to the copying and pasting of all the attributes from another block. This version has the same issues:
<ul class="dot-list g-list pb-2 pt-2" style="columns: 2;" cms-block="unorder-list" cms-block-title="List Unordered" cms-block-description="Create a dot list or checkmark list with option for multiple columns." cms-block-icon="list-view" cms-block-category="design" cms-block-field="num_column" cms-block-field-type="style" cms-block-field-title="How Many Columns?" cms-block-field-2="dot_or_check" cms-block-field-type-2="class" cms-block-field-class-replace-2="dot-list" cms-block-field-title-2="Dots or Checkmarks?" cms-block-field-control-2="select" cms-block-field-values-2="Dots = dot-list
Checkmarks = check-list" cms-block-field-3="padding_top" cms-block-field-type-3="class" cms-block-field-class-replace-3="pt-2" cms-block-field-title-3="Padding Top" cms-block-field-control-3="select" cms-block-field-values-3="1=pt-1
2=pt-2
3=pt-3
4=pt-4
5=pt-5
6=pt-6" cms-block-field-4="padding_bottom" cms-block-field-type-4="class" cms-block-field-class-replace-4="pb-2" cms-block-field-title-4="Padding Bottom" cms-block-inner-content cms-block-inner-content-template="[
[ '${this}/linsting', {} ],
[ '${this}/linsting', {} ]
]" cms-block-field-control-4="select" cms-block-field-values-4="1=pb-1
2=pb-2
3=pb-3
4=pb-4
5=pb-5
6=pb-6" cms-block-field-style="columns">
<li cms-block="linsting" cms-block-title="List Items" cms-block-icon="editor-ul" cms-block-category="design" cms-block-field="item_text" cms-block-field-type="content" cms-block-field-title="Enter Text" cms-block-parent="tb-new/unorder-list">Create your list</li>
<li>Create your list</li>
</ul>
Also, the console log is putting out this error when selecting a list block in side the UL block: Uncaught TypeError: Z is not a function
Just a heads up… I’ve bypassed the bugs for now. The issue lies in how I had inner blocks and the main block action combined with Block Attributes. In short, there are bugs with having block attributes on the same div as a Create Block action or Block Inner Content action. I bypassed the bugs by adding more nesting in my HTML and separating the block attributes across multiple nested tiers. Working code: