Bei der Preisgestaltung entscheiden die Besucher, daher muss die Tabelle einfach zu scannen und leicht zu vergleichen sein Das kostenlose Preistabellen-Widget In Master-Addons für Elementor Erstellen Sie einen einzigen Plan mit einem Header, einem Preis, einer Funktionsliste und einer Call-to-Action-Schaltfläche, und Sie legen einige nebeneinander fest, um einen vollständigen Preisabschnitt zu erstellen.
Sie benennen den Plan, legen den Preis und Zeitraum fest, listen die Funktionen auf, fügen dann ein Band hinzu, um das beliebte zu markieren und die Farben zu stylen Keine handcodierten Tabellen Diese Anleitung deckt jede Einstellung im Widget ab.
Was das Widget der Preistabelle bewirkt #
Das Widget erstellt einen Plan nach dem anderen. Jedes hat einen Header mit Titel, Untertitel und Preis, eine Liste mit Funktionen mit Häkchensymbolen, eine Schaltfläche und eine optionale Fußzeile. Lassen Sie drei in eine Reihe fallen und Sie haben einen klassischen Preisvergleich.
Drei Tabs führen es aus. Inhalt Hält das Layout, den Header-Text, den Preis, die Funktionen und das Menüband. Stil Behandelt den Header-Hintergrund, die Funktions- und Preisfarben sowie die Schaltfläche. Fortgeschritten Ist der übliche Elementorabstand und die Sichtbarkeit.
Bevor Sie beginnen #
- WordPress Mit Elementor Installiert und aktiv.
- Master-Addons für Elementor Installiert und aktiv Neu im Plugin? siehe die Installationsführung.
- Ihre Plannamen, Preise, Funktionslisten und wo jede Schaltfläche verlinken soll.
So fügen Sie das Widget der Preistabelle hinzu #
Öffnen Sie im Elementor-Editor die Elemente Panel und suchen nach Preistabelle, oder scrollen Sie zum Abschnitt Master Addons (die Widgets tragen ein lila MA-Abzeichen) Ziehen Sie es auf die Seite und es wird mit einem Beispielplan geladen, den Sie bearbeiten können.
Legen Sie das Layout fest #
Öffnen Sie die Inhalt Tab. Die Preisinhalt Der Abschnitt legt das Gesamtlayout sowie zwei schnelle Umschaltungen fest und darunter befinden sich die Abschnitte Kopfzeile, Preise, Funktionen, Fußzeile und Band.
- Layout: Eines von fünf Designs: Standard, Left Align Content, Rounded Table, Tisch mit BG-Bild oder Skew BG Pattern.
- Highlight-tabelle?: Diesen Plan anheben, damit er sich von den anderen abhebt.
- Funktionen anzeigen?: Feature-Liste ein - oder ausblenden.
Bearbeiten Sie den Header #
Öffnen Sie die Kopfzeile Abschnitt für den Plannamen und den Slogan Hier wählt man auch den Headerhintergrund aus, der jedem Plan seine Farbe verleiht.
- Kopfzeile BG Farbe: Eine von drei Verlaufsvoreinstellungen oder benutzerdefiniert zum Festlegen Ihrer eigenen Farben auf der Registerkarte Stil.
- Titel und HTML-Tag: Der Planname und seine Überschriftsebene.
- Untertitel: Eine kurze Zeile unter dem Titel, wie Geeignet für einzelne Website.
Legen Sie den Preis fest #
Öffnen Sie die Preisgestaltung Abschnitt für die Nummer und wie sie sich liest Sie legen die Währung, den Betrag, den Abrechnungszeitraum und einen optionalen Verkaufspreis fest.
- Währungssymbol: Das vor dem Preis angezeigte Symbol, z. B. $ oder € Euro.
- Preis und Verkauf: Der Betrag mit einem Sale-Toggle, um ein durchgestrichenes Original anzuzeigen.
- Zeitraum: Der Text des Abrechnungszyklus, wie / Monat oder / Jahr.
Fügen Sie die Funktionen hinzu #
Öffnen Sie die Merkmale Abschnitt. Es handelt sich um einen Repeater, somit ist jedes Listenelement ein eigener Eintrag mit Beschriftung und einem Icon.
- Text: Das Feature-Label, wie Feature #1 oder Unlimited Tickets.
- Symbol: Das neben jedem Feature angezeigte Häkchen oder Kreuz.
- Tooltip: Eine optionale Hover-Notiz zur Erläuterung einer Funktion.
- Artikel hinzufügen: Fügen Sie so viele Funktionen hinzu, wie der Plan benötigt.
Fügen Sie ein Band hinzu #
Öffnen Sie die Band Abschnitt zum Hinzufügen eines Eckabzeichens wie Trending oder Popular. Es ist die schnellste Möglichkeit, Menschen auf den Plan zu zeigen, den sie auswählen sollen.
- Show und Titel: Schalten Sie das Menüband ein und stellen Sie seinen Text ein.
- Ausrichten und Position: Das Band in eine Ecke stellen und anstupsen.
- Drehen: Winkeln Sie das Band über die Ecke.
Den Tisch stylen #
Öffnen Sie die Stil Tab zur Steuerung von Farben und Abständen Es gibt Abschnitte für die Kopfzeile, Preise, Funktionen, Fußzeile und das Band, jeweils mit eigenen Farben und Typografie.
Die Fußzeile Abschnitt gestaltet die Call-to-Action-Taste mit Größe, Farben, Rand sowie Normal- und Hover-Zuständen, sodass die Taste zu Ihrer Marke passt und sich von der Funktionsliste abhebt.
Häufige Anwendungsfälle #
- SaaS und App-Pläne Mit drei Stufen und einem hervorgehobenen Favoriten.
- Mitgliedschaftsseiten Mit Basis- und Premium-Zugangsebenen.
- Agenturen und Freiberufler Angezeigte verpackte Service-Ebenen.
- Hosting und Tools Auflistung der Funktionen pro Plan mit Häkchen.
- Kurse und Veranstaltungen Grund - und Premiumtickets anbieten.
Tipps für die Arbeit mit dem Widget Pricing Table #
- Einen Plan hervorheben. Verwenden Sie den Highlight Table-Umschalter und ein Band auf dem Plan, den die meisten Leute kaufen sollen Markieren Sie alle drei und keiner von ihnen sticht hervor.
- Featurelisten gleichmäßig halten. Ähnliche Zeilenanzahlen über Pläne hinweg machen sie auf einen Blick leicht vergleichbar.
- Passen Sie den Knopf an die Aktion an. Kaufen Sie jetzt, starten Sie kostenlos und beginnen Sie alles anders. Wählen Sie also dasjenige aus, das zum Angebot passt.
- Verläufe sparsam einsetzen. Eine Akzentfarbe pro Plan liest sich sauberer als drei laute Farbverläufe, die gegeneinander kämpfen.
- Legen Sie klare Zeiträume fest. Immer anzeigen / Monat oder / Jahr, damit der Preis nie mehrdeutig ist.
Häufig gestellte Fragen #
Was ist das Pricing Table Widget in Master Addons?
Es handelt sich um ein Elementor-Widget, das einen Preisplan mit einem Header, einem Preis und Zeitraum, einer Funktionsliste und einer Schaltfläche erstellt. Sie platzieren einige nebeneinander, um einen vollständigen Preisabschnitt zu erstellen, und alles wird über das Elementor-Panel ohne Code eingestellt.
Wie markiere ich einen Plan als den beliebtesten?
Schalten Sie den Highlight Table-Umschalter im Bereich Preisinhalte ein, um den Plan zu erhöhen, und fügen Sie im Abschnitt Band ein Band mit Text wie Trending oder Popular hinzu. Zusammen ziehen sie den Blick auf den Plan, den Besucher wählen sollen.
Kann ich einen Sale oder ermäßigten Preis hinzufügen?
Ja. Der Bereich Preise hat einen Sale-Toggle Schalten Sie ihn ein und das Widget zeigt den Originalpreis durchgestrichen neben dem Verkaufspreis, so dass Besucher den Rabatt sehen können Sie legen das Währungssymbol und den Abrechnungszeitraum im selben Abschnitt fest.
Kann ich pro Plan mehr oder weniger Features zeigen?
Ja. Der Bereich Features ist ein Repeater Verwenden Sie Element hinzufügen, um Zeilen hinzuzufügen, und das X, um sie zu entfernen, so kann jeder Plan genau seine eigenen Funktionen auflisten Sie können die Feature-Liste auch vollständig mit dem Umschalter Features anzeigen ausblenden.
Kann ich den Preisfunktionen Tooltips hinzufügen?
Ja. Jedes Feature im Repeater hat einen Tooltip-Tab, so dass Sie einen kurzen Hover-Notiz anhängen können, der erklärt, was das Feature bedeutet Es ist praktisch für technische Features, bei denen das Label allein nicht klar genug ist.
Einwickelnd #
Das Widget der Preistabelle verwandelt Ihre Pläne in einen sauberen Vergleich: Legen Sie die Kopfzeile und den Preis fest, listen Sie die Funktionen auf, fügen Sie ein Menüband zum beliebten Plan hinzu und stylen Sie dann die Farben und die Schaltfläche. Zu verwandten Widgets siehe die Call to Action-Widget und die Info-Box-WidgetDurchsuchen Sie das Ganze Master Addons Widgets und Erweiterungen, und sehen Sie sich die an Widget-Seite der Preistabelle Für einen Step-by-Step-Build, die fünf Layouts und einen Vergleich mit der Preistabelle von Elementor Pro.
