{"id":19935,"date":"2018-05-17T20:30:54","date_gmt":"2018-05-18T00:30:54","guid":{"rendered":"https:\/\/wpdeveloper.net\/?p=19935"},"modified":"2020-04-12T17:23:37","modified_gmt":"2020-04-12T21:23:37","slug":"elementor-theme-builder-dynamic-content","status":"publish","type":"post","link":"https:\/\/wpdeveloper.com\/elementor-theme-builder-dynamic-content\/","title":{"rendered":"Elementor Theme Builder- Dynamic Content"},"content":{"rendered":"\t\t
\n\t\t\t\t\t\t
\n\t\t\t\t\t\t
\n\t\t\t\t\t
\n\t\t\t
\n\t\t\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t\t\t\t\t\t

How great is Elementor 2.0 Theme Builder? We all know the answer. It redefines the way you build websites with Elementor. However, this blog is not about praising Elementor<\/a><\/b>. In this blog, you will see how you can use Dynamic Content.<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t

\n\t\t\t\t\t\t
\n\t\t\t\t\t
\n\t\t\t
\n\t\t\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t\t

Dynamic Content<\/h2>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t\t\t\t\t\t

First, lets visualize the difference between Static and Dynamic Content. In case of Static Pages, like Landing Page or Home Page, the content stays the same. Same is true for their layout.<\/p>

On the other hand, Dynamic Pages like Blog pages, have dynamic content. You will have different texts, media files and layout in different blog pages. Similarly, their relative sequence and positions will also vary from post to post.<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t

\n\t\t\t\t\t\t
\n\t\t\t\t\t
\n\t\t\t
\n\t\t\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t\t

How can You Benefit From Using Dynamic Content?<\/h2>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t\t\t\t\t\t

Suppose, you have a WordPress plugins website. Now, you will have introductory blogs<\/b> for different plugins. You might have one or two plugin comparison blogs<\/b>. Also, you might have different plugin review blogs<\/b>. The three types of blog pages will have different layouts.\u00a0<\/p>

Okay, so now think about a scenario where you have to write another plugins comparison blog. And this needs to be completed on an emergency basis. What would you do? Will you have enough time to complete the work in the traditional way of page building. You need to write the content first. But what about the layout- the sequence of content types in the blog.\u00a0<\/p>

No worries! Elementor addressed this exact issue with their latest update.\u00a0<\/p>

\u00a0<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t

\n\t\t\t\t\t\t
\n\t\t\t\t\t
\n\t\t\t
\n\t\t\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t\t

Elementor 2.0 Theme Builder<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t\t\t\t\t\t

So, what is the solution Elementor Team came up with? Dynamic Content!\u00a0<\/b><\/p>

Hopefully you understand the nature of dynamic content by reading the previous sections. Now, lets learn about the steps involved in creating and using dynamic content with Elementor.<\/p>

Lets use the previous scenario one more time where you have a WordPress plugins website. with Elementor 2.0, you can save one plugins comparison blog<\/b> layout as a template. And later on, when you are creating a new but similar comparison blog, you can use the previously built template and pull content from some other source. The new content will fill in the previously designed content framework.\u00a0<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t

\n\t\t\t\t\t\t
\n\t\t\t\t\t
\n\t\t\t
\n\t\t\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t\t

Using Dynamic Content<\/h2>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t\t\t\t\t\t

Lets try this new feature. Open your WordPress Dashboard and open Elementor. Open the Add New Template Popup and from the first field under Choose Template Type<\/b>\u00a0 drop-down select Single<\/b>. Give a name to the template and click on Create Template.\u00a0<\/b><\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t

\n\t\t\t\t\t\t
\n\t\t\t\t\t
\n\t\t\t
\n\t\t\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\"Elementor\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t
\n\t\t\t\t\t\t
\n\t\t\t\t\t
\n\t\t\t
\n\t\t\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t\t\t\t\t\t

After you click Create Template, Elementor will load that layout for you. Take time and observe the different types of elements used in the layout. You will notice that the templates are built with a new set of elements that were not available with the old versions of Elementor.<\/p>

The template will have Post Content, Post Excerpt, Post Info, Share Buttons, Author Box, Post Navigation<\/b> and so on. You might ask yourself, why isn’t the templates built with the old elements that came with the Elementor. Like- Image, Heading, Text Editor. Well, this is because Elementor 2.0 has introduced a new approach to website building with.\u00a0<\/p>

Elementor 2.0 is dubbed as<\/span>\u00a0<\/span>Theme Builder<\/span>. With this version, you can create and edit each and every part of your website.<\/span>The old elements are still there, but there is also a new set of elements- Theme Elements.<\/b><\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t

\n\t\t\t\t\t\t
\n\t\t\t\t\t
\n\t\t\t
\n\t\t\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t\t

Creating the Framework<\/h2>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t\t\t\t\t\t

Are you happy with the layout? If not, adjust the layout as you wish. Add new elements or replace existing ones. Once you are happy with the layout, save the template.<\/p>

It is a better idea to use the Theme Elements <\/b>to create such blog layouts. From the left panel of the Elementor Interface search for Theme Elements. You will have Post Title, Post Excerpt, Site Title, Featured Image and so on.<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t

\n\t\t\t\t\t\t
\n\t\t\t\t\t
\n\t\t\t
\n\t\t\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\"Elementor\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t
\n\t\t\t\t\t\t
\n\t\t\t\t\t
\n\t\t\t
\n\t\t\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t\t

Why use Theme Elements?<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t\t\t\t\t\t

As previously mentioned, Elementor 2.0 comes with Theme Elements. And it is advised to use the newly introduced elements for using dynamic template layouts. But why is so?<\/p>

It is so that Elementor <\/a><\/b>can accurately read the content. Suppose you have built a Blog template that you will use for every plugins comparison page from now on. So next time you are writing a comparison blog, you only need to write the content. Later on you can pull the content into the template you have built previously.<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t

\n\t\t\t\t\t\t
\n\t\t\t\t\t
\n\t\t\t
\n\t\t\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t\t

Using Different Content<\/h2>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t\t\t\t\t\t

Once you are happy with the layout you might want to see how the newly created framework looks on different blog posts. To do so, click on the Settings Icon and go to Preview Settings<\/b>. Type in texts in the second filed and it will bring up suggestions about your existing blogs. Choose any of them and you are done. Now the layout will pull all the content from that source into the newly built framework.\u00a0<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t

\n\t\t\t\t\t\t
\n\t\t\t\t\t
\n\t\t\t
\n\t\t\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\"Elementor\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t
\n\t\t\t\t\t\t
\n\t\t\t\t\t
\n\t\t\t
\n\t\t\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t\t

Finishing it Off!<\/h2>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t\t\t\t\t\t

Now at last, you want to specify conditions for the blog template. You can assign this newly created template to any specific category or Tag.\u00a0<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t

\n\t\t\t\t\t\t
\n\t\t\t\t\t
\n\t\t\t
\n\t\t\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\"\"\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t
\n\t\t\t\t\t\t
\n\t\t\t\t\t
\n\t\t\t
\n\t\t\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t\t\t\t\t\t

Want to learn more about Elementor 2.0? Did you know you can create Header Templates with Elementor? If no, check out this blog\u00a0Elementor Theme Builder-Header Template.\u00a0<\/a><\/b><\/p>\t\t

\n\t\t\t\t\t
\n\t\t\t\t\t\t
\n\t\t\t\t\t
\n\t\t\t
\n\t\t\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t\t\t\t\t\t

Will You Recommend Our Plugin To Your Friends?<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t

\n\t\t\t\t
\n\t\t\t\t\t\t\t\t\t
\n\t\t\t\t\t\n\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t\tIf Yes, Kindly Leave a Review on Facebook<\/span>\n\t\t\t\t\t<\/span>\n\t\t\t\t\t<\/a>\n\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"

How great is Elementor 2.0 Theme Builder? We all know the answer. It redefines the way you build websites with Elementor. However, this blog is not about praising Elementor. In this blog, you will see how you can use Dynamic Content. Dynamic Content First, lets visualize the difference between Static and Dynamic Content. In case […]<\/p>\n","protected":false},"author":2045,"featured_media":20041,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_eb_attr":"","inline_featured_image":false,"_eb_data_table":"","footnotes":""},"categories":[108,70],"tags":[154,152,141,155],"class_list":["post-19935","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-elementor","category-news","tag-elementor-dynamic-content","tag-elementor-theme-builder","tag-tips-and-tricks","tag-wordpress-tutorial"],"nelio_content":{"autoShareEndMode":"never","automationSources":{"useCustomSentences":false,"customSentences":[]},"efiAlt":"","efiUrl":"","followers":[2045],"highlights":[],"isAutoShareEnabled":true,"networkImageIds":[],"permalinkQueryArgs":[],"series":[],"suggestedReferences":[]},"views":3462,"_links":{"self":[{"href":"https:\/\/wpdeveloper.com\/wp-json\/wp\/v2\/posts\/19935","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/wpdeveloper.com\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/wpdeveloper.com\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/wpdeveloper.com\/wp-json\/wp\/v2\/users\/2045"}],"replies":[{"embeddable":true,"href":"https:\/\/wpdeveloper.com\/wp-json\/wp\/v2\/comments?post=19935"}],"version-history":[{"count":16,"href":"https:\/\/wpdeveloper.com\/wp-json\/wp\/v2\/posts\/19935\/revisions"}],"predecessor-version":[{"id":438512,"href":"https:\/\/wpdeveloper.com\/wp-json\/wp\/v2\/posts\/19935\/revisions\/438512"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/wpdeveloper.com\/wp-json\/wp\/v2\/media\/20041"}],"wp:attachment":[{"href":"https:\/\/wpdeveloper.com\/wp-json\/wp\/v2\/media?parent=19935"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/wpdeveloper.com\/wp-json\/wp\/v2\/categories?post=19935"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/wpdeveloper.com\/wp-json\/wp\/v2\/tags?post=19935"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}