{"id":948,"date":"2023-02-13T09:10:23","date_gmt":"2023-02-13T09:10:23","guid":{"rendered":"https:\/\/loftocean.com\/doc\/patiotime\/?post_type=ptkb&#038;p=948"},"modified":"2023-02-13T09:38:12","modified_gmt":"2023-02-13T09:38:12","slug":"tabs","status":"publish","type":"ptkb","link":"https:\/\/loftocean.com\/doc\/patiotime\/ptkb\/tabs\/","title":{"rendered":"Tabs"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-post\" data-elementor-id=\"948\" class=\"elementor elementor-948\">\n\t\t\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-6b773d3 elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"6b773d3\" data-element_type=\"section\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-no\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-32cc22f\" data-id=\"32cc22f\" 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-977b704 elementor-widget elementor-widget-text-editor\" data-id=\"977b704\" data-element_type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<p>When editing a page with Elementor, you will find the &#8220;<strong>Tabs (PT)<\/strong>&#8221; element in the left panel. With this element, you can divide content into tabs.<\/p><p><img fetchpriority=\"high\" decoding=\"async\" class=\"alignnone wp-image-950\" src=\"https:\/\/loftocean.com\/doc\/patiotime\/wp-content\/uploads\/sites\/6\/2023\/02\/pt-tabs.png\" alt=\"\" width=\"301\" height=\"469\" srcset=\"https:\/\/loftocean.com\/doc\/patiotime\/wp-content\/uploads\/sites\/6\/2023\/02\/pt-tabs.png 601w, https:\/\/loftocean.com\/doc\/patiotime\/wp-content\/uploads\/sites\/6\/2023\/02\/pt-tabs-192x300.png 192w, https:\/\/loftocean.com\/doc\/patiotime\/wp-content\/uploads\/sites\/6\/2023\/02\/pt-tabs-600x935.png 600w, https:\/\/loftocean.com\/doc\/patiotime\/wp-content\/uploads\/sites\/6\/2023\/02\/pt-tabs-550x857.png 550w, https:\/\/loftocean.com\/doc\/patiotime\/wp-content\/uploads\/sites\/6\/2023\/02\/pt-tabs-370x577.png 370w, https:\/\/loftocean.com\/doc\/patiotime\/wp-content\/uploads\/sites\/6\/2023\/02\/pt-tabs-255x398.png 255w\" sizes=\"(max-width: 301px) 100vw, 301px\" \/><\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-c792b31 elementor-widget elementor-widget-text-editor\" data-id=\"c792b31\" data-element_type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<h6>Content Tab<\/h6><p>A <strong>Tabs<\/strong> widget consists of multiple sub items: Tab. After adding a Tabs widget, in the left panel of Elementor &gt; Edit Tabs &gt; &#8220;Content&#8221; &gt; you can add new items to the Tabs widget.<\/p><p><img decoding=\"async\" class=\"alignnone wp-image-952\" src=\"https:\/\/loftocean.com\/doc\/patiotime\/wp-content\/uploads\/sites\/6\/2023\/02\/edit-tabs.png\" alt=\"\" width=\"690\" height=\"846\" srcset=\"https:\/\/loftocean.com\/doc\/patiotime\/wp-content\/uploads\/sites\/6\/2023\/02\/edit-tabs.png 1387w, https:\/\/loftocean.com\/doc\/patiotime\/wp-content\/uploads\/sites\/6\/2023\/02\/edit-tabs-245x300.png 245w, https:\/\/loftocean.com\/doc\/patiotime\/wp-content\/uploads\/sites\/6\/2023\/02\/edit-tabs-835x1024.png 835w, https:\/\/loftocean.com\/doc\/patiotime\/wp-content\/uploads\/sites\/6\/2023\/02\/edit-tabs-768x941.png 768w, https:\/\/loftocean.com\/doc\/patiotime\/wp-content\/uploads\/sites\/6\/2023\/02\/edit-tabs-1253x1536.png 1253w, https:\/\/loftocean.com\/doc\/patiotime\/wp-content\/uploads\/sites\/6\/2023\/02\/edit-tabs-1200x1471.png 1200w, https:\/\/loftocean.com\/doc\/patiotime\/wp-content\/uploads\/sites\/6\/2023\/02\/edit-tabs-780x956.png 780w, https:\/\/loftocean.com\/doc\/patiotime\/wp-content\/uploads\/sites\/6\/2023\/02\/edit-tabs-600x735.png 600w, https:\/\/loftocean.com\/doc\/patiotime\/wp-content\/uploads\/sites\/6\/2023\/02\/edit-tabs-550x674.png 550w, https:\/\/loftocean.com\/doc\/patiotime\/wp-content\/uploads\/sites\/6\/2023\/02\/edit-tabs-370x453.png 370w, https:\/\/loftocean.com\/doc\/patiotime\/wp-content\/uploads\/sites\/6\/2023\/02\/edit-tabs-255x313.png 255w\" sizes=\"(max-width: 690px) 100vw, 690px\" \/><\/p><p>When expanding each item by clicking on the item title, you will see the following options:<\/p><ol><li><strong>Title<\/strong>: Enter the title of the current tab.<\/li><li><strong>Content Type<\/strong>: <strong><em>Text<\/em><\/strong> \/\u00a0<strong><em>Custom Block<\/em><\/strong>. Choose &#8220;Text&#8221; then you can add text and images by using the default text editor. Choose &#8220;Custom Block&#8221; then you can select an existing Custom Block on your website and insert the content into this tab. (<a href=\"https:\/\/loftocean.com\/doc\/patiotime\/ptkb\/custom-blocks\/\">What is Custom Block?<\/a>)<\/li><li><strong>Unique ID<\/strong>: You can give an ID to each item.<\/li><\/ol><h6>Style Tab<\/h6><ol><li><strong>Title Typography<\/strong>: Control the Tab Title&#8217;s font size, family, weight, line height, letter spacing, and etc.<\/li><li><strong>Content Typography<\/strong>: Control the typography of text in the tab content area. <strong>Please note<\/strong>: These typography settings will be ignored when content is a Custom Block.<\/li><\/ol><p>\u00a0<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-f4d358d elementor-widget-divider--view-line elementor-widget elementor-widget-divider\" data-id=\"f4d358d\" data-element_type=\"widget\" data-widget_type=\"divider.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<div class=\"elementor-divider\">\n\t\t\t<span class=\"elementor-divider-separator\">\n\t\t\t\t\t\t<\/span>\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-e91221a elementor-widget elementor-widget-pt_title\" data-id=\"e91221a\" data-element_type=\"widget\" data-widget_type=\"pt_title.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\n        <div class=\"pt-title-wrap\">\t            <h6 class=\"pt-title\">\n\t                How to edit content of each tab item\u00a0\t            <\/h6>        <\/div>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-32bb9c1 elementor-widget elementor-widget-text-editor\" data-id=\"32bb9c1\" data-element_type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<p>Since a Tabs widget consists of multiple sub items, and if the tab content source is &#8220;Custom Block&#8221;, then you need to edit each tab (custom block) individually.<\/p><p>When you are on a page contains the Tabs widget, if the content of any tab is from Custom Block, then when you hover your cursor over the top admin bar &gt; &#8220;Edit with Elementor&#8221; &gt; you will find these custom blocks in the dropdown list. Click on them and then you can edit them with Elementor.<\/p><p><a href=\"https:\/\/loftocean.com\/doc\/patiotime\/wp-content\/uploads\/sites\/6\/2023\/02\/edit-each-tab-scaled.jpg\"><img decoding=\"async\" class=\"alignnone size-full wp-image-953\" src=\"https:\/\/loftocean.com\/doc\/patiotime\/wp-content\/uploads\/sites\/6\/2023\/02\/edit-each-tab-scaled.jpg\" alt=\"\" width=\"2560\" height=\"1330\" srcset=\"https:\/\/loftocean.com\/doc\/patiotime\/wp-content\/uploads\/sites\/6\/2023\/02\/edit-each-tab-scaled.jpg 2560w, https:\/\/loftocean.com\/doc\/patiotime\/wp-content\/uploads\/sites\/6\/2023\/02\/edit-each-tab-300x156.jpg 300w, https:\/\/loftocean.com\/doc\/patiotime\/wp-content\/uploads\/sites\/6\/2023\/02\/edit-each-tab-1024x532.jpg 1024w, https:\/\/loftocean.com\/doc\/patiotime\/wp-content\/uploads\/sites\/6\/2023\/02\/edit-each-tab-768x399.jpg 768w, https:\/\/loftocean.com\/doc\/patiotime\/wp-content\/uploads\/sites\/6\/2023\/02\/edit-each-tab-1536x798.jpg 1536w, https:\/\/loftocean.com\/doc\/patiotime\/wp-content\/uploads\/sites\/6\/2023\/02\/edit-each-tab-2048x1064.jpg 2048w, https:\/\/loftocean.com\/doc\/patiotime\/wp-content\/uploads\/sites\/6\/2023\/02\/edit-each-tab-1920x998.jpg 1920w\" sizes=\"(max-width: 2560px) 100vw, 2560px\" \/><\/a><\/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<\/div>\n\t\t","protected":false},"menu_order":0,"template":"","ptkb_category":[7],"class_list":["post-948","ptkb","type-ptkb","status-publish","hentry","ptkb_category-pt-elements"],"_links":{"self":[{"href":"https:\/\/loftocean.com\/doc\/patiotime\/wp-json\/wp\/v2\/ptkb\/948","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/loftocean.com\/doc\/patiotime\/wp-json\/wp\/v2\/ptkb"}],"about":[{"href":"https:\/\/loftocean.com\/doc\/patiotime\/wp-json\/wp\/v2\/types\/ptkb"}],"version-history":[{"count":5,"href":"https:\/\/loftocean.com\/doc\/patiotime\/wp-json\/wp\/v2\/ptkb\/948\/revisions"}],"predecessor-version":[{"id":957,"href":"https:\/\/loftocean.com\/doc\/patiotime\/wp-json\/wp\/v2\/ptkb\/948\/revisions\/957"}],"wp:attachment":[{"href":"https:\/\/loftocean.com\/doc\/patiotime\/wp-json\/wp\/v2\/media?parent=948"}],"wp:term":[{"taxonomy":"ptkb_category","embeddable":true,"href":"https:\/\/loftocean.com\/doc\/patiotime\/wp-json\/wp\/v2\/ptkb_category?post=948"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}