{"id":278,"date":"2026-05-12T17:21:43","date_gmt":"2026-05-12T17:21:43","guid":{"rendered":"https:\/\/help.excelerate.app\/?post_type=docs&#038;p=278"},"modified":"2026-06-14T16:22:33","modified_gmt":"2026-06-14T16:22:33","password":"","slug":"tabs","status":"publish","type":"docs","link":"https:\/\/help.excelerate.app\/en\/help\/tabs\/","title":{"rendered":"Tabs"},"content":{"rendered":"<div data-elementor-type=\"wp-post\" data-elementor-id=\"278\" class=\"elementor elementor-278\">\n\t\t\t\t<div class=\"elementor-element elementor-element-3aee4ae4 e-con-full e-flex e-con e-parent\" data-id=\"3aee4ae4\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-3cc590e3 elementor-widget elementor-widget-text-editor\" data-id=\"3cc590e3\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t\t\t\t\t\t<h2>Application<\/h2><div class=\"elementor-element elementor-element-a9dff80 elementor-widget elementor-widget-fp-text\" data-id=\"a9dff80\" data-element_type=\"widget\" data-widget_type=\"fp-text.default\"><div class=\"elementor-widget-container\"><div class=\"text\"><p>Would you like to present text information differently again? Then tabs give you another alternative to the accordion and scrolling text.<\/p><\/div><\/div><\/div>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-d662862 elementor-widget elementor-widget-spacer\" data-id=\"d662862\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"spacer.default\">\n\t\t\t\t\t\t\t<div class=\"elementor-spacer\">\n\t\t\t<div class=\"elementor-spacer-inner\"><\/div>\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-d9d8f60 elementor-widget elementor-widget-text-editor\" data-id=\"d9d8f60\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t\t\t\t\t\t<h2>Video tutorial<\/h2><div class=\"elementor-element elementor-element-a9dff80 elementor-widget elementor-widget-fp-text\" data-id=\"a9dff80\" data-element_type=\"widget\" data-widget_type=\"fp-text.default\"><div class=\"elementor-widget-container\"><div class=\"text\"><p>Learn in the following video tutorial how to create the tabs element<\/p><\/div><\/div><\/div>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-354b9670 elementor-widget elementor-widget-video\" data-id=\"354b9670\" data-element_type=\"widget\" data-e-type=\"widget\" data-settings=\"{&quot;video_type&quot;:&quot;vimeo&quot;}\" data-widget_type=\"video.default\">\n\t\t\t\t\t\t\t<div class=\"elementor-wrapper elementor-open-inline\">\n\t\t\t<iframe class=\"elementor-video-iframe\" allowfullscreen allow=\"clipboard-write\" title=\"Vimeo video player\" src=\"https:\/\/player.vimeo.com\/video\/1198578481?color&amp;autopause=0&amp;loop=0&amp;muted=0&amp;title=1&amp;portrait=1&amp;byline=1#t=\"><\/iframe>\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-7f66e3dd e-con-full e-flex e-con e-parent\" data-id=\"7f66e3dd\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-6ca2cec elementor-widget elementor-widget-spacer\" data-id=\"6ca2cec\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"spacer.default\">\n\t\t\t\t\t\t\t<div class=\"elementor-spacer\">\n\t\t\t<div class=\"elementor-spacer-inner\"><\/div>\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-7b852fd4 elementor-widget elementor-widget-text-editor\" data-id=\"7b852fd4\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t\t\t\t\t\t<h2>Add tabs<\/h2><div id=\"model-response-message-contentr_a9f677e6d41788df\" class=\"markdown markdown-main-panel stronger enable-updated-hr-color\" dir=\"ltr\" aria-live=\"polite\" aria-busy=\"false\"><p data-path-to-node=\"0\">Drag the tabs element into a module.<\/p><\/div>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-2773d261 elementor-widget elementor-widget-image\" data-id=\"2773d261\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img decoding=\"async\" src=\"https:\/\/help.excelerate.app\/wp-content\/uploads\/2026\/05\/Tabs-2.jpg\" title=\"Tabs\" alt=\"Tabs\" loading=\"lazy\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-7752065b elementor-widget elementor-widget-spacer\" data-id=\"7752065b\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"spacer.default\">\n\t\t\t\t\t\t\t<div class=\"elementor-spacer\">\n\t\t\t<div class=\"elementor-spacer-inner\"><\/div>\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-1cafb273 elementor-widget elementor-widget-text-editor\" data-id=\"1cafb273\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t\t\t\t\t\t<h2>Step 1 \u2013 Set width<\/h2>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-3365ec07 elementor-widget elementor-widget-hotspots\" data-id=\"3365ec07\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"hotspots.default\">\n\t\t\t\t\t            <div class=\"excelerate-hotspots\">\n                <img decoding=\"async\" class=\"excelerate-hotspots-image\" src=\"https:\/\/help.excelerate.app\/wp-content\/uploads\/2026\/05\/Breite.jpg\" \/>\n                <div class=\"excelerate-hotspots-hotspots\">\n                                                <div class=\"excelerate-hotspots-hotspot\" style=\"top: 37%; left: 50%;\">\n                                <div class=\"excelerate-hotspots-hotspot-icon\">\n                                    1                                <\/div>\n                                <div class=\"excelerate-hotspots-hotspot-content\">\n                                    <div class=\"excelerate-hotspots-hotspot-headline\">Width<\/div>\n                                    <div class=\"excelerate-hotspots-hotspot-text\">Decide whether the Tabs element should have a wide or a narrow layout.<\/div>\n                                <\/div>\n                            <\/div>\n                                            <\/div>\n\t\t    <\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-b1bcf17 elementor-widget elementor-widget-spacer\" data-id=\"b1bcf17\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"spacer.default\">\n\t\t\t\t\t\t\t<div class=\"elementor-spacer\">\n\t\t\t<div class=\"elementor-spacer-inner\"><\/div>\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-e9d4b3c elementor-widget elementor-widget-text-editor\" data-id=\"e9d4b3c\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t\t\t\t\t\t<h2>Step 2 \u2013 Manage hotspots<\/h2>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-5488cab elementor-widget elementor-widget-hotspots\" data-id=\"5488cab\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"hotspots.default\">\n\t\t\t\t\t            <div class=\"excelerate-hotspots\">\n                <img decoding=\"async\" class=\"excelerate-hotspots-image\" src=\"https:\/\/help.excelerate.app\/wp-content\/uploads\/2026\/05\/tabs-1-1.jpg\" \/>\n                <div class=\"excelerate-hotspots-hotspots\">\n                                                <div class=\"excelerate-hotspots-hotspot excelerate-hotspots-hotspot-right\" style=\"top: 18%; left: 64%;\">\n                                <div class=\"excelerate-hotspots-hotspot-icon\">\n                                    1                                <\/div>\n                                <div class=\"excelerate-hotspots-hotspot-content\">\n                                    <div class=\"excelerate-hotspots-hotspot-headline\">Add tab<\/div>\n                                    <div class=\"excelerate-hotspots-hotspot-text\">Click on \u201eAdd tabs\u201c to create as many tabs as you like.<\/div>\n                                <\/div>\n                            <\/div>\n                                                        <div class=\"excelerate-hotspots-hotspot excelerate-hotspots-hotspot-right\" style=\"top: 43%; left: 64%;\">\n                                <div class=\"excelerate-hotspots-hotspot-icon\">\n                                    2                                <\/div>\n                                <div class=\"excelerate-hotspots-hotspot-content\">\n                                    <div class=\"excelerate-hotspots-hotspot-headline\">Sort tabs<\/div>\n                                    <div class=\"excelerate-hotspots-hotspot-text\">Change the order of the tabs by clicking the move icon and dragging it to the desired location.<\/div>\n                                <\/div>\n                            <\/div>\n                                                        <div class=\"excelerate-hotspots-hotspot excelerate-hotspots-hotspot-right\" style=\"top: 75%; left: 64%;\">\n                                <div class=\"excelerate-hotspots-hotspot-icon\">\n                                    3                                <\/div>\n                                <div class=\"excelerate-hotspots-hotspot-content\">\n                                    <div class=\"excelerate-hotspots-hotspot-headline\">Delete tabs<\/div>\n                                    <div class=\"excelerate-hotspots-hotspot-text\">Delete tabs by clicking the trash can icon.<\/div>\n                                <\/div>\n                            <\/div>\n                                            <\/div>\n\t\t    <\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-39753c0e elementor-widget elementor-widget-spacer\" data-id=\"39753c0e\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"spacer.default\">\n\t\t\t\t\t\t\t<div class=\"elementor-spacer\">\n\t\t\t<div class=\"elementor-spacer-inner\"><\/div>\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-15b0c5c elementor-widget elementor-widget-text-editor\" data-id=\"15b0c5c\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t\t\t\t\t\t<h2>Step 3 \u2013 Edit content<\/h2>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-36dc7fb elementor-widget elementor-widget-hotspots\" data-id=\"36dc7fb\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"hotspots.default\">\n\t\t\t\t\t            <div class=\"excelerate-hotspots\">\n                <img decoding=\"async\" class=\"excelerate-hotspots-image\" src=\"https:\/\/help.excelerate.app\/wp-content\/uploads\/2026\/05\/inhalt.jpg\" \/>\n                <div class=\"excelerate-hotspots-hotspots\">\n                                                <div class=\"excelerate-hotspots-hotspot excelerate-hotspots-hotspot-right\" style=\"top: 32%; left: 69%;\">\n                                <div class=\"excelerate-hotspots-hotspot-icon\">\n                                    1                                <\/div>\n                                <div class=\"excelerate-hotspots-hotspot-content\">\n                                    <div class=\"excelerate-hotspots-hotspot-headline\">Edit title and content<\/div>\n                                    <div class=\"excelerate-hotspots-hotspot-text\">Enter your desired title either in the input field of the editing window or change it directly in the element as described in step 2.<\/div>\n                                <\/div>\n                            <\/div>\n                                                        <div class=\"excelerate-hotspots-hotspot\" style=\"top: 79%; left: 26.5%;\">\n                                <div class=\"excelerate-hotspots-hotspot-icon\">\n                                    2                                <\/div>\n                                <div class=\"excelerate-hotspots-hotspot-content\">\n                                    <div class=\"excelerate-hotspots-hotspot-headline\">Edit tab title<\/div>\n                                    <div class=\"excelerate-hotspots-hotspot-text\">Click on a tab to edit its content. You can also edit the title of the tab directly on the tab itself.<\/div>\n                                <\/div>\n                            <\/div>\n                                                        <div class=\"excelerate-hotspots-hotspot excelerate-hotspots-hotspot-right\" style=\"top: 70.5%; left: 66%;\">\n                                <div class=\"excelerate-hotspots-hotspot-icon\">\n                                    3                                <\/div>\n                                <div class=\"excelerate-hotspots-hotspot-content\">\n                                    <div class=\"excelerate-hotspots-hotspot-headline\">Edit tab contents<\/div>\n                                    <div class=\"excelerate-hotspots-hotspot-text\">Click the edit button to create the tab's content using the content editor. You can learn exactly how it works on the \u201eEdit Overlay\u201c page.<\/div>\n                                <\/div>\n                            <\/div>\n                                            <\/div>\n\t\t    <\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-73f0f6b0 elementor-widget elementor-widget-spacer\" data-id=\"73f0f6b0\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"spacer.default\">\n\t\t\t\t\t\t\t<div class=\"elementor-spacer\">\n\t\t\t<div class=\"elementor-spacer-inner\"><\/div>\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>","protected":false},"excerpt":{"rendered":"<p>Anwendung Willst du Textinformationen wieder anders pr\u00e4sentieren? Dann findest du mit Tabs eine weitere Alternative zum Akkordeon und dem Scroll Text. Video Anleitung Erfahre in dem folgenden Video Tutorial, wie du das Element Tabs erstellst https:\/\/vimeo.com\/1198578481 Tabs hinzuf\u00fcgen Ziehe das Tabs Element in einem Modul hinein. Schritt 1 &#8211; Breite einstellen 1 Breite Entscheide, ob [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"closed","template":"","meta":{"footnotes":""},"doc_category":[11],"doc_tag":[],"class_list":["post-278","docs","type-docs","status-publish","hentry","doc_category-inhaltselemente"],"year_month":"2026-09","word_count":202,"total_views":"3","reactions":{"happy":"0","normal":"0","sad":"0"},"author_info":{"name":"Excelerate","author_nicename":"excelerate","author_url":"https:\/\/help.excelerate.app\/en\/author\/excelerate\/"},"doc_category_info":[{"term_name":"Creator - Inhalt - Elemente","term_url":"https:\/\/help.excelerate.app\/en\/docs-category\/inhaltselemente\/"}],"doc_tag_info":[],"knowledge_base_info":[],"knowledge_base_slug":[],"_links":{"self":[{"href":"https:\/\/help.excelerate.app\/en\/wp-json\/wp\/v2\/docs\/278","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/help.excelerate.app\/en\/wp-json\/wp\/v2\/docs"}],"about":[{"href":"https:\/\/help.excelerate.app\/en\/wp-json\/wp\/v2\/types\/docs"}],"author":[{"embeddable":true,"href":"https:\/\/help.excelerate.app\/en\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/help.excelerate.app\/en\/wp-json\/wp\/v2\/comments?post=278"}],"version-history":[{"count":43,"href":"https:\/\/help.excelerate.app\/en\/wp-json\/wp\/v2\/docs\/278\/revisions"}],"predecessor-version":[{"id":3930,"href":"https:\/\/help.excelerate.app\/en\/wp-json\/wp\/v2\/docs\/278\/revisions\/3930"}],"wp:attachment":[{"href":"https:\/\/help.excelerate.app\/en\/wp-json\/wp\/v2\/media?parent=278"}],"wp:term":[{"taxonomy":"doc_category","embeddable":true,"href":"https:\/\/help.excelerate.app\/en\/wp-json\/wp\/v2\/doc_category?post=278"},{"taxonomy":"doc_tag","embeddable":true,"href":"https:\/\/help.excelerate.app\/en\/wp-json\/wp\/v2\/doc_tag?post=278"}],"curies":[{"name":"WP","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}