Kostenloses Elementor-Infobox-Widget mit Symbol- und Bildstilen
Info Box ist ein kostenloses Master Addons Widget, das eine Karte aus einem Symbol oder Bild, einem Titel und einer kurzen Beschreibung erstellt Wählen Sie eine Style Preset, füllen Sie den Text aus und stylen Sie das Feld, Symbol, Titel und Beschreibung aus dem Elementor-Panel Das kostenlose Plugin beinhaltet Variation Eins bis Fünf, und Master Add-dons Pro Fügt Variation Sechs zu Zehn, einen Hintergrund für ein Farbverlaufssymbol und eine Schaltfläche Weiterlesen bei Variation Sechs hinzu. Verwenden Sie es für Funktionszeilen, Servicelisten, Kontaktdaten und Schritte zum Funktionieren.
So fügen Sie ein Infofeld in Elementor hinzu
Sie benötigen Elementor und das kostenlose Master Addons Plugin von WordPress.org.
- Überprüfen Sie, ob Infobox eingeschaltet ist unter Master-Addons, Widgets.
- Suchen Sie im Elementor-Editor nach Info-box Und ziehen Sie es in eine Spalte.
- Wählen Sie einen Stilvoreinstellung. Variation Eins bis Fünf sind frei.
- Einstellen Bild oder SymbolWählen Sie dann das Symbol aus oder laden Sie das Bild hoch.
- Geben Sie den Titel und die Beschreibung ein und fügen Sie eine Titel-URL hinzu, wenn die Karte irgendwo verlinken soll.
- Öffnen Sie die Stil Tab zum Festlegen des Randes, Hintergrunds, der Hover-Animation, des Symbols und der Textstile Duplizieren Sie das Widget, um eine Zeile zu erstellen.
Jede Einstellung wird in der Einstellungen für das Info-Box-Widget Führung.
Stilvoreinstellungen: 5 kostenlos, 10 mit Pro
Die Stilvoreinstellung Dropdown ändert das Layout und die Dekoration der Karte, ohne Ihren Inhalt zu berühren Variation Eins bis Fünf funktioniert im kostenlosen Plugin Variation Zwei und Drei fügen eine große verblasste Kopie des Symbols hinter der Karte hinzu, und Variation Fünf setzt das Symbol in eine Sechseckform auf Pro entsperrt Variation Sechs bis Zehn.
- Bild oder Symbol: Wählen Sie Keine, Symbol oder Bild Bilder verwenden die Einstellung Bildauflösung.
- Titel-URL: Verlinkt den Titel Damit die ganze Karte anklickbar ist, nutzen Sie die kostenlose Wrapper-Link Erweiterung.
- Weiterlesen Text und Link: Nur auf Variation Six (Pro) angezeigt.
Titel und Beschreibung Styling
Die Titel und Beschreibung Abschnitte haben jeweils Typografie, Farbe, Ausrichtung und Aufpolsterung Beide haben Normal - und Hover-Registerkarten, und die Hover-Farbe ändert sich, wenn ein Besucher irgendwo auf die Karte zeigt, nicht nur auf den Text Der Titel wird immer als H3 wiedergegeben, also planen Sie Ihre Überschriftenreihenfolge darum herum.
- Typografie: Familie, Größe, Gewicht, Transformation, Stil, Dekoration, Linienhöhe, Buchstaben - und Wortabstand.
- Separate Hover-Farben für Titel und Beschreibung.
- Ausrichtung und Polsterung können je nach Gerät unterschiedlich sein.
Box, Icon und Hover Styling
Allgemeine Stile Deckt die Karte ab: Border Type, Border Width, Border Color, Border Radius, Padding und Margin Der Hintergrund hat Normal - und Hover-Tabs, jeweils mit klassischem oder Gradientenhintergrund. Hover-Animation Nutzt die Elementoreffekte wie Grow, Pulse, Push und Bob. Symbolstil Setzt Symbolgröße, Symbolfarbe, den Symbolhintergrund und die Ausrichtung, wiederum mit Normal- und Hover-Zuständen.
- Verschiedene Hintergründe für die normale und die gedeckte Karte.
- Symbol- und ausgeblendete Hintergrundsymbolfarben für beide Zustände.
- Ein Farbverlaufssymbolhintergrund auf Variation Six ist Pro.
Elementor-Symbolbox vs. Master-Addons-Infobox
Elementor versendet bereits kostenlose Icon Box und Image Box Widgets Sie reichen für viele Seiten, also hier ist, wo jeder passt.
| Merkmal | Elementor-Symbolbox | Master Addons Info Box |
|---|---|---|
| Preis | Kostenlos in Elementor | Kostenlos mit 5 Voreinstellungen, Pro fügt 5 weitere hinzu |
| Symbol oder Bild | Zwei Widgets: Icon Box und Image Box | Ein Widget mit None, Icon oder Image |
| Grundriss | Symbolposition Start, Ende, oben oder unten; Standard-, gestapeltes oder gerahmtes Symbol | Fertig hergestellte Style-Voreinstellungen |
| Titel HTML-Tag | H1 bis H6, div, span oder p | Immer H3 |
| zusammenfügen | Ein Link für das Symbol und den Titel | Titel-URL; ganze Karte mit Wrapper Link |
| Kartenhintergrund | Von der Registerkarte Erweitert | Normal und Hover Hintergründe, klassisch oder mit Farbverlauf |
| Schwebeeffekte | Symbol- und Titel-Hover-Farben, Symbol-Hover-Animation | Karten-Hover-Animation plus Hover-Farben für Symbol, Titel und Beschreibung |
| Read More Button | Nein | Nur Variation Six (Pro) |
Wählen Sie Elementor Icon Box, wenn Sie ein bestimmtes Überschrift-Tag oder ein Seitensymbol-Layout benötigen Wählen Sie Info Box, wenn Sie eine gestylte Karte mit Hover-Hintergründen in einem Schritt wünschen Für eine Karte mit Rückseite siehe Flipbox, und für eine Karte mit Knopf siehe Aufruf zum Handeln.
Häufig gestellte Fragen für Infobox
Ist das Info Box Widget kostenlos?
Ja. Info Box ist im kostenlosen Master Addons Plugin mit Variation One to Five. Master Add-dons Pro Fügt Variation Sechs zu Zehn, einen Farbverlaufssymbolhintergrund und die Schaltfläche Weiterlesen bei Variation Sechs hinzu.
Kann ich die gesamte Box verlinken, nicht nur den Titel?
Das Widget selbst verknüpft den Titel nur über die Titel-URL. Um die ganze Karte anklickbar zu machen, schalten Sie die kostenlose Wrapper-Link Erweiterung und fügen Sie den Link im Wrapper Link-Bereich des Widgets hinzu.
Wie unterscheidet sich Info Box von der Elementor Icon Box?
Elementor Icon Box ist kostenlos und lässt Sie das Titel-Tag auswählen und das Symbol an der Seite setzen Info Box gibt Ihnen fertige Voreinstellungen, Bild oder Symbol in einem Widget, und separate normale und Hover-Hintergründe für die Karte Der Info Box Titel ist immer ein H3.
Kann ich ein Bild anstelle eines Symbols verwenden?
Ja. Bild oder Symbol auf Bild setzen, eine Datei aus der Mediathek auswählen und eine Bildauflösung wählen Wählen Sie Keine für eine reine Textkarte.
Trendige Elementor-Widgets und -Erweiterungen
Erstellen Sie anspruchsvolle Websites in kürzerer Zeit.
Glasmorphie
Container-extras
Muster
![Master Addons Post/Page Duplicator-Erweiterung für Elementor: MA Duplicator Zeilenlink in der WordPress Pages-Liste, der eine Landing Page erstellt - [Duplicated #128] Entwurf](https://d1asvmc6qcowgk.cloudfront.net/wp-content/uploads/2026/09/15102930/post-page-duplicator-768x403.webp)
Post-/Seitenduplikator
