{"id":827,"date":"2026-05-26T11:04:26","date_gmt":"2026-05-26T11:04:26","guid":{"rendered":"https:\/\/help.excelerate.app\/?post_type=docs&#038;p=827"},"modified":"2026-06-22T08:44:23","modified_gmt":"2026-06-22T08:44:23","password":"","slug":"theme-editor","status":"publish","type":"docs","link":"https:\/\/help.excelerate.app\/en\/help\/theme-editor\/","title":{"rendered":"Theme Editor"},"content":{"rendered":"<div data-elementor-type=\"wp-post\" data-elementor-id=\"827\" class=\"elementor elementor-827\">\n\t\t\t\t<div class=\"elementor-element elementor-element-1f22ee35 e-con-full e-flex e-con e-parent\" data-id=\"1f22ee35\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-19417ba7 elementor-widget elementor-widget-text-editor\" data-id=\"19417ba7\" 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><b data-path-to-node=\"6,0\" data-index-in-node=\"0\">Branding without compromise:<\/b> The new Theme Builder gives you full control over the frontend design of your WBTs. Create custom themes for different departments, clients, or external partners to give every project the right look. You can set your theme right at the start or apply it flexibly during the final export.<\/p><\/div><\/div><\/div>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-a65f3ef elementor-widget elementor-widget-spacer\" data-id=\"a65f3ef\" 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-5e1d711e elementor-widget elementor-widget-text-editor\" data-id=\"5e1d711e\" 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>Check out the structure of the Theme Builder.<\/h2><p>A live preview shows you your current design at any time.<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-3060a6ae elementor-widget elementor-widget-hotspots\" data-id=\"3060a6ae\" 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\/Allgemein.jpg\" \/>\n                <div class=\"excelerate-hotspots-hotspots\">\n                                                <div class=\"excelerate-hotspots-hotspot\" style=\"top: 12%; left: 15%;\">\n                                <div class=\"excelerate-hotspots-hotspot-icon\">\n                                    1                                <\/div>\n                                <div class=\"excelerate-hotspots-hotspot-content\">\n                                    <div class=\"excelerate-hotspots-hotspot-headline\">Set the style of your theme<\/div>\n                                    <div class=\"excelerate-hotspots-hotspot-text\"><\/div>\n                                <\/div>\n                            <\/div>\n                                                        <div class=\"excelerate-hotspots-hotspot\" style=\"top: 24%; left: 15%;\">\n                                <div class=\"excelerate-hotspots-hotspot-icon\">\n                                    2                                <\/div>\n                                <div class=\"excelerate-hotspots-hotspot-content\">\n                                    <div class=\"excelerate-hotspots-hotspot-headline\">Upload your own fonts to customize the typography of your design<\/div>\n                                    <div class=\"excelerate-hotspots-hotspot-text\"><\/div>\n                                <\/div>\n                            <\/div>\n                                                        <div class=\"excelerate-hotspots-hotspot\" style=\"top: 36%; left: 15%;\">\n                                <div class=\"excelerate-hotspots-hotspot-icon\">\n                                    3                                <\/div>\n                                <div class=\"excelerate-hotspots-hotspot-content\">\n                                    <div class=\"excelerate-hotspots-hotspot-headline\">Assign individual settings for all typographical elements<\/div>\n                                    <div class=\"excelerate-hotspots-hotspot-text\"><\/div>\n                                <\/div>\n                            <\/div>\n                                                        <div class=\"excelerate-hotspots-hotspot\" style=\"top: 48%; left: 15%;\">\n                                <div class=\"excelerate-hotspots-hotspot-icon\">\n                                    4                                <\/div>\n                                <div class=\"excelerate-hotspots-hotspot-content\">\n                                    <div class=\"excelerate-hotspots-hotspot-headline\">Set background colors for light and dark areas<\/div>\n                                    <div class=\"excelerate-hotspots-hotspot-text\"><\/div>\n                                <\/div>\n                            <\/div>\n                                                        <div class=\"excelerate-hotspots-hotspot\" style=\"top: 60%; left: 15%;\">\n                                <div class=\"excelerate-hotspots-hotspot-icon\">\n                                    5                                <\/div>\n                                <div class=\"excelerate-hotspots-hotspot-content\">\n                                    <div class=\"excelerate-hotspots-hotspot-headline\">Design the boxes and containers of your WBT<\/div>\n                                    <div class=\"excelerate-hotspots-hotspot-text\"><\/div>\n                                <\/div>\n                            <\/div>\n                                                        <div class=\"excelerate-hotspots-hotspot\" style=\"top: 72%; left: 15%;\">\n                                <div class=\"excelerate-hotspots-hotspot-icon\">\n                                    6                                <\/div>\n                                <div class=\"excelerate-hotspots-hotspot-content\">\n                                    <div class=\"excelerate-hotspots-hotspot-headline\">Customize primary and secondary buttons<\/div>\n                                    <div class=\"excelerate-hotspots-hotspot-text\"><\/div>\n                                <\/div>\n                            <\/div>\n                                                        <div class=\"excelerate-hotspots-hotspot\" style=\"top: 84%; left: 15%;\">\n                                <div class=\"excelerate-hotspots-hotspot-icon\">\n                                    7                                <\/div>\n                                <div class=\"excelerate-hotspots-hotspot-content\">\n                                    <div class=\"excelerate-hotspots-hotspot-headline\">Customize learners' navigation bar<\/div>\n                                    <div class=\"excelerate-hotspots-hotspot-text\"><\/div>\n                                <\/div>\n                            <\/div>\n                                                        <div class=\"excelerate-hotspots-hotspot\" style=\"top: 96%; left: 15%;\">\n                                <div class=\"excelerate-hotspots-hotspot-icon\">\n                                    8                                <\/div>\n                                <div class=\"excelerate-hotspots-hotspot-content\">\n                                    <div class=\"excelerate-hotspots-hotspot-headline\">Additionally, customize individual elements individually.<\/div>\n                                    <div class=\"excelerate-hotspots-hotspot-text\"><\/div>\n                                <\/div>\n                            <\/div>\n                                                        <div class=\"excelerate-hotspots-hotspot excelerate-hotspots-hotspot-right\" style=\"top: 10%; left: 90%;\">\n                                <div class=\"excelerate-hotspots-hotspot-icon\">\n                                    9                                <\/div>\n                                <div class=\"excelerate-hotspots-hotspot-content\">\n                                    <div class=\"excelerate-hotspots-hotspot-headline\">Change background view<\/div>\n                                    <div class=\"excelerate-hotspots-hotspot-text\">By default, you will see two backgrounds here: a light one and a dark one. If you add more backgrounds later in step 4, they will also automatically become available for selection here.<\/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-8ba31c9 elementor-widget elementor-widget-spacer\" data-id=\"8ba31c9\" 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-fb5b20c elementor-widget elementor-widget-text-editor\" data-id=\"fb5b20c\" 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>Menu bar<\/h2>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-954549c elementor-widget elementor-widget-hotspots\" data-id=\"954549c\" 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\/Menueleiste.jpg\" \/>\n                <div class=\"excelerate-hotspots-hotspots\">\n                                                <div class=\"excelerate-hotspots-hotspot excelerate-hotspots-hotspot-right\" style=\"top: 50%; left: 51%;\">\n                                <div class=\"excelerate-hotspots-hotspot-icon\">\n                                    1                                <\/div>\n                                <div class=\"excelerate-hotspots-hotspot-content\">\n                                    <div class=\"excelerate-hotspots-hotspot-headline\">Menu bar<\/div>\n                                    <div class=\"excelerate-hotspots-hotspot-text\">In the menu bar, you will find the same items as on the Theme Builder home screen. They allow you to quickly switch between the different settings.<\/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-e6f20e0 elementor-widget elementor-widget-text-editor\" data-id=\"e6f20e0\" 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>Key points<\/h2>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-52efcf0 elementor-widget elementor-widget-hotspots\" data-id=\"52efcf0\" 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\/Speichern.jpg\" \/>\n                <div class=\"excelerate-hotspots-hotspots\">\n                                                <div class=\"excelerate-hotspots-hotspot\" style=\"top: 17%; left: 43%;\">\n                                <div class=\"excelerate-hotspots-hotspot-icon\">\n                                    1                                <\/div>\n                                <div class=\"excelerate-hotspots-hotspot-content\">\n                                    <div class=\"excelerate-hotspots-hotspot-headline\">Theme Settings<\/div>\n                                    <div class=\"excelerate-hotspots-hotspot-text\">Click the settings icon to customize your theme name and logo.<\/div>\n                                <\/div>\n                            <\/div>\n                                                        <div class=\"excelerate-hotspots-hotspot excelerate-hotspots-hotspot-right\" style=\"top: 17%; left: 54%;\">\n                                <div class=\"excelerate-hotspots-hotspot-icon\">\n                                    2                                <\/div>\n                                <div class=\"excelerate-hotspots-hotspot-content\">\n                                    <div class=\"excelerate-hotspots-hotspot-headline\">Save<\/div>\n                                    <div class=\"excelerate-hotspots-hotspot-text\">Click the \u201eSave\u201c button to save your theme customizations<\/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-bf6517a elementor-widget elementor-widget-spacer\" data-id=\"bf6517a\" 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 Branding ohne Kompromisse: Der neue Theme Builder gibt dir die volle Kontrolle \u00fcber das Frontend-Design deiner WBTs. Erstelle individuelle Themes f\u00fcr verschiedene Abteilungen, Kunden oder externe Partner, um jedem Projekt den passenden Look zu verpassen. Du kannst dein Theme direkt zum Start festlegen oder flexibel beim finalen Export anwenden. Schau dir den Aufbau des [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"closed","template":"","meta":{"footnotes":""},"doc_category":[20],"doc_tag":[],"class_list":["post-827","docs","type-docs","status-publish","hentry","doc_category-theme-builder"],"year_month":"2026-09","word_count":218,"total_views":0,"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":"Theme Builder","term_url":"https:\/\/help.excelerate.app\/en\/docs-category\/theme-builder\/"}],"doc_tag_info":[],"knowledge_base_info":[],"knowledge_base_slug":[],"_links":{"self":[{"href":"https:\/\/help.excelerate.app\/en\/wp-json\/wp\/v2\/docs\/827","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=827"}],"version-history":[{"count":49,"href":"https:\/\/help.excelerate.app\/en\/wp-json\/wp\/v2\/docs\/827\/revisions"}],"predecessor-version":[{"id":4297,"href":"https:\/\/help.excelerate.app\/en\/wp-json\/wp\/v2\/docs\/827\/revisions\/4297"}],"wp:attachment":[{"href":"https:\/\/help.excelerate.app\/en\/wp-json\/wp\/v2\/media?parent=827"}],"wp:term":[{"taxonomy":"doc_category","embeddable":true,"href":"https:\/\/help.excelerate.app\/en\/wp-json\/wp\/v2\/doc_category?post=827"},{"taxonomy":"doc_tag","embeddable":true,"href":"https:\/\/help.excelerate.app\/en\/wp-json\/wp\/v2\/doc_tag?post=827"}],"curies":[{"name":"WP","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}