{"id":439,"date":"2021-02-10T13:00:44","date_gmt":"2021-02-10T13:00:44","guid":{"rendered":"https:\/\/stable.visual-framework.dev\/wordpress\/?page_id=439"},"modified":"2022-08-04T10:42:39","modified_gmt":"2022-08-04T10:42:39","slug":"tabs-block","status":"publish","type":"page","link":"https:\/\/stable.visual-framework.dev\/wordpress\/blocks\/tabs-block\/","title":{"rendered":"Tabs"},"content":{"rendered":"\n<div class=\"vf-grid | vf-grid__col-3\"><div class=\"vf-grid__col--span-2\"><!--[vf\/content]-->\n<div class=\"vf-content\">\n\n<ol><li>In WordPress editor click on a + icon to add a new block.<\/li><li>In the search field, start typing\u00a0<em>Tabs <\/em>and select the respective block.<\/li><li>You will see two &#8216;Tabs&#8217; blocks. Please select the <em>VF Tabs<\/em> block.<\/li><li>By default, your first tab will be labeled &#8216;<em>Tab 1<\/em>&#8216;.  Change the label in the respective field in the block settings.<\/li><li>To add content under your tab, navigate to the + icon that appears below the Tab preview in the editor. Select the desired block to build the content for this tab.<\/li><li>To add another tab, click on the blue &#8216;<em>Add tab<\/em>&#8216; button and repeat the process.<\/li><li>In the editor, you will see the content for all tabs one under the other. To preview the tabs and check the functionality, click on the &#8216;<em>Preview<\/em>&#8216; button at the top right corner.<\/li><\/ol>\n\n\n\n<figure class=\"vf-figure wp-block-video\"><video style=\"max-width: 100%;\" controls src=\"https:\/\/stable.visual-framework.dev\/wordpress\/wp-content\/uploads\/2021\/02\/tabs-new.mp4\"><\/video><\/figure>\n\n<\/div>\n<\/div>\n\n\n<div><!--[vf\/content]-->\n<div class=\"vf-content\">\n\n<div class=\"vf-tabs\"><ul class=\"vf-tabs__list\" data-vf-js-tabs=\"true\"><li class=\"vf-tabs__item\"><a class=\"vf-tabs__link\" href=\"#vf-tabs__section-6aa0ab48-79fb-4c18-8673-945c823a1755\">Example 1<\/a><\/li><li class=\"vf-tabs__item\"><a class=\"vf-tabs__link\" href=\"#vf-tabs__section-ead023f2-ceb4-48de-baa7-596792e2b242\">Example 2<\/a><\/li><\/ul><div class=\"vf-tabs-content\" data-vf-js-tabs-content=\"true\">\n<section class=\"vf-tabs__section\" id=\"vf-tabs__section-6aa0ab48-79fb-4c18-8673-945c823a1755\"><h2>Example 1<\/h2>\n<p>Example 1<\/p>\n<\/section>\n\n\n\n<section class=\"vf-tabs__section\" id=\"vf-tabs__section-ead023f2-ceb4-48de-baa7-596792e2b242\"><h2>Example 2<\/h2>\n<p>Example 2<\/p>\n<\/section>\n<\/div><\/div>\n\n\n\n<p><\/p>\n\n\n<div class=\"vf-links vf-links__list--has-image\">\n    <ul class=\"vf-links__list vf-list\">\n        <li class=\"vf-list__item\">\n              <a class=\"vf-list__link\" href=\"https:\/\/stable.visual-framework.dev\/components\/vf-tabs\/\">\n          <img decoding=\"async\" width=\"85\" height=\"61\" src=\"https:\/\/stable.visual-framework.dev\/wordpress\/wp-content\/uploads\/2021\/02\/Screenshot-2021-02-09-at-22.18.00.png\" class=\"vf-list__image\" alt=\"\" loading=\"lazy\" itemprop=\"image\" \/>Learn more about this component        <\/a>\n          <\/li>\n      <\/ul>\n<\/div>\n\n<\/div>\n<\/div>\n<\/div>\n","protected":false},"excerpt":{"rendered":"","protected":false},"author":1,"featured_media":0,"parent":50,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"template-title-left-aligned.php","meta":{"_acf_changed":false,"footnotes":""},"embl_taxonomy":[],"acf":[],"embl_taxonomy_terms":[],"_links":{"self":[{"href":"https:\/\/stable.visual-framework.dev\/wordpress\/wp-json\/wp\/v2\/pages\/439"}],"collection":[{"href":"https:\/\/stable.visual-framework.dev\/wordpress\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/stable.visual-framework.dev\/wordpress\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/stable.visual-framework.dev\/wordpress\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/stable.visual-framework.dev\/wordpress\/wp-json\/wp\/v2\/comments?post=439"}],"version-history":[{"count":4,"href":"https:\/\/stable.visual-framework.dev\/wordpress\/wp-json\/wp\/v2\/pages\/439\/revisions"}],"predecessor-version":[{"id":495,"href":"https:\/\/stable.visual-framework.dev\/wordpress\/wp-json\/wp\/v2\/pages\/439\/revisions\/495"}],"up":[{"embeddable":true,"href":"https:\/\/stable.visual-framework.dev\/wordpress\/wp-json\/wp\/v2\/pages\/50"}],"wp:attachment":[{"href":"https:\/\/stable.visual-framework.dev\/wordpress\/wp-json\/wp\/v2\/media?parent=439"}],"wp:term":[{"taxonomy":"embl_taxonomy","embeddable":true,"href":"https:\/\/stable.visual-framework.dev\/wordpress\/wp-json\/wp\/v2\/embl_taxonomy?post=439"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}