{"id":6553,"date":"2021-09-06T19:18:16","date_gmt":"2021-09-06T17:18:16","guid":{"rendered":"https:\/\/lacolmenatecnologica.com\/elementor-section-templates\/"},"modified":"2026-09-02T19:42:55","modified_gmt":"2026-09-02T17:42:55","slug":"elementor-section-templates","status":"publish","type":"post","link":"https:\/\/lacolmenatecnologica.com\/en\/elementor-section-templates\/","title":{"rendered":"Elementor Section Templates"},"content":{"rendered":"\n

Elementor allows us to save any section as a template, which we can then use in other documents on our website as many times as we want, or export it for use in other documents. We can use these templates independently or globally. If used independently, modifying it will not affect other instances of the same template. If used globally (using the Template<\/strong> widget), when you modify the template, all its instances will also change. <\/p>\n\n

Saving Sections as Templates<\/h2>\n\n
    \n
  1. Select the section you want to save and right-click<\/strong> on \"Elementor<\/li>\n\n\n\n
  2. From the context menu, click Save as Template<\/strong>.<\/li>\n\n\n\n
  3. Give it a name and click Save.<\/strong><\/li>\n<\/ol>\n
    \n
    \"Save<\/figure>\n<\/div>\n

    How to Insert a Saved Section Template into a Document<\/h2>\n\n

    You can use the templates you have saved in any document on your website, even in posts using the template shortcode. Let’s see how. <\/p>\n\n

    Insert Independent Template from the Library<\/h3>\n\n

    If we insert the template this way, it will be independent of the global template, and any changes we make to it will not affect other instances.<\/p>\n

    \n
    \"Insert\n\t\t\t\n\t\t\t\t\n\t\t\t<\/svg>\n\t\t<\/button><\/figure>\n<\/div>\n
      \n
    1. Click the Add Template<\/em> icon \"Add in the Elementor Editor.<\/li>\n\n\n\n
    2. In the pop-up window, click the My Templates<\/strong> tab.<\/li>\n\n\n\n
    3. You will see a list of all the templates you have saved. Click the Insert<\/strong> button for the template you want to use. If you are unsure if it’s the template you need, you can click \"Preview\"\/ Preview<\/strong> before inserting. <\/li>\n\n\n\n
    4. A small pop-up window will appear: Import Document Settings<\/strong>. In this case, since it’s a section template, it’s best to click No<\/strong>. <\/li>\n<\/ol>\n\n

      Insert Section Template as Global<\/h3>\n\n

      To insert a section template that we have previously saved as a global template, we will need to do so using the Template<\/em> widget. You should keep in mind that since it is a section template, when inserted within another section via the Template<\/em> widget, both sections will retain all their configurations. <\/p>\n

      \n
      \"Insert\n\t\t\t\n\t\t\t\t\n\t\t\t<\/svg>\n\t\t<\/button><\/figure>\n<\/div>\n
        \n
      1. In the Elementor Editor, search for the Template<\/strong> widget and drag it to a section or to the Drag widget here<\/em> box.<\/li>\n\n\n\n
      2. Click the Choose Template<\/strong> selector and type the name or part of the name of the template you want to insert. Once you see it in the selector, click on it.<\/li>\n<\/ol>\n\n

        Insert Template into a Blog Post<\/h3>\n\n

        We can insert a section template into a blog post using the WordPress Gutenberg Block Editor, although my recommendation is not to use Elementor in blog posts. Why? Because today Elementor might be the best page builder for you, but in the future, who knows? I used WP Bakery (Visual Composer) before, and at the time, I thought it was fantastic, but now, compared to Elementor, it seems terrible. <\/p>\n\n

        Imagine that in the future, a new page builder emerges that surpasses Elementor, for example, Gutenberg, and you want to revamp your website with this new builder. Revamping the pages that make up your website would be a relatively manageable task, but revamping hundreds of blog posts would be unfeasible or too laborious, and those posts would already be well-positioned, so it’s not a matter of losing them. That’s why my recommendation is to only use Gutenberg for blog posts. <\/p>\n

        \n
        \"Insert\n\t\t\t\n\t\t\t\t\n\t\t\t<\/svg>\n\t\t<\/button><\/figure>\n<\/div>\n
          \n
        1. In the WordPress Backend, select Templates<\/strong> > Saved Templates<\/strong>.<\/li>\n\n\n\n
        2. Click on the shortcode of the template you want to use, then copy this code with CTRL + C<\/strong> (Windows) | CMD + C<\/strong> (Mac) or Right-click > Copy<\/strong> (Windows) | CMD + click > Copy<\/strong> (Mac).<\/li>\n\n\n\n
        3. Now open the post where you want to insert the template.<\/li>\n\n\n\n
        4. Use Gutenberg’s Shortcode<\/strong> block and paste the code you previously copied there.<\/li>\n<\/ol>\n\n

          Modify Section Template <\/h2>\n\n

          From the Elementor Editor<\/h3>\n\n

          All changes you make to a template will be reflected in all its instances.<\/p>\n\n

            \n
          1. Click on the template block you want to edit.<\/li>\n\n\n\n
          2. Now, in the Content<\/em> tab of the settings column, click the button \"Edit<\/li>\n<\/ol>\n\n

            From the Templates Menu<\/h3>\n
            \n
            \"Edit\n\t\t\t\n\t\t\t\t\n\t\t\t<\/svg>\n\t\t<\/button><\/figure>\n<\/div>\n
              \n
            1. In the WordPress Backend, select Templates<\/strong> > Saved Templates<\/strong>.<\/li>\n\n\n\n
            2. Hover over the template you want to edit and click Edit with Elementor<\/strong>.<\/li>\n<\/ol>\n\n

              How to Export a Template<\/h2>\n\n

              We can export templates (to use them in another web project) in .json<\/strong> format with all their components, including images and other media library elements. However, it’s important to note that these media are not embedded in the .json<\/strong> file (a lightweight file composed only of XML-like code); they are only referenced in its code via a URL<\/strong>. When the template is imported, that’s when this file (image, video, etc.) is stored in our media library. This means that if the exported media is deleted from the source, it cannot be imported. <\/p>\n\n

              Export Template from Saved Templates<\/h3>\n
              \n
              \"Export\n\t\t\t\n\t\t\t\t\n\t\t\t<\/svg>\n\t\t<\/button><\/figure>\n<\/div>\n
                \n
              1. In the WordPress Backend, select Templates<\/strong> > Saved Templates<\/strong>.<\/li>\n\n\n\n
              2. Hover over the template you want to edit and click Export Template<\/strong>.<\/li>\n\n\n\n
              3. In the Save As<\/strong> pop-up window, choose the location and click the Save<\/strong> button.<\/li>\n<\/ol>\n\n

                Export Templates from the Elementor Editor<\/h3>\n
                \n
                \"Export\n\t\t\t\n\t\t\t\t\n\t\t\t<\/svg>\n\t\t<\/button><\/figure>\n<\/div>\n
                  \n
                1. Click the Add Template<\/em> icon \"Add in the Elementor Editor.<\/li>\n\n\n\n
                2. In the pop-up window, click the My Templates<\/strong> tab.<\/li>\n\n\n\n
                3. You will see a list of all the templates you have saved. Click the Insert<\/strong> button for the template you want to use. If you are unsure if it’s the template you need, you can click \"Preview\"\/ Preview<\/strong> before inserting. <\/li>\n<\/ol>\n\n

                  How to Import a Template<\/h2>\n\n

                  We can import templates into our project; these must be in .json<\/strong> format. When we import a template that contains media files such as images<\/em>, videos<\/em>, PDF files<\/em>, etc.<\/em>, these files are uploaded to our own WordPress Media Library. Below you can see an example of the code from a real .json<\/strong> file; it’s a very simple section with one column and a widget with an image. I have highlighted the URL or link to the image in bold<\/strong>. <\/p>\n\n

                  {\"content\":[{\"id\":\"63358d39\",\"settings\":[],\"elements\":[{\"id\":\"78eb379f\",\"settings\":{\"_column_size\":100,\"_inline_size\":null},\"elements\":[{\"id\":\"13d2289b\",\"settings\":{\"image\":{\"url\":\"https:\/\/elementor.lacolmenatecnologica.com\/wp-content\/uploads\/2021\/07\/la-colmena-tecnologica-logo.png<\/strong>\",\"id\":974,\"alt\":\"\",\"source\":\"library\"}},\"elements\":[],\"isInner\":false,\"widgetType\":\"image\",\"elType\":\"widget\"}],\"isInner\":false,\"elType\":\"column\"}],\"isInner\":false,\"elType\":\"section\"}],\"page_settings\":[],\"version\":\"0.4\",\"title\":\"Plantilla la Colmena\",\"type\":\"section\"}<\/code><\/pre>\n\n
                  As you can see, the .json<\/strong> file does not store media (images, videos, …); it stores links to their location in the source project from which they were exported. If that image is deleted from the source project, when we import this template into another project, the image will not be imported. <\/p>\n\n
                  Import a Template from Saved Templates<\/h3>\n
                  \n
                  \"Import\n\t\t\t\n\t\t\t\t\n\t\t\t<\/svg>\n\t\t<\/button><\/figure>\n<\/div>\n
                    \n
                  1. In the WordPress Backend, select Templates<\/strong> > Saved Templates<\/strong>.<\/li>\n\n\n\n
                  2. At the top, click the Import Templates<\/strong> button.<\/li>\n\n\n\n
                  3. Click the Choose File<\/strong> button, and in the Open<\/em> pop-up window, select the .json<\/strong> file you want to import and click the Open<\/strong> button.<\/li>\n\n\n\n
                  4. Now click the Import Now<\/strong> button.<\/li>\n<\/ol>\n\n
                    Import Template from the Elementor Editor<\/h3>\n
                    \n
                    \"Import\n\t\t\t\n\t\t\t\t\n\t\t\t<\/svg>\n\t\t<\/button><\/figure>\n<\/div>\n
                      \n
                    1. Click the Add Template<\/em> icon \"Add in the Elementor Editor.<\/li>\n\n\n\n
                    2. In the pop-up window, click the My Templates<\/strong> tab.<\/li>\n\n\n\n
                    3. At the top, click the \"Import Import Template<\/em> icon.<\/li>\n\n\n\n
                    4. Click the CHOOSE FILE<\/strong> button, and in the Open<\/em> pop-up window, select the .json<\/strong> file you want to import and click the Open<\/strong> button.<\/li>\n\n\n\n
                    5. You should now see this new template in the list along with all other templates. Click the Insert<\/strong> button for the template to insert it.<\/li>\n<\/ol>\n","protected":false},"excerpt":{"rendered":"
                      Elementor allows us to save any section as a template, which we can then use in other documents on our website as many times as we want, or export it for use in other documents. We can use these templates independently or globally. If used independently, modifying it will not affect other instances of the […]<\/p>\n","protected":false},"author":4,"featured_media":6554,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_seopress_titles_title":"Elementor Section Templates for Faster WordPress Design","_seopress_titles_desc":"Elementor allows you to save any section as a template, which you can then reuse in other documents on your website as many times as you wish\u2026","_seopress_robots_index":"","_seopress_robots_follow":"","_seopress_robots_imageindex":"","_seopress_robots_snippet":"","_seopress_robots_primary_cat":"none","_seopress_robots_breadcrumbs":"","_seopress_robots_freeze_modified_date":"","_seopress_robots_custom_modified_date":"","_seopress_robots_canonical":"","_seopress_social_fb_title":"","_seopress_social_fb_desc":"","_seopress_social_fb_img":"","_seopress_social_fb_img_attachment_id":0,"_seopress_social_fb_img_width":0,"_seopress_social_fb_img_height":0,"_seopress_social_twitter_title":"","_seopress_social_twitter_desc":"","_seopress_social_twitter_img":"","_seopress_social_twitter_img_attachment_id":0,"_seopress_social_twitter_img_width":0,"_seopress_social_twitter_img_height":0,"_seopress_redirections_value":"","_seopress_redirections_enabled":"","_seopress_redirections_enabled_regex":"","_seopress_redirections_logged_status":"both","_seopress_redirections_param":"","_seopress_redirections_type":301,"_seopress_analysis_target_kw":"","_seopress_news_disabled":"","_seopress_video_disabled":"","_seopress_video":[],"_seopress_pro_schemas_manual":[],"_seopress_pro_rich_snippets_disable_all":"","_seopress_pro_rich_snippets_disable":[],"_seopress_pro_schemas":[],"footnotes":"","_bricks_page_content_2":[],"_bricks_page_header_2":[],"_bricks_page_footer_2":[]},"categories":[374],"tags":[379,385],"class_list":["post-6553","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-elementor","tag-elementor-templates","tag-web-design"],"_links":{"self":[{"href":"https:\/\/lacolmenatecnologica.com\/en\/wp-json\/wp\/v2\/posts\/6553","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/lacolmenatecnologica.com\/en\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/lacolmenatecnologica.com\/en\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/lacolmenatecnologica.com\/en\/wp-json\/wp\/v2\/users\/4"}],"replies":[{"embeddable":true,"href":"https:\/\/lacolmenatecnologica.com\/en\/wp-json\/wp\/v2\/comments?post=6553"}],"version-history":[{"count":1,"href":"https:\/\/lacolmenatecnologica.com\/en\/wp-json\/wp\/v2\/posts\/6553\/revisions"}],"predecessor-version":[{"id":6555,"href":"https:\/\/lacolmenatecnologica.com\/en\/wp-json\/wp\/v2\/posts\/6553\/revisions\/6555"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/lacolmenatecnologica.com\/en\/wp-json\/wp\/v2\/media\/6554"}],"wp:attachment":[{"href":"https:\/\/lacolmenatecnologica.com\/en\/wp-json\/wp\/v2\/media?parent=6553"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/lacolmenatecnologica.com\/en\/wp-json\/wp\/v2\/categories?post=6553"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/lacolmenatecnologica.com\/en\/wp-json\/wp\/v2\/tags?post=6553"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}