Using Dynamic Content
Using the Dynamic Field Toolbar Button
The Dynamic Field button is a premium feature
Stackable's Dynamic Field works for Stackable blocks, native blocks and possibly other third party blocks.
Adding A Dynamic Field
First thing you will need to do is to simply highlight the text in the block you want to add Dynamic Fields to. When doing so, you will find a Database icon in the Toolbar — that represents Dynamic Fields.
When you click on the icon, a popup will appear with 2 initial drop downs — Dynamic Source and Field.
Select which Dynamic Source you want to add then which specific field. Afterwards, click "Apply" to insert your Dynamic Field.
In this example, we will choose the Post Title in our current page.
You can also do this in the inspector.
Note: It’s not guaranteed that the Dynamic Content that's displayed inside the editor is the most updated one since most of the code’s logic is in the frontend. This means that if you change your Post Title later on, the changes in the Dynamic Content might not be reflected in the editor, but will be reflected when you view it in the frontend.
Selecting Blog Posts for Your Dynamic Fields
One of the Dynamic Sources you can choose from is called Latest Post which will allow you to add Dynamic Content from your existing blog posts. Once you select Latest Post, another drop down will appear wherein you can choose from which post you want.
Just follow the same steps as earlier then click "Apply"
You can do this for all text inside your block. In this example, we will add the excerpt from one of our existing blog posts.
Another thing you can do is add a Post URL to your Dynamic Field then show it as a link in the frontend.
You can also use Dynamic Fields for block image sources, background image sources, button links and other block content.
If you want to further tweak your dynamic images, you can change the focal point, add image filters or hover effects on them.
Dynamic Fields for Button Links
Selecting Your Own Custom Date and Time Formats
When using a date for Dynamic Fields, you will have an option to format it using a custom format of your own.
Just click on the Dynamic Fields button on the toolbar, and then select the text that you want to transform into dynamic content. After doing that, a pop up will appear for you to select where to get the content from.
You also have the option to customize your format. Just select Custom, and then a text box will appear below where you can type in the format that you want to use
For more information on custom date formats, you can visit this link 👍🏼
Native Query Loop Compatibility
When using Dynamic Content with the native Query Loop, be sure to use the "Current Post" as the Dynamic Source.
Native Query Loop is one of WordPress' latest blocks. This block allows you to create a loop of posts so that whatever design you create for one post will be applied to the other posts inside the loop.
With Stackable version 3, you can put our blocks inside the Query Loop block and use Dynamic Content to display the latest posts.
How to do it:
- Add the native Query Loop block
- Select which view you want to use
- In this example, we will use the Grid view
- Add a Stackable block inside
- You have the option to rebuild your block from scratch, or use our pre-made blocks
In this example, we will add the Stackable Card block
- Use Dynamic Content for the following:
The images from the Featured Image of the posts, be sure to pick "Current Post" for the "Dynamic Source"
The titles from the Post Title
- The text from the Post Excerpt
- The button links to the Post's page