Render Static

Render static components within CMS lists after a set number of elements. Keep your layouts structured and organized.

Copy the Render Static <script> and paste into the <head> of your page

<!-- [WebTricks by CodeRaccoons] - Render StaticĀ -->
<script async src="https://cdn.jsdelivr.net/gh/TheCodeRaccoons/WebTricks@1/Dist/WebflowOnly/RenderStatic.min.js" ></script>
Copy Script

Required attributes

Optional
I want this CMS List to contain static elements between the list items.
Attribute to add
Name
wt-renderstatic-element
Value
container
Instructions

Assign this attribute to the CMS List View, container that will hold the dynamically inserted cloneable elements.

How does it look?
Optional
Defines elements that can be cloned and inserted into the container.
Attribute to add
Name
wt-renderstatic-element
Value
cloneable
Instructions

Assign this attribute to elements that should be cloned and rendered dynamically.

The elements NEED to be visible but they can be wrapped in a container with Display set to hidden if needed

Where?
Add this to each of the elements you want to show in the CMS List.
How does it look?

Optional Attributes

Optional
I want the static elements to be rendered with this gap in between
Attribute to add
Name
wt-renderstatic-gap
Value
1 (default)
Instructions

Set this attribute to control how frequently cloneables are inserted into the container.

How does it look?
Optional
I want the static cards in this CMS List to keep their webflow animations
Attribute to add
Name
wt-renderstatic-resetix2
Value
true
Instructions

This attribute allows for the cloneable elements from Render Static to keep their Webflow interactions when being re-rendered

Where?
Add this attribute to the CMS List with the attruibute "wt-renderstatic-element='container'"
How does it look?

Working examples