Wie füge ich in Kadence ein Bild als Hintergrund ein und platziere einen Hero-Bereich darauf?

Question

Wie füge ich in Kadence ein Bild als Hintergrund ein und platziere einen Hero-Bereich darauf?

Antwort

Verwandte Fragen

Wie baue ich in Kadence 1.4.2 auf der Startseite einen Hero-Bereich in voller Breite mit 600 px Höhe ein?

Wo kann ich in Kadence 1.4.2 die Höhe des Hero-Bereichs einstellen?

Welche Funktionen bieten die vorgefertigten Testimonial-Seiten von Kadence?

Wie kann ich im WordPress Kadence-Theme eine komplette Seite vorübergehend für Nutzer unsichtbar machen?

Soll das Hero-Bild bei Kadence in WordPress als Hintergrundbild in die Hero-Section oder in einen eigenen Block?

Was kommt bei der Seitengestaltung in Kadence 1.4.2 zuerst: ein Spaltenlayout oder ein Abschnitt?

Wie ändere ich in Kadence 1.4.2 für eine einzelne Seite den Background?

Wie funktioniert das Suchfeld im Kadence Theme?

Wie kann ich den gleichmäßigen Abstand zwischen Hero-Buttons im Kadence Theme 1.4.2 einstellen?

Soll das Hero-Bild in Kadence 1.4.2 im Spaltenlayout oder im Abschnitt des Spaltenlayouts platziert werden?

Accepted Answer

Um bei Kadence (dem WordPress-Theme bzw. -Block-Plugin) ein Bild als Hintergrund einzufügen und darauf einen Hero-Block zu platzieren, gehst du wie folgt vor: 1. **Seite oder Beitrag bearbeiten:** Öffne die gewünschte Seite oder den Beitrag im WordPress-Editor. 2. **Kadence Row Layout Block einfügen:** Klicke auf das Plus-Symbol (+) und suche nach „Row Layout“ (Kadence-Block). Füge diesen Block ein. 3. **Hintergrundbild einstellen:** - Wähle den eingefügten Row Layout Block aus. - In der rechten Seitenleiste findest du die Einstellungen für den Block. - Unter „Hintergrund“ kannst du „Bild“ auswählen. - Lade dein gewünschtes Bild hoch oder wähle eines aus der Mediathek. - Passe ggf. die Einstellungen für Position, Größe (z.B. „Cover“), Wiederholung und Überlagerung (Overlay) an. 4. **Hero-Element hinzufügen:** - Innerhalb des Row Layout Blocks kannst du weitere Blöcke einfügen, z.B. Überschrift, Text, Button usw. - Gestalte diese Elemente nach deinen Wünschen – das ist dann dein „Hero“. 5. **Abstände und Design anpassen:** - Passe ggf. Padding/Margin an, damit der Hero-Bereich gut aussieht. - Du kannst auch eine Farbüberlagerung (Overlay) auf das Hintergrundbild legen, um den Text besser lesbar zu machen. **Tipp:** Kadence bietet viele Designoptionen direkt im Block-Editor. Falls du weitere Anpassungen brauchst, findest du mehr Infos in der [Kadence Dokumentation](https://www.kadencewp.com/help-center/). So kannst du einfach ein Bild als Hintergrund setzen und darauf einen Hero-Bereich gestalten.

Accepted Answer

Um im Kadence Theme (Version 1.4.2) auf der Startseite einen Hero-Bereich mit voller Breite und einer festen Höhe von 600 px einzubauen, gehe wie folgt vor: 1. **Seite bearbeiten:** Gehe im... [mehr]

Accepted Answer

Um im Kadence Theme (Version 1.4.2) auf der Startseite einen Hero-Bereich mit voller Breite und einer festen Höhe von 600 px einzubauen, gehe wie folgt vor: 1. **Seite bearbeiten:** Gehe im WordPress-Backend zu „Seiten“ und bearbeite deine Startseite. 2. **Kadence-Block hinzufügen:** Füge einen neuen „Row Layout“-Block von Kadence Blocks hinzu. 3. **Volle Breite einstellen:** Wähle im Block-Editor den Row Layout-Block aus. Stelle unter „Layout“ die Option „Fullwidth“ (Volle Breite) ein. Setze die „Content Max Width“ auf „Fullwidth“ oder lasse sie leer, damit der Inhalt ebenfalls die volle Breite nutzt. 4. **Höhe festlegen:** Scrolle im Block-Editor zu den Einstellungen für den Row Layout-Block. Unter „Design“ findest du das Feld „Min Height“ (Mindesthöhe). Trage dort „600px“ ein. 5. **Hintergrundbild oder Farbe hinzufügen (optional):** Im selben Bereich kannst du unter „Background Settings“ ein Bild oder eine Farbe für den Hero-Bereich festlegen. 6. **Inhalt einfügen:** Füge Überschriften, Text oder Buttons in den Row Layout-Block ein, wie du möchtest. 7. **Seite aktualisieren:** Speichere oder aktualisiere die Seite. **Hinweis:** Falls du den Gutenberg-Editor nicht nutzt, sondern den klassischen Editor oder einen anderen Page Builder, kann die Vorgehensweise abweichen. **Weitere Infos:** - [Kadence Blocks Dokumentation](https://www.kadencewp.com/kadence-blocks/documentation/) - [Kadence Theme Support](https://www.kadencewp.com/support/) So erhältst du einen Hero-Bereich mit voller Breite und einer festen Höhe von 600 px auf deiner Startseite.

Accepted Answer

In Kadence (Version 1.4.2) kannst du die Höhe des Hero-Bereichs (meist als „Hero Section“, „Hero Header“ oder „Page Title Area“ bezeichnet) auf verschiedene Ar... [mehr]

Accepted Answer

In Kadence (Version 1.4.2) kannst du die Höhe des Hero-Bereichs (meist als „Hero Section“, „Hero Header“ oder „Page Title Area“ bezeichnet) auf verschiedene Arten anpassen, je nachdem, wie du den Hero erstellt hast: **1. Über den Customizer (bei Standard-Page-Title-Hero):** - Gehe zu **Design > Customizer**. - Navigiere zu **Seitenkopf > Seiten-Titel-Layout** (oder ähnlich, je nach Spracheinstellung). - Dort findest du Einstellungen für den Abstand oben/unten oder die Höhe des Hero-Bereichs. Passe die Werte nach deinen Wünschen an. **2. Über Kadence Blocks (bei individuellem Hero mit Block-Editor):** - Öffne die Seite oder den Beitrag im WordPress-Editor. - Wenn du den Hero mit einem „Row Layout“-Block von Kadence erstellt hast, wähle diesen Block aus. - In der rechten Seitenleiste findest du unter „Layout“ die Option **Minimale Höhe** (z.B. in Pixel oder VH – Viewport Height). - Trage dort den gewünschten Wert ein, z.B. „500px“ oder „80vh“, um die Höhe festzulegen. **3. Über individuelles CSS:** Falls die obigen Optionen nicht ausreichen, kannst du eigenes CSS verwenden: - Gehe zu **Design > Customizer > Zusätzliches CSS**. - Füge z.B. Folgendes ein (ersetze `.dein-hero-selector` durch die tatsächliche CSS-Klasse deines Hero-Bereichs): ```css .dein-hero-selector { min-height: 500px; } ``` **Tipp:** Um die richtige CSS-Klasse zu finden, kannst du im Browser mit Rechtsklick auf den Hero-Bereich und „Element untersuchen“ arbeiten. **Weitere Infos:** Offizielle Kadence-Dokumentation: https://www.kadencewp.com/help-center/ **Hinweis:** Die genauen Bezeichnungen können je nach Theme-Einstellungen und Sprache leicht abweichen. Bei individuellen Seitenbaukästen (z.B. Elementor) gelten andere Wege. Falls du eine bestimmte Seite oder einen bestimmten Block meinst, prüfe, ob du den Hero mit Kadence Blocks oder über die Theme-Einstellungen erstellt hast – davon hängt der genaue Weg ab.

Accepted Answer

Die vorgefertigten Testimonial-Seiten von Kadence (https://www.kadencewp.com/) bieten in der Regel folgende Funktionen: 1. **Vorgefertigte Layouts:** Verschiedene moderne und anpassbare Designs f&uum... [mehr]

Accepted Answer

Die vorgefertigten Testimonial-Seiten von Kadence (https://www.kadencewp.com/) bieten in der Regel folgende Funktionen: 1. **Vorgefertigte Layouts:** Verschiedene moderne und anpassbare Designs für die Präsentation von Kundenmeinungen. 2. **Responsive Design:** Optimale Darstellung auf allen Endgeräten (Desktop, Tablet, Smartphone). 3. **Einfache Integration:** Testimonials können per Drag-and-drop in Seiten oder Beiträge eingefügt werden. 4. **Anpassbare Elemente:** Möglichkeit, Bilder, Namen, Positionen und Unternehmen der Kunden hinzuzufügen. 5. **Bewertungssterne:** Option, Sternebewertungen anzuzeigen. 6. **Slider- und Grid-Layouts:** Testimonials können als Karussell/Slider oder in einem Raster angezeigt werden. 7. **Styling-Optionen:** Anpassung von Farben, Schriftarten, Abständen und Rahmen direkt im Customizer oder Block-Editor. 8. **Filter- und Sortierfunktionen:** (Je nach Template) Möglichkeit, Testimonials nach Kategorien oder Tags zu filtern. 9. **Integration mit Kadence Blocks:** Volle Kompatibilität mit dem Kadence Blocks Plugin für den Gutenberg-Editor. 10. **Call-to-Action-Elemente:** Möglichkeit, Buttons oder Links zu integrieren, um Besucher zu weiteren Aktionen zu führen. Die genauen Funktionen können je nach gewähltem Template und Kadence-Version (kostenlos oder Pro) variieren. Eine Übersicht der verfügbaren Testimonial-Layouts findest du im Kadence Design Library Bereich: https://www.kadencewp.com/kadence-blocks/design-library/ Weitere Details zu den Funktionen und Anpassungsmöglichkeiten bietet die offizielle Dokumentation: https://www.kadencewp.com/help-center/kadence-blocks/testimonial-block/

Accepted Answer

Um im WordPress Kadence-Theme eine komplette Seite vorübergehend für Nutzer unsichtbar zu machen, gibt es mehrere Möglichkeiten. Hier sind die gängigsten Methoden: **1. Status der... [mehr]

Accepted Answer

Um im WordPress Kadence-Theme eine komplette Seite vorübergehend für Nutzer unsichtbar zu machen, gibt es mehrere Möglichkeiten. Hier sind die gängigsten Methoden: **1. Status der Seite auf "Entwurf" setzen:** - Gehe im WordPress-Backend zu **Seiten**. - Wähle die gewünschte Seite aus. - Ändere im rechten Bereich unter **Status & Sichtbarkeit** den Status von "Veröffentlicht" auf **Entwurf**. - Speichere die Änderung. Die Seite ist nun für Besucher nicht mehr sichtbar, aber weiterhin für Administratoren im Backend verfügbar. **2. Sichtbarkeit auf "Privat" setzen:** - Öffne die Seite im Bearbeitungsmodus. - Unter **Status & Sichtbarkeit** findest du die Option **Sichtbarkeit**. - Wähle **Privat** aus und aktualisiere die Seite. Nur eingeloggte Administratoren und Redakteure können die Seite sehen. **3. Passwortschutz aktivieren:** - Im Bearbeitungsmodus der Seite unter **Sichtbarkeit** die Option **Passwortgeschützt** wählen. - Ein Passwort vergeben und die Seite aktualisieren. Nur Nutzer mit dem Passwort können die Seite aufrufen. **4. Mit einem Maintenance-Plugin arbeiten:** Es gibt Plugins wie [WP Maintenance Mode](https://de.wordpress.org/plugins/wp-maintenance-mode/) oder [Coming Soon Page & Maintenance Mode by SeedProd](https://de.wordpress.org/plugins/coming-soon/), mit denen du gezielt einzelne Seiten oder die gesamte Website für Besucher sperren kannst. **Hinweis:** Diese Methoden funktionieren unabhängig vom verwendeten Theme, also auch mit dem Kadence-Theme. **Tipp:** Wenn du die Seite später wieder sichtbar machen möchtest, stelle den Status einfach wieder auf "Veröffentlicht" oder ändere die Sichtbarkeit zurück auf "Öffentlich".

Accepted Answer

Bei Kadence in WordPress ist es üblich, das Hero-Bild als **Hintergrundbild** direkt in der Hero-Section zu verwenden. Die Hero-Section (z.B. der „Row Layout“-Block von Kadence) biete... [mehr]

Accepted Answer

Bei Kadence in WordPress ist es üblich, das Hero-Bild als **Hintergrundbild** direkt in der Hero-Section zu verwenden. Die Hero-Section (z.B. der „Row Layout“-Block von Kadence) bietet die Möglichkeit, ein Hintergrundbild festzulegen, über das dann Überschrift, Text und Buttons gelegt werden. So erreichst du das klassische Hero-Design mit Bild und überlagertem Inhalt. Ein eigenes Bild-Element (z.B. ein „Image“-Block) wird in der Regel **nicht** verwendet, da es sonst schwieriger ist, Text und Buttons optimal zu positionieren und das gewünschte Layout (z.B. mit Overlay) zu erzielen. **Zusammengefasst:** Das Hero-Bild gehört als Hintergrundbild in die Hero-Section, nicht als separater Bild-Block. Weitere Infos findest du direkt bei [Kadence WP](https://www.kadencewp.com/help-center/docs/kadence-blocks/row-layout-background-settings/).

Accepted Answer

Bei der Seitengestaltung mit Kadence (z. B. im Kadence Theme oder Kadence Blocks für WordPress) kommt zuerst ein Abschnitt (englisch: „Section“ oder „Row Layout“). Ein Abs... [mehr]

Accepted Answer

Bei der Seitengestaltung mit Kadence (z. B. im Kadence Theme oder Kadence Blocks für WordPress) kommt zuerst ein Abschnitt (englisch: „Section“ oder „Row Layout“). Ein Abschnitt dient als Container für verschiedene Inhalte und Layout-Elemente. Innerhalb eines Abschnitts kannst du dann ein Spaltenlayout (englisch: „Columns“ oder „Column Layout“) hinzufügen, um Inhalte nebeneinander anzuordnen. **Reihenfolge:** 1. Abschnitt/Row Layout erstellen 2. Innerhalb des Abschnitts ein Spaltenlayout hinzufügen So kannst du die Struktur deiner Seite flexibel aufbauen und später Inhalte in die einzelnen Spalten einfügen. Weitere Infos findest du direkt bei [Kadence WP](https://www.kadencewp.com/).

Accepted Answer

In Kadence Theme Version 1.4.2 kannst du für eine einzelne Seite den Hintergrund (Background) auf verschiedene Arten anpassen. Die einfachste Methode ist die Nutzung der Seiteneinstellungen im Wo... [mehr]

Accepted Answer

In Kadence Theme Version 1.4.2 kannst du für eine einzelne Seite den Hintergrund (Background) auf verschiedene Arten anpassen. Die einfachste Methode ist die Nutzung der Seiteneinstellungen im WordPress-Editor: **So gehst du vor:** 1. **Seite bearbeiten:** Gehe im WordPress-Backend zu „Seiten“ und wähle die gewünschte Seite zum Bearbeiten aus. 2. **Kadence-Seiteneinstellungen öffnen:** Im Editor findest du rechts (oder unten, je nach Bildschirmgröße) die „Kadence-Seiteneinstellungen“. Falls du den Gutenberg-Editor verwendest, klicke auf das Kadence-Logo oder den Tab „Seiten-Einstellungen“ in der Seitenleiste. 3. **Hintergrund einstellen:** In den Kadence-Seiteneinstellungen gibt es einen Bereich „Design“ oder „Hintergrund“. Hier kannst du eine individuelle Hintergrundfarbe oder ein Hintergrundbild für diese Seite festlegen. 4. **Speichern:** Nach der Auswahl speichere oder aktualisiere die Seite. **Alternative Methode (mit benutzerdefiniertem CSS):** Falls die Kadence-Seiteneinstellungen nicht ausreichen, kannst du auch individuelles CSS nutzen: - Notiere dir die Seiten-ID (z.B. `page-id-123`). - Gehe zu „Design“ > „Customizer“ > „Zusätzliches CSS“. - Füge folgenden Code ein (ersetze 123 durch deine Seiten-ID): ```css .page-id-123 { background: #deineFarbe; /* oder background-image: url('deinBild.jpg'); */ } ``` **Hinweis:** Die genaue Bezeichnung der Einstellungen kann je nach Kadence-Version und WordPress-Editor leicht variieren. Falls du die Option nicht findest, prüfe, ob du das Kadence-Theme und ggf. das Kadence Blocks Plugin aktuell installiert hast. Weitere Infos findest du auch in der [Kadence Theme Dokumentation](https://www.kadencewp.com/help-center/docs/kadence-theme/). **Tipp:** Bei manchen Seitenbaukästen (wie Elementor oder WPBakery) gibt es zusätzliche Optionen direkt im Editor. **Fazit:** Am einfachsten ist die Anpassung über die Kadence-Seiteneinstellungen im Editor. Für mehr Flexibilität kannst du eigenes CSS verwenden.

Accepted Answer

Das Suchfeld im Kadence Theme für WordPress funktioniert wie folgt: 1. **Integration**: Das Kadence Theme bietet ein integriertes Suchfeld, das du über den Customizer oder den Header-Builde... [mehr]

Accepted Answer

Das Suchfeld im Kadence Theme für WordPress funktioniert wie folgt: 1. **Integration**: Das Kadence Theme bietet ein integriertes Suchfeld, das du über den Customizer oder den Header-Builder hinzufügen kannst. Es nutzt die Standard-WordPress-Suchfunktion. 2. **Funktionsweise**: Wenn ein Nutzer einen Suchbegriff eingibt und absendet, wird eine Anfrage an die WordPress-Suchfunktion gestellt. Die Ergebnisseite zeigt dann Beiträge, Seiten oder andere Inhalte an, die den Suchbegriff enthalten. 3. **Anpassung**: Im Customizer kannst du das Aussehen und die Platzierung des Suchfelds anpassen (z.B. als Icon, als Eingabefeld oder als Overlay). Auch die Farben und Abstände lassen sich konfigurieren. 4. **Erweiterungen**: Mit Plugins wie [WP Search with Algolia](https://de.wordpress.org/plugins/wp-search-with-algolia/) oder [Relevanssi](https://de.wordpress.org/plugins/relevanssi/) kannst du die Suchfunktion erweitern, z.B. für bessere Relevanz oder Live-Suche. 5. **Technik**: Das Suchfeld ist meist ein HTML-Formular, das eine GET-Anfrage an die URL deiner Seite mit dem Parameter `?s=Suchbegriff` sendet. WordPress verarbeitet diesen Parameter und zeigt die passenden Ergebnisse an. Weitere Informationen findest du in der [Kadence Theme Dokumentation](https://www.kadencewp.com/help-center/docs/kadence-theme/header-search/).

Accepted Answer

Um den gleichmäßigen Buttonabstand bei den Hero Buttons im Kadence Theme (Version 1.4.2) einzustellen, gehe wie folgt vor: 1. **Bearbeite die Seite** mit dem Hero-Block, auf der die Button... [mehr]

Accepted Answer

Um den gleichmäßigen Buttonabstand bei den Hero Buttons im Kadence Theme (Version 1.4.2) einzustellen, gehe wie folgt vor: 1. **Bearbeite die Seite** mit dem Hero-Block, auf der die Buttons eingefügt sind. 2. **Wähle den Hero-Block** aus (meist „Row Layout“ oder „Advanced Button“ Block). 3. **Wähle den Button-Container** (also das Element, das die Buttons enthält, nicht den einzelnen Button). 4. Im rechten Einstellungsbereich findest du unter **„Abstand“** oder **„Spacing“** die Option für **„Button Abstand“** oder **„Button Gap“** (je nach Spracheinstellung). 5. **Stelle hier den gewünschten Abstand** (z.B. 16px) ein. Die Buttons werden dann gleichmäßig voneinander getrennt. **Hinweis:** Falls du mehrere Buttons als einzelne Blöcke eingefügt hast, kannst du sie in einen „Buttons“-Block gruppieren und dort den Abstand einstellen. **Tipp:** Sollte die Option im Block-Editor nicht sichtbar sein, prüfe, ob du die aktuellste Version des Kadence Blocks Plugins verwendest: https://de.wordpress.org/plugins/kadence-blocks/ **Weitere Infos:** Offizielle Kadence Dokumentation: https://www.kadencewp.com/help-center/docs/kadence-blocks/advanced-button-block/ So kannst du den Buttonabstand einfach und gleichmäßig einstellen.

Accepted Answer

In Kadence (Version 1.4.2) solltest du das Hero-Bild im **Abschnitt** des Spaltenlayouts platzieren, nicht direkt in einer einzelnen Spalte. Der Abschnitt (englisch: "Section") bildet den &u... [mehr]

Accepted Answer

In Kadence (Version 1.4.2) solltest du das Hero-Bild im **Abschnitt** des Spaltenlayouts platzieren, nicht direkt in einer einzelnen Spalte. Der Abschnitt (englisch: "Section") bildet den übergeordneten Rahmen für das gesamte Spaltenlayout und ermöglicht dir, das Hintergrundbild (Hero-Bild) für den gesamten Bereich festzulegen. So erstreckt sich das Bild über die volle Breite des Spaltenlayouts und nicht nur über eine einzelne Spalte. **Vorgehen:** 1. Füge einen neuen Abschnitt (Section) hinzu. 2. Lege im Abschnitt das Hintergrundbild (Hero-Bild) fest. 3. Füge innerhalb des Abschnitts das gewünschte Spaltenlayout hinzu. 4. Platziere deine Inhalte in den einzelnen Spalten. **Vorteil:** Das Hero-Bild bleibt so responsiv und deckt den gesamten Bereich ab, während du die Inhalte flexibel in den Spalten anordnen kannst. Weitere Infos findest du in der [Kadence Dokumentation](https://www.kadencewp.com/help-center/).