{"id":6549,"date":"2019-02-12T14:10:32","date_gmt":"2019-02-12T14:10:32","guid":{"rendered":"https:\/\/crocoblock.com\/knowledge-base\/?post_type=article&#038;p=6549"},"modified":"2023-06-08T13:37:53","modified_gmt":"2023-06-08T13:37:53","slug":"jettabs-tabs-widget-how-to-arrange-the-content-built-with-elementor-inside-the-tabs","status":"publish","type":"article","link":"https:\/\/crocoblock.com\/knowledge-base\/jettabs\/jettabs-tabs-widget-how-to-arrange-the-content-built-with-elementor-inside-the-tabs\/","title":{"rendered":"How to Arrange the Templates via the Tabs Widget"},"content":{"rendered":"\n<p>A tab is the element of a user interface that allows navigating between multiple subjects on a page.<\/p>\n\n\n\n<img decoding=\"async\" src=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2023\/03\/ffvgf-1.png\" alt=\"JetTabs plugin from Jet Plugins family\">\n\n\n\n<p><a href=\"https:\/\/crocoblock.com\/plugins\/jettabs\/\" target=\"_blank\" rel=\"noopener noreferrer\">JetTabs<\/a> plugin is the best solution for organizing content into stylish tabs and accordion blocks using Elementor page builder. With the help of this addon, you can create different attractive layouts according to your needs.<\/p>\n\n\n\n<p>Here you will learn how to arrange the content built with <strong>Elementor<\/strong> inside the <a href=\"https:\/\/crocoblock.com\/widgets\/tabs\/\" target=\"_blank\" rel=\"noopener noreferrer\">Tabs<\/a> widget from the<strong> JetTabs <\/strong>plugin.<\/p>\n\n\n\n<p>In order to enrich the tabs with content, let\u2019s create some templates for them.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"creating-template\">Creating Template<\/h2>\n\n\n\n<div class=\"wp-block-group is-layout-constrained wp-block-group-is-layout-constrained\"><div class=\"wp-block-group__inner-container\">\n<p>Let&#8217;s create a new page at first and open it with the <a href=\"https:\/\/elementor.com\" target=\"_blank\" rel=\"nofollow noopener noreferrer\">Elementor<\/a> editor.<\/p>\n\n\n\n<p>Enrich it with content using versatile stylish widgets, for example, with the <a href=\"https:\/\/crocoblock.com\/widgets\/images-layout\/\" target=\"_blank\" rel=\"noopener noreferrer\">Images Layout<\/a> widget.<\/p>\n\n\n\n<p>After you have completed the customization, you will need to save this page as a template. To do so, click the arrow near the <strong>Publish<\/strong> button and select the <strong>Save as Template<\/strong> button.<\/p>\n\n\n\n<img decoding=\"async\" src=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2023\/03\/ffvgf-4.png\" alt=\"content settings of the Images Layout widget\">\n\n\n\n<p>Provide a template with the title in the new window and click the <strong>Save<\/strong> button.<\/p>\n\n\n\n<img decoding=\"async\" src=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2023\/03\/ffvgf-5.png\" alt=\"Provide a template with the title\">\n\n\n\n<p>You are allowed to create as many templates for tabs as you need in such a way.<\/p>\n<\/div><\/div>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"adding-content-into-tabs\">Adding Content into Tabs<\/h2>\n\n\n\n<div class=\"wp-block-group is-layout-constrained wp-block-group-is-layout-constrained\"><div class=\"wp-block-group__inner-container\">\n<p>Open the page where you want to add the tabs with <strong>Elementor<\/strong> page builder.<\/p>\n\n\n\n<p>Drag and drop <strong>Tabs<\/strong> widget to a new section.<\/p>\n\n\n\n<p>In order to add the template to the tab, proceed to the Content &gt; Items directory.<\/p>\n\n\n\n<img decoding=\"async\" src=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2023\/03\/ffvgf-6.png\" alt=\"items content settings of the tabs widget\">\n\n\n\n<p>To add the template to the tab, open it and navigate to the <strong>Choose Template<\/strong> dropdown.<\/p>\n\n\n\n<p>Pick up the template you\u2019ve recently created, and it will be pulled out to the tab content.<\/p>\n\n\n\n<p>If you need to change the template, click the <strong>Edit Template<\/strong> button.<\/p>\n<\/div><\/div>\n\n\n\n<p>So, that\u2019s all you need to do. Don\u2019t forget to hit <strong>Publish<\/strong> button to save the progress.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Create and place any content in the templates into tabs using the JetTabs plugin.<\/p>\n","protected":false},"author":11,"featured_media":0,"template":"","format":"standard","builder-category":[],"article-category":[498],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v20.9 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>How to Manage Content Layout in Tabs Form \u2014 JetTabs | Crocoblock<\/title>\n<meta name=\"description\" content=\"Discover a handy and elegant way to display your content in the tabs layout in Elenebtor by means of JetTabs plugin by Crocoblock.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/crocoblock.com\/knowledge-base\/jettabs\/jettabs-tabs-widget-how-to-arrange-the-content-built-with-elementor-inside-the-tabs\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"How to Manage Content Layout in Tabs Form \u2014 JetTabs | Crocoblock\" \/>\n<meta property=\"og:description\" content=\"Discover a handy and elegant way to display your content in the tabs layout in Elenebtor by means of JetTabs plugin by Crocoblock.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/crocoblock.com\/knowledge-base\/jettabs\/jettabs-tabs-widget-how-to-arrange-the-content-built-with-elementor-inside-the-tabs\/\" \/>\n<meta property=\"og:site_name\" content=\"Help Center\" \/>\n<meta property=\"article:modified_time\" content=\"2023-06-08T13:37:53+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2023\/03\/ffvgf-1.png\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data1\" content=\"3 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\/\/crocoblock.com\/knowledge-base\/jettabs\/jettabs-tabs-widget-how-to-arrange-the-content-built-with-elementor-inside-the-tabs\/\",\"url\":\"https:\/\/crocoblock.com\/knowledge-base\/jettabs\/jettabs-tabs-widget-how-to-arrange-the-content-built-with-elementor-inside-the-tabs\/\",\"name\":\"How to Manage Content Layout in Tabs Form \u2014 JetTabs | Crocoblock\",\"isPartOf\":{\"@id\":\"https:\/\/crocoblock.com\/knowledge-base\/#website\"},\"datePublished\":\"2019-02-12T14:10:32+00:00\",\"dateModified\":\"2023-06-08T13:37:53+00:00\",\"description\":\"Discover a handy and elegant way to display your content in the tabs layout in Elenebtor by means of JetTabs plugin by Crocoblock.\",\"breadcrumb\":{\"@id\":\"https:\/\/crocoblock.com\/knowledge-base\/jettabs\/jettabs-tabs-widget-how-to-arrange-the-content-built-with-elementor-inside-the-tabs\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/crocoblock.com\/knowledge-base\/jettabs\/jettabs-tabs-widget-how-to-arrange-the-content-built-with-elementor-inside-the-tabs\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/crocoblock.com\/knowledge-base\/jettabs\/jettabs-tabs-widget-how-to-arrange-the-content-built-with-elementor-inside-the-tabs\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/crocoblock.com\/knowledge-base\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Articles\",\"item\":\"https:\/\/crocoblock.com\/knowledge-base\/articles\/\"},{\"@type\":\"ListItem\",\"position\":3,\"name\":\"How to Arrange the Templates via the Tabs Widget\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/crocoblock.com\/knowledge-base\/#website\",\"url\":\"https:\/\/crocoblock.com\/knowledge-base\/\",\"name\":\"Help Center\",\"description\":\"\",\"publisher\":{\"@id\":\"https:\/\/crocoblock.com\/knowledge-base\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/crocoblock.com\/knowledge-base\/?s={search_term_string}\"},\"query-input\":\"required name=search_term_string\"}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/crocoblock.com\/knowledge-base\/#organization\",\"name\":\"Help Center\",\"url\":\"https:\/\/crocoblock.com\/knowledge-base\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/crocoblock.com\/knowledge-base\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2025\/04\/invert-crocoblock-logo.svg\",\"contentUrl\":\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2025\/04\/invert-crocoblock-logo.svg\",\"caption\":\"Help Center\"},\"image\":{\"@id\":\"https:\/\/crocoblock.com\/knowledge-base\/#\/schema\/logo\/image\/\"}}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"How to Manage Content Layout in Tabs Form \u2014 JetTabs | Crocoblock","description":"Discover a handy and elegant way to display your content in the tabs layout in Elenebtor by means of JetTabs plugin by Crocoblock.","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:\/\/crocoblock.com\/knowledge-base\/jettabs\/jettabs-tabs-widget-how-to-arrange-the-content-built-with-elementor-inside-the-tabs\/","og_locale":"en_US","og_type":"article","og_title":"How to Manage Content Layout in Tabs Form \u2014 JetTabs | Crocoblock","og_description":"Discover a handy and elegant way to display your content in the tabs layout in Elenebtor by means of JetTabs plugin by Crocoblock.","og_url":"https:\/\/crocoblock.com\/knowledge-base\/jettabs\/jettabs-tabs-widget-how-to-arrange-the-content-built-with-elementor-inside-the-tabs\/","og_site_name":"Help Center","article_modified_time":"2023-06-08T13:37:53+00:00","og_image":[{"url":"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2023\/03\/ffvgf-1.png"}],"twitter_card":"summary_large_image","twitter_misc":{"Est. reading time":"3 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/crocoblock.com\/knowledge-base\/jettabs\/jettabs-tabs-widget-how-to-arrange-the-content-built-with-elementor-inside-the-tabs\/","url":"https:\/\/crocoblock.com\/knowledge-base\/jettabs\/jettabs-tabs-widget-how-to-arrange-the-content-built-with-elementor-inside-the-tabs\/","name":"How to Manage Content Layout in Tabs Form \u2014 JetTabs | Crocoblock","isPartOf":{"@id":"https:\/\/crocoblock.com\/knowledge-base\/#website"},"datePublished":"2019-02-12T14:10:32+00:00","dateModified":"2023-06-08T13:37:53+00:00","description":"Discover a handy and elegant way to display your content in the tabs layout in Elenebtor by means of JetTabs plugin by Crocoblock.","breadcrumb":{"@id":"https:\/\/crocoblock.com\/knowledge-base\/jettabs\/jettabs-tabs-widget-how-to-arrange-the-content-built-with-elementor-inside-the-tabs\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/crocoblock.com\/knowledge-base\/jettabs\/jettabs-tabs-widget-how-to-arrange-the-content-built-with-elementor-inside-the-tabs\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/crocoblock.com\/knowledge-base\/jettabs\/jettabs-tabs-widget-how-to-arrange-the-content-built-with-elementor-inside-the-tabs\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/crocoblock.com\/knowledge-base\/"},{"@type":"ListItem","position":2,"name":"Articles","item":"https:\/\/crocoblock.com\/knowledge-base\/articles\/"},{"@type":"ListItem","position":3,"name":"How to Arrange the Templates via the Tabs Widget"}]},{"@type":"WebSite","@id":"https:\/\/crocoblock.com\/knowledge-base\/#website","url":"https:\/\/crocoblock.com\/knowledge-base\/","name":"Help Center","description":"","publisher":{"@id":"https:\/\/crocoblock.com\/knowledge-base\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/crocoblock.com\/knowledge-base\/?s={search_term_string}"},"query-input":"required name=search_term_string"}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/crocoblock.com\/knowledge-base\/#organization","name":"Help Center","url":"https:\/\/crocoblock.com\/knowledge-base\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/crocoblock.com\/knowledge-base\/#\/schema\/logo\/image\/","url":"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2025\/04\/invert-crocoblock-logo.svg","contentUrl":"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2025\/04\/invert-crocoblock-logo.svg","caption":"Help Center"},"image":{"@id":"https:\/\/crocoblock.com\/knowledge-base\/#\/schema\/logo\/image\/"}}]}},"_links":{"self":[{"href":"https:\/\/crocoblock.com\/knowledge-base\/wp-json\/wp\/v2\/article\/6549"}],"collection":[{"href":"https:\/\/crocoblock.com\/knowledge-base\/wp-json\/wp\/v2\/article"}],"about":[{"href":"https:\/\/crocoblock.com\/knowledge-base\/wp-json\/wp\/v2\/types\/article"}],"author":[{"embeddable":true,"href":"https:\/\/crocoblock.com\/knowledge-base\/wp-json\/wp\/v2\/users\/11"}],"wp:attachment":[{"href":"https:\/\/crocoblock.com\/knowledge-base\/wp-json\/wp\/v2\/media?parent=6549"}],"wp:term":[{"taxonomy":"builder-category","embeddable":true,"href":"https:\/\/crocoblock.com\/knowledge-base\/wp-json\/wp\/v2\/builder-category?post=6549"},{"taxonomy":"article-category","embeddable":true,"href":"https:\/\/crocoblock.com\/knowledge-base\/wp-json\/wp\/v2\/article-category?post=6549"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}