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, and then which specific field. Afterwards, just 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 and 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 to add a Post URL to your Dynamic Field and then show it as a link in the frontend
Dynamic Fields for Block Image Sources
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.
After choosing your dynamic source, select Post Date, and then a dropdown will appear below which will allow you to select the date format
From there, you can select the date format that you want to use.
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
List of Custom Date Formats
For more information on custom date formats, you can visit this link 👍🏼
Query Loops Compatibility
When using Dynamic Content with the Query Loop, be sure to use the "Current Post" as the Dynamic Source.
Query Loops 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 buttons link to the post's page