{"id":1295,"date":"2026-05-28T12:08:50","date_gmt":"2026-05-28T12:08:50","guid":{"rendered":"https:\/\/help.excelerate.app\/?post_type=docs&p=1295"},"modified":"2026-06-11T16:05:26","modified_gmt":"2026-06-11T16:05:26","password":"","slug":"kaesten","status":"publish","type":"docs","link":"https:\/\/help.excelerate.app\/en\/help\/kaesten\/","title":{"rendered":"Boxes"},"content":{"rendered":"
\n\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t\t\t\t\t\t

Application<\/h2>

Passe f\u00fcr jeden Hintergrund die K\u00e4sten entsprechend an. Lege gem\u00e4\u00df dem Corporate Design fest, welche Farben deine Fl\u00e4chen (K\u00e4sten) erhalten sollen. Diese Farben werden bei Elementen wie dem Big Slider, Tabs, Flipcards, Tabellen oder dem Akkordeon verwendet.<\/p><\/div><\/div><\/div>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t

\n\t\t\t\t\t\t\t
\n\t\t\t
<\/div>\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t
\n\t\t\t\t\t\t\t\t\t

K\u00e4sten \u00dcbersicht finden<\/h2>

Um deine K\u00e4sten anzupassen und zu verwalten, klicke auf den f\u00fcnften Punkt \u201eK\u00e4sten\u201c.<\/p><\/div>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t

\n\t\t\t\t\t
\n \n
\n
\n
\n 1 <\/div>\n
\n
K\u00e4sten finden<\/div>\n
W\u00e4hle K\u00e4sten aus, um weitere Einstellungen zu sehen.<\/div>\n <\/div>\n <\/div>\n <\/div>\n\t\t <\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t
\n\t\t\t\t\t\t\t
\n\t\t\t
<\/div>\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t
\n\t\t\t\t\t\t\t\t\t

K\u00e4sten \u00dcbersicht<\/h2>

In der K\u00e4sten \u00dcbersicht befinden sich drei Bereiche: die K\u00e4stenfarben, die Sonderfarben und die Overlay-Farbanpassung. Wir gehen alle Bereiche Schritt f\u00fcr Schritt durch, damit wir am Ende ein ansprechendes Frontend gestalten, bei dem alle Einstellungen stimmen.<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t

\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\"\"\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t
\n\t\t\t\t\t\t\t
\n\t\t\t
<\/div>\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t
\n\t\t\t\t\t\t\t\t\t

Schritt 1 – K\u00e4stenfarben<\/h2>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t
\n\t\t\t\t\t
\n \n
\n
\n
\n 1 <\/div>\n
\n
Farben<\/div>\n
Klicke auf einen deiner Hintergr\u00fcnde, um die Farben und weitere Eigenschaften der darauf platzierten K\u00e4sten anzupassen.<\/div>\n <\/div>\n <\/div>\n <\/div>\n\t\t <\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t
\n\t\t\t\t\t\t\t
\n\t\t\t
<\/div>\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t
\n\t\t\t\t\t\t\t\t\t

Schritt 2 – K\u00e4stenfarben anpassen<\/h2>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t
\n\t\t\t\t\t
\n \n
\n
\n
\n 1 <\/div>\n
\n
Color<\/div>\n
Lege mit dem Farben-Picker einen Farbwert f\u00fcr deine K\u00e4sten fest, wie z.B. hier auf einem prim\u00e4ren hellen Hintergrund. Dies kann hier wieder entweder eine solide Fl\u00e4che oder ein Verlauf sein.<\/div>\n <\/div>\n <\/div>\n
\n
\n 2 <\/div>\n
\n
Kontur<\/div>\n
Lege fest, ob deine K\u00e4sten eine Kontur bekommen oder nicht und zus\u00e4tzlich, welche Farbe und Konturst\u00e4rke (Dicke) sie haben.<\/div>\n <\/div>\n <\/div>\n
\n
\n 3 <\/div>\n
\n
Schatten<\/div>\n
Lege die Farbe der Schatten fest. Die Tiefe kannst du in den Einstellungen vom Stil noch mal ver\u00e4ndern, falls sie anders sein soll.<\/div>\n <\/div>\n <\/div>\n
\n
\n 4 <\/div>\n
\n
Text<\/div>\n
Lege fest, welche Farbe der Text hat. Die Werte werden von den Einstellungen der Typografie \u00fcbernommen.<\/div>\n <\/div>\n <\/div>\n <\/div>\n\t\t <\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t
\n\t\t\t\t\t\t\t
\n\t\t\t
<\/div>\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t
\n\t\t\t\t\t\t\t\t\t

Sonderfarben<\/h2>

Klicke auf den Tab \u201eSonderfarben\u201c. Dort werden dir drei Werte angezeigt: \u201ePositiv\u201c, \u201eNegativ\u201c und \u201eNeutral\u201c. Diese Farben sind besonders wichtig, da sie in Quizzes f\u00fcr die Auswertung verwendet werden. So kannst du festlegen, welche Farben beim Bestehen, Nichtbestehen oder f\u00fcr allgemeine Hinweise bzw. Warnungen angezeigt werden sollen. Zus\u00e4tzlich stehen diese Farben auch f\u00fcr das Element \u201eBox\u201c zur Verf\u00fcgung.<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t

\n\t\t\t\t\t
\n \n
\n
\n
\n 1 <\/div>\n
\n
Sonderfarbe bearbeiten<\/div>\n
Klicke auf eine Farbe, um sie zu \u00f6ffnen und zu bearbeiten.<\/div>\n <\/div>\n <\/div>\n <\/div>\n\t\t <\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t
\n\t\t\t\t\t\t\t
\n\t\t\t
<\/div>\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t
\n\t\t\t\t\t\t\t\t\t

Schritt 1 \u2013 Sonderfarben bearbeiten<\/h2>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t
\n\t\t\t\t\t
\n \n
\n
\n
\n 1 <\/div>\n
\n
Color<\/div>\n
Lege einen Farbwert f\u00fcr den positiven Wert mit dem Farben-Picker fest. Dies kann hier wieder, entweder eine solide Fl\u00e4che oder ein Verlauf sein.<\/div>\n <\/div>\n <\/div>\n
\n
\n 2 <\/div>\n
\n
Color<\/div>\n
Lege fest, ob dieser Wert eine Kontur bekommt oder nicht und zus\u00e4tzlich, welche Farbe und Konturst\u00e4rke (Dicke) die hat.<\/div>\n <\/div>\n <\/div>\n
\n
\n 3 <\/div>\n
\n
Schatten<\/div>\n
Stelle die Farbe der Schatten fest. Die Tiefe wird von den Einstellungen des Stils \u00fcbernommen.<\/div>\n <\/div>\n <\/div>\n
\n
\n 4 <\/div>\n
\n
Text<\/div>\n
Stelle die Farbe der Schatten fest. Die Tiefe wird von den Einstellungen des Stils \u00fcbernommen.<\/div>\n <\/div>\n <\/div>\n <\/div>\n\t\t <\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t
\n\t\t\t\t\t\t\t
\n\t\t\t
<\/div>\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t
\n\t\t\t\t\t\t\t\t\t

Schritt 2 – Sonderfarben \u00fcberpr\u00fcfen<\/h2>

Nachdem du alle Sonderfarben bearbeitet hast, \u00fcberpr\u00fcfe, ob deine Eingaben korrekt sind. Gehe dazu wie folgt vor:<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t

\n\t\t\t\t\t
\n \n
\n
\n
\n 1 <\/div>\n
\n
\u00dcberpr\u00fcfung<\/div>\n
Erstelle ein Beispiel-WBT und weise dein Theme zu. So kannst du die Farben beim Box-Element zuweisen und \u00fcberpr\u00fcfen.<\/div>\n <\/div>\n <\/div>\n <\/div>\n\t\t <\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t
\n\t\t\t\t\t\t\t
\n\t\t\t
<\/div>\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t
\n\t\t\t\t\t\t\t\t\t

Overlay<\/h2>

Entscheide, wie das Overlay visuell in deinem Theme aussieht. Du hast die M\u00f6glichkeit, dem Overlay alle deine Hintergrundfarben zuzuweisen, die du bei Punkt 4 eingestellt hast.<\/p><\/div>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t

\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\"\"\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t
\n\t\t\t\t\t\t\t
\n\t\t\t
<\/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":"

Anwendung Passe f\u00fcr jeden Hintergrund die K\u00e4sten entsprechend an. Lege gem\u00e4\u00df dem Corporate Design fest, welche Farben deine Fl\u00e4chen (K\u00e4sten) erhalten sollen. Diese Farben werden bei Elementen wie dem Big Slider, Tabs, Flipcards, Tabellen oder dem Akkordeon verwendet. K\u00e4sten \u00dcbersicht finden Um deine K\u00e4sten anzupassen und zu verwalten, klicke auf den f\u00fcnften Punkt \u201eK\u00e4sten\u201c. 1 […]<\/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-1295","docs","type-docs","status-publish","hentry","doc_category-theme-builder"],"year_month":"2026-08","word_count":471,"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\/1295","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=1295"}],"version-history":[{"count":73,"href":"https:\/\/help.excelerate.app\/en\/wp-json\/wp\/v2\/docs\/1295\/revisions"}],"predecessor-version":[{"id":3431,"href":"https:\/\/help.excelerate.app\/en\/wp-json\/wp\/v2\/docs\/1295\/revisions\/3431"}],"wp:attachment":[{"href":"https:\/\/help.excelerate.app\/en\/wp-json\/wp\/v2\/media?parent=1295"}],"wp:term":[{"taxonomy":"doc_category","embeddable":true,"href":"https:\/\/help.excelerate.app\/en\/wp-json\/wp\/v2\/doc_category?post=1295"},{"taxonomy":"doc_tag","embeddable":true,"href":"https:\/\/help.excelerate.app\/en\/wp-json\/wp\/v2\/doc_tag?post=1295"}],"curies":[{"name":"WP","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}