{"id":2714,"date":"2021-06-22T10:21:32","date_gmt":"2021-06-22T10:21:32","guid":{"rendered":"https:\/\/elementor.com\/academy\/?p=2714"},"modified":"2023-02-21T11:09:18","modified_gmt":"2023-02-21T11:09:18","slug":"dynamic-content-theme-builder-tutorial","status":"publish","type":"post","link":"https:\/\/elementor.com\/academy\/dynamic-content-theme-builder-tutorial\/","title":{"rendered":"Dynamic Content &#8211; Theme Builder Tutorial"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-post\" data-elementor-id=\"2714\" class=\"elementor elementor-2714\" data-elementor-post-type=\"post\">\n\t\t\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-4a8df31c elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"4a8df31c\" data-element_type=\"section\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-2dbb1b8e\" data-id=\"2dbb1b8e\" data-element_type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-1e53013a elementor-widget elementor-widget-video\" data-id=\"1e53013a\" data-element_type=\"widget\" data-settings=\"{&quot;youtube_url&quot;:&quot;https:\\\/\\\/www.youtube.com\\\/watch?v=ruMtMAVVF_Y&quot;,&quot;video_type&quot;:&quot;youtube&quot;,&quot;controls&quot;:&quot;yes&quot;}\" data-widget_type=\"video.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<div class=\"elementor-wrapper elementor-open-inline\">\n\t\t\t<div class=\"elementor-video\"><\/div>\t\t<\/div>\n\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<section class=\"elementor-section elementor-top-section elementor-element elementor-element-353c6b61 elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"353c6b61\" data-element_type=\"section\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-77a5dcff\" data-id=\"77a5dcff\" data-element_type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-646dfd9c elementor-tabs-view-horizontal elementor-widget elementor-widget-tabs\" data-id=\"646dfd9c\" data-element_type=\"widget\" data-widget_type=\"tabs.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<div class=\"elementor-tabs\">\n\t\t\t<div class=\"elementor-tabs-wrapper\" role=\"tablist\" >\n\t\t\t\t\t\t\t\t\t<div id=\"elementor-tab-title-1681\" class=\"elementor-tab-title elementor-tab-desktop-title\" aria-selected=\"true\" data-tab=\"1\" role=\"tab\" tabindex=\"0\" aria-controls=\"elementor-tab-content-1681\" aria-expanded=\"false\">Overview<\/div>\n\t\t\t\t\t\t\t\t\t<div id=\"elementor-tab-title-1682\" class=\"elementor-tab-title elementor-tab-desktop-title\" aria-selected=\"false\" data-tab=\"2\" role=\"tab\" tabindex=\"-1\" aria-controls=\"elementor-tab-content-1682\" aria-expanded=\"false\">Transcript<\/div>\n\t\t\t\t\t\t\t<\/div>\n\t\t\t<div class=\"elementor-tabs-content-wrapper\" role=\"tablist\" aria-orientation=\"vertical\">\n\t\t\t\t\t\t\t\t\t<div class=\"elementor-tab-title elementor-tab-mobile-title\" aria-selected=\"true\" data-tab=\"1\" role=\"tab\" tabindex=\"0\" aria-controls=\"elementor-tab-content-1681\" aria-expanded=\"false\">Overview<\/div>\n\t\t\t\t\t<div id=\"elementor-tab-content-1681\" class=\"elementor-tab-content elementor-clearfix\" data-tab=\"1\" role=\"tabpanel\" aria-labelledby=\"elementor-tab-title-1681\" tabindex=\"0\" hidden=\"false\"><p>Until now, you were only able to build static content using page builders. Landing pages, homepage, about&#8230; You created each page one at a time.<\/p><p>Blog post templates, archive templates and other dynamic content was either preset by the theme you installed, or required tons of coding.<\/p><p>Now, Elementor introduces a whole new way to build dynamic content &#8211; using theme elements like featured image, post title, author box and so on. Build the framework, and the content gets filled automatically from your website, for new as well as old posts and pages.<\/p><p>Design it once dynamically and visually, and apply it everywhere on your site.<\/p><p>Building blogs, stores, portfolio pages, ACF and Toolset content&#8230; creating anything on WordPress, just got a whole lot easier and code-free, the fast Elementor way<\/p><\/div>\n\t\t\t\t\t\t\t\t\t<div class=\"elementor-tab-title elementor-tab-mobile-title\" aria-selected=\"false\" data-tab=\"2\" role=\"tab\" tabindex=\"-1\" aria-controls=\"elementor-tab-content-1682\" aria-expanded=\"false\">Transcript<\/div>\n\t\t\t\t\t<div id=\"elementor-tab-content-1682\" class=\"elementor-tab-content elementor-clearfix\" data-tab=\"2\" role=\"tabpanel\" aria-labelledby=\"elementor-tab-title-1682\" tabindex=\"0\" hidden=\"hidden\"><p><br \/>hey everyone it&#8217;s Cassie from Elementor<br \/>if you&#8217;ve used Elementor you know how<br \/>easy it is to design static content like<br \/>your home page or contact page you<br \/>design it live and see the results right<br \/>before your eyes with Elementor 2.0 and<br \/>its theme builder capabilities it&#8217;s just<br \/>as easy to design dynamic elements like<br \/>your header footer or blog posts it&#8217;s<br \/>all possible using our dynamic widgets<br \/>which can be found in the panel under<br \/>the category theme elements so what are<br \/>dynamic widgets while static widgets<br \/>display content that you enter manually<br \/>dynamic widgets draw the content from<br \/>the website or from the current pages<br \/>where they&#8217;re applied let&#8217;s take the<br \/>post title widget this widget displays<br \/>the post title of the page that&#8217;s why<br \/>it&#8217;s called dynamic because it changes<br \/>according to the page it&#8217;s used on the<br \/>same goes for the post content and<br \/>featured image widget after adding them<br \/>preview how it looks then every post<br \/>that will use this template will display<br \/>the same framework you might be<br \/>wondering how can you design a page<br \/>without seeing its content Keep Calm we<br \/>got you covered<br \/>click on preview this eye icon and under<br \/>settings choose the content to display<br \/>as a preview for the template you&#8217;re<br \/>working on here we have the post title<br \/>widget so we&#8217;ll set it to show the<br \/>content from our contact page you see<br \/>the contact title is now displayed if we<br \/>switch it to a different post<br \/>click update abracadabra the title from<br \/>the new source is displayed dynamic<br \/>capabilities also appear in the classic<br \/>widgets anywhere you see this database<br \/>barrel icon clicking on the icon will<br \/>switch the widget content from being<br \/>static to dynamic text is not the only<br \/>dynamic content links can be dynamic too<br \/>you can add a link to the post to<br \/>comments etc you can define a dynamic<br \/>image<br \/>featured image author profile picture or<br \/>site logo several of the dynamic widgets<br \/>include a wrench icon clicking on it<br \/>will open up a pop-up with fields<br \/>allowing you to add content before and<br \/>after the text this is helpful for<br \/>adding static content before or after<br \/>dynamic content use the dynamic<br \/>capabilities to design archive pages<br \/>single posts search result pages and any<br \/>page or any part of your website sky&#8217;s<br \/>the limit<br \/>thanks for tuning in for more tutorials<br \/>subscribe to our YouTube channel<\/p><\/div>\n\t\t\t\t\t\t\t<\/div>\n\t\t<\/div>\n\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":"<p>Overview Transcript Overview Until now, you were only able to build static content using page builders. Landing pages, homepage, about\u2026 You created each page one at a time. Blog post templates, archive templates and other dynamic content was either preset by the theme you installed, or required tons of coding. Now, Elementor introduces a whole [&hellip;]<\/p>\n","protected":false},"author":8,"featured_media":4132,"comment_status":"closed","ping_status":"open","sticky":false,"template":"elementor_theme","format":"standard","meta":{"footnotes":""},"categories":[5,18],"tags":[41],"class_list":["post-2714","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-dynamic-design","category-theme-builder","tag-guides-tutorials"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v26.8 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>Dynamic Content - Theme Builder Tutorial - Academy<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/elementor.com\/academy\/dynamic-content-theme-builder-tutorial\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Dynamic Content - Theme Builder Tutorial - Academy\" \/>\n<meta property=\"og:description\" content=\"Overview Transcript Overview Until now, you were only able to build static content using page builders. Landing pages, homepage, about\u2026 You created each page one at a time. Blog post templates, archive templates and other dynamic content was either preset by the theme you installed, or required tons of coding. Now, Elementor introduces a whole [&hellip;]\" \/>\n<meta property=\"og:url\" content=\"https:\/\/elementor.com\/academy\/dynamic-content-theme-builder-tutorial\/\" \/>\n<meta property=\"og:site_name\" content=\"Academy\" \/>\n<meta property=\"article:published_time\" content=\"2021-06-22T10:21:32+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2023-02-21T11:09:18+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/elementor.com\/academy\/wp-content\/uploads\/2021\/06\/Build-Theme-Part-With-Dynamic-Content-1.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"1921\" \/>\n\t<meta property=\"og:image:height\" content=\"1080\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"author\" content=\"Hodaya\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Hodaya\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"3 minutes\" \/>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Dynamic Content - Theme Builder Tutorial - Academy","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/elementor.com\/academy\/dynamic-content-theme-builder-tutorial\/","og_locale":"en_US","og_type":"article","og_title":"Dynamic Content - Theme Builder Tutorial - Academy","og_description":"Overview Transcript Overview Until now, you were only able to build static content using page builders. Landing pages, homepage, about\u2026 You created each page one at a time. Blog post templates, archive templates and other dynamic content was either preset by the theme you installed, or required tons of coding. Now, Elementor introduces a whole [&hellip;]","og_url":"https:\/\/elementor.com\/academy\/dynamic-content-theme-builder-tutorial\/","og_site_name":"Academy","article_published_time":"2021-06-22T10:21:32+00:00","article_modified_time":"2023-02-21T11:09:18+00:00","og_image":[{"width":1921,"height":1080,"url":"https:\/\/elementor.com\/academy\/wp-content\/uploads\/2021\/06\/Build-Theme-Part-With-Dynamic-Content-1.jpg","type":"image\/jpeg"}],"author":"Hodaya","twitter_card":"summary_large_image","twitter_misc":{"Written by":"Hodaya","Est. reading time":"3 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/elementor.com\/academy\/dynamic-content-theme-builder-tutorial\/#article","isPartOf":{"@id":"https:\/\/elementor.com\/academy\/dynamic-content-theme-builder-tutorial\/"},"author":{"name":"Hodaya","@id":"https:\/\/elementor.com\/academy\/#\/schema\/person\/ff9f2661f3df53ae5842a9ad15853d1c"},"headline":"Dynamic Content &#8211; Theme Builder Tutorial","datePublished":"2021-06-22T10:21:32+00:00","dateModified":"2023-02-21T11:09:18+00:00","mainEntityOfPage":{"@id":"https:\/\/elementor.com\/academy\/dynamic-content-theme-builder-tutorial\/"},"wordCount":564,"publisher":{"@id":"https:\/\/elementor.com\/academy\/#organization"},"image":{"@id":"https:\/\/elementor.com\/academy\/dynamic-content-theme-builder-tutorial\/#primaryimage"},"thumbnailUrl":"https:\/\/elementor.com\/academy\/wp-content\/uploads\/2021\/06\/Build-Theme-Part-With-Dynamic-Content-1.jpg","keywords":["Guides and Tutorials"],"articleSection":["Dynamic Design","Theme Builder"],"inLanguage":"en-US"},{"@type":"WebPage","@id":"https:\/\/elementor.com\/academy\/dynamic-content-theme-builder-tutorial\/","url":"https:\/\/elementor.com\/academy\/dynamic-content-theme-builder-tutorial\/","name":"Dynamic Content - Theme Builder Tutorial - Academy","isPartOf":{"@id":"https:\/\/elementor.com\/academy\/#website"},"primaryImageOfPage":{"@id":"https:\/\/elementor.com\/academy\/dynamic-content-theme-builder-tutorial\/#primaryimage"},"image":{"@id":"https:\/\/elementor.com\/academy\/dynamic-content-theme-builder-tutorial\/#primaryimage"},"thumbnailUrl":"https:\/\/elementor.com\/academy\/wp-content\/uploads\/2021\/06\/Build-Theme-Part-With-Dynamic-Content-1.jpg","datePublished":"2021-06-22T10:21:32+00:00","dateModified":"2023-02-21T11:09:18+00:00","breadcrumb":{"@id":"https:\/\/elementor.com\/academy\/dynamic-content-theme-builder-tutorial\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/elementor.com\/academy\/dynamic-content-theme-builder-tutorial\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/elementor.com\/academy\/dynamic-content-theme-builder-tutorial\/#primaryimage","url":"https:\/\/elementor.com\/academy\/wp-content\/uploads\/2021\/06\/Build-Theme-Part-With-Dynamic-Content-1.jpg","contentUrl":"https:\/\/elementor.com\/academy\/wp-content\/uploads\/2021\/06\/Build-Theme-Part-With-Dynamic-Content-1.jpg","width":1921,"height":1080},{"@type":"BreadcrumbList","@id":"https:\/\/elementor.com\/academy\/dynamic-content-theme-builder-tutorial\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Elementor","item":"https:\/\/elementor.com\/"},{"@type":"ListItem","position":2,"name":"Academy","item":"https:\/\/elementor.com\/academy\/"},{"@type":"ListItem","position":3,"name":"Dynamic Design","item":"https:\/\/elementor.com\/academy\/dynamic-design\/"},{"@type":"ListItem","position":4,"name":"Dynamic Content &#8211; Theme Builder Tutorial"}]},{"@type":"WebSite","@id":"https:\/\/elementor.com\/academy\/#website","url":"https:\/\/elementor.com\/academy\/","name":"Elementor Academy","description":"Page Builder for WordPress","publisher":{"@id":"https:\/\/elementor.com\/academy\/#organization"},"alternateName":"https:\/\/elementor.com\/academy\/wp-content\/uploads\/2021\/02\/Elementor-Logo.png","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/elementor.com\/academy\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/elementor.com\/academy\/#organization","name":"Elementor Academy","alternateName":"https:\/\/elementor.com\/academy\/wp-content\/uploads\/2021\/02\/Elementor-Logo.png","url":"https:\/\/elementor.com\/academy\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/elementor.com\/academy\/#\/schema\/logo\/image\/","url":"https:\/\/elementor.com\/academy\/wp-content\/uploads\/2022\/11\/e-logo.svg","contentUrl":"https:\/\/elementor.com\/academy\/wp-content\/uploads\/2022\/11\/e-logo.svg","width":490,"height":85,"caption":"Elementor Academy"},"image":{"@id":"https:\/\/elementor.com\/academy\/#\/schema\/logo\/image\/"}},{"@type":"Person","@id":"https:\/\/elementor.com\/academy\/#\/schema\/person\/ff9f2661f3df53ae5842a9ad15853d1c","name":"Hodaya","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/elementor.com\/academy\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/324f2d5cff44331b747d766f10e31793b1e29ad4f98f129d409760191f88ccc5?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/324f2d5cff44331b747d766f10e31793b1e29ad4f98f129d409760191f88ccc5?s=96&d=mm&r=g","caption":"Hodaya"},"url":"https:\/\/elementor.com\/academy\/author\/hodaya\/"}]}},"_links":{"self":[{"href":"https:\/\/elementor.com\/academy\/wp-json\/wp\/v2\/posts\/2714","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/elementor.com\/academy\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/elementor.com\/academy\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/elementor.com\/academy\/wp-json\/wp\/v2\/users\/8"}],"replies":[{"embeddable":true,"href":"https:\/\/elementor.com\/academy\/wp-json\/wp\/v2\/comments?post=2714"}],"version-history":[{"count":1,"href":"https:\/\/elementor.com\/academy\/wp-json\/wp\/v2\/posts\/2714\/revisions"}],"predecessor-version":[{"id":9434,"href":"https:\/\/elementor.com\/academy\/wp-json\/wp\/v2\/posts\/2714\/revisions\/9434"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/elementor.com\/academy\/wp-json\/wp\/v2\/media\/4132"}],"wp:attachment":[{"href":"https:\/\/elementor.com\/academy\/wp-json\/wp\/v2\/media?parent=2714"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/elementor.com\/academy\/wp-json\/wp\/v2\/categories?post=2714"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/elementor.com\/academy\/wp-json\/wp\/v2\/tags?post=2714"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}