Divi-Plugin-Highlight: Divi Icons Pro

Divi Icons Pro ist ein Drittanbieter-Plugin, das dem Divi Builder über 2500 Symbole und mehrere verwandte Funktionen hinzufügt. Es wird mit mehreren Kaufoptionen geliefert und enthält sogar eine kostenlose Option mit über dreihundert benutzerdefinierten Symbolen. In diesem Divi-Plugin-Highlight werde ich mir die Pro-Edition des Plugins ansehen und sehen, was es kann.

Über Divi Icons Pro

Divi Icons Pro fügt Divi viele neue Symbolfunktionen hinzu, darunter:

• Über 2500 neue Icons
• 360 benutzerdefinierte Linienstilsymbole
• 1295 Font Awesome Icons in 74 Kategorien und jeweils 4 Stilen
• 900 Material Design Icons in 16 Kategorien und jeweils 5 Styles
• Divi Builder-Integration
• Symbolsuchfunktion in den Divi-Modulen
• Symbolfilter in den Divi-Modulen zur Auswahl nach Familie oder Eingabe des Namens des Symbols

Die Symbole werden in den Divi-Builder integriert und funktionieren genauso wie die nativen Symbole von Divi, sodass Sie sie mit jedem Divi-Modul gestalten können, das Symbole verwendet. Wie bei jedem Symbol im Divi-Builder können Sie Farbe und Größe anpassen, mit den Modulsteuerelementen festlegen, wo es angezeigt wird, und einen Kreis oder Rahmen hinzufügen.

Divi Icons Pro-Installation

Entpacken Sie die Download-Datei. Darin finden Sie das Plugin und die Anleitung. Laden Sie das Plugin wie gewohnt hoch und aktivieren Sie es.

Aktivieren Sie den API-Schlüssel, indem Sie im Dashboard-Menü zu Einstellungen > Divi Icons PRO-Aktivierung gehen . Sie können jetzt die Pro-Version des Plugins verwenden. Die Icons werden automatisch in den Divi Builder integriert, Sie müssen also nichts weiter tun, es sei denn, Sie möchten die Standardeinstellungen in den Designoptionen anpassen.

Divi Icons Pro Divi Theme-Optionen

Die Symbole sind standardmäßig aktiviert, Sie können jedoch die gewünschten Symbolfamilien aktivieren oder deaktivieren und auswählen, wie sie in die Website geladen werden. Eine neue Registerkarte Divi Icons Pro wird zu den Divi-Designoptionen hinzugefügt. Hier können Sie die Symbolfamilien auswählen, die Sie verwenden möchten. Sie können auch Font Awesome und Google Material Icon Fonts vom CDN laden.

Divi Icons Pro Icons

Die Symbole, Filter und die Suchfunktion werden automatisch zu den Divi-Modulen hinzugefügt, die Symbole verwenden. Dies sind drei Klappenmodule, die ein Symbol aus Line Style Icons, Font Awesome und Material Design Icons zeigen.

Divi Icons Pro Suche

Mit der Suchfunktion können Sie intuitive Wörter verwenden, um Ihre Symbole zu finden. Sie müssen den Namen des Symbols nicht kennen. Geben Sie einfach das zu suchende Stichwort ein und die Icons erscheinen im Icon-Auswahlbereich. Wenn Sie möchten, können Sie Ihre Suche nach Marken eingrenzen, indem Sie die Marke im Filter auswählen. Einige der Symbole wurden nicht in den Suchergebnissen angezeigt, daher ist die Suche nicht perfekt, aber sie hat gut genug funktioniert. Einige der Symbole von Font Awesome und Material Icons sind möglicherweise nicht richtig benannt.

Divi Icons Pro Filter

Sie können die Symbole filtern oder alle anzeigen. Der Filter zeigt Symbole dieser bestimmten Marke oder Familie an. Um die einzelnen Marken anzuzeigen, klicken Sie einfach auf die Schaltfläche mit dem Label der Marke, die Sie sehen möchten. Es filtert alle anderen Symbole heraus. Dieses Beispiel zeigt eine kleine Auswahl von Elegant Themes Icons.

Hier ist eine Auswahl von Linienstilsymbolen. Sie sind dünner als die anderen Symbole, sodass sie für sich alleine besser funktionieren. Ich habe sie mit den anderen ausprobiert und sie arbeiten in einigen Fällen zusammen. Es lohnt sich zu versuchen, zu sehen, was für Sie funktioniert. Die Icons sind gut gestaltet und gehören zu meinen Favoriten zwischen den Marken.

Hier ist eine kleine Auswahl von Font Awesome-Symbolen.

Hier ist eine kleine Auswahl von Material Design Icons.

Divi Icons Pro-Beispiele

In diesem Beispiel habe ich die Bilder im Resort-Layout durch Linienstilsymbole ersetzt. Ich habe sie auf Blau gesetzt und die Größe auf 48 Pixel geändert. Die Icons sehen im Layout toll aus.

In diesem habe ich die Symbolposition von oben nach links geändert. Ich habe auch die Größe auf 30px geändert und 50px Padding hinzugefügt, um jeden Klappentext zu zentrieren.

In diesem Beispiel habe ich das Social-Media-Modul in der Fußzeile durch Klappentexte ersetzt, damit ich meine eigenen Icons auswählen und sie stylen kann. All dies stammt von Font Awesome. Ich habe die Farben so eingestellt, dass sie dem Branding des Netzwerks entsprechen, die Größe auf 52px geändert und auf der rechten Seite 30px Padding hinzugefügt, um sie zu zentrieren.

Dieses Mal habe ich das Symbol in Weiß geändert und den Hintergrund zur Markenfarbe gemacht. Ich habe einen Box-Schatten hinzugefügt und einige Auffüllungen hinzugefügt, um die Symbole zu zentrieren. Ich habe auch der orangefarbenen Schaltfläche eine Auffüllung hinzugefügt, um sie zu verbreitern, damit sie der Breite der sozialen Symbole entspricht. Die Icons fügen sich gut in das Design des Layouts ein.

Dieser verwendet das Heimwerker-Layout. Ich habe die Bilder durch Klappentexte und eine Kombination von Symbolen mit verschiedenen Schriftfamilien ersetzt. Sie sind so eingestellt, dass sie links im Klappentext angezeigt werden. Die Icons sind 50px groß. Sie können in diesem Beispiel sehen, dass ich Font Awesome-Symbole nach „Farbe“ durchsucht habe.

Dies waren bereits Klappentexte mit Symbolen, also habe ich sie einfach ausgewählt, nach denselben Themen gesucht und verschiedene Symbole ausgewählt.

Dieser fügt den Symbolen einen Kreis hinzu. Ich habe den Kreis weiß gemacht, damit er dem Hintergrund des Layouts entspricht, und die Farbe des Kreises entspricht den Symbolen.

Die Symbole funktionieren mit Schaltflächen, werden jedoch im Visual Builder nicht angezeigt. Sie funktionieren gut auf der tatsächlichen Website.

Hier ist das Symbol in der Schaltfläche im Layout. Es funktioniert einfach gut.

Hier ist eine nähere Ansicht, damit Sie sehen können, wie es in der Schaltfläche aussieht.

In diesem Beispiel habe ich die Bilder im Paralegal-Layout durch Klappentexte ersetzt. Ich habe nach Icons gesucht, die zum Thema passen und mit Ausnahme des Geld-Icons Farben aus der Originalgrafik verwendet.

Für dieses Beispiel habe ich die Bilder im Butcher-Layout durch Icons ersetzt. Ich habe das Rot aus dem Titeltext verwendet und die Schriftgröße des Symbols auf 84px eingestellt.

Ich habe jedem Klappentext eine Hintergrundfarbe und einen Kastenschatten hinzugefügt. Es sieht toll aus im Layout. Ich fahre mit der Maus über den Klappentext in der Mitte, um den Schwebeeffekt zu zeigen. Es erhebt sich über die anderen und der Inhalt, einschließlich der Symbole, verschiebt sich nach rechts.

Divi Icons Pro Preis

Es gibt mehrere Kaufoptionen, je nachdem, wie viele Websites Sie mit dem Plugin verwenden möchten. Sie beinhalten 6 Monate Support und lebenslange Updates. Sie können Divi Icon Pro von der Website des Entwicklers erwerben.

• Reguläre Lizenz (1 Standort) – 25,00 €
• Erweiterte Lizenz (unbegrenzte Sites) – 65,00 €

Es gibt auch eine kostenlose Version, die die 360-Linien-Stilsymbole enthält. Es beinhaltet keinen Support oder Updates.

Divi Icon Pro-Dokumentation

Die Dokumentation ist in der Download-Datei enthalten, aber Sie können auch online darauf zugreifen. Die Dokumentation ist detailliert und führt Sie durch die Installation des Plugins und die Verwendung der Symbole und Funktionen. Es enthält auch eine FAQ und Links, um Unterstützung zu erhalten. Links umfassen die Divi-Communitys in sozialen Medien und Ihr Konto mit einem Link zum Erstellen eines Support-Tickets.

Gedanken beenden

Icon-Plugins sind der einfachste Weg, dem Divi Builder neue Icons hinzuzufügen, und Divi Icons Pro ist so einfach wie es nur geht. Es enthält viele Symbole und Sie können die spezifischen Symbolmarken aktivieren oder deaktivieren, um mehr Kontrolle darüber zu haben, was in den Modulen angezeigt wird. Mir gefallen die Filter- und Suchfunktionen. Ich konnte für jedes Thema, mit dem ich gearbeitet habe, ein Symbol finden.

Die einzigen Probleme, die ich hatte, waren die Symbole, die bei der Verwendung des Visual Builder nicht in den Schaltflächen angezeigt werden wollten, aber im Classic Builder funktionierte es großartig und sie werden auf der Website problemlos angezeigt. Einige der Icons tauchten nicht in den Suchergebnissen auf, aber ich denke, das ist eher eine Frage der Benennung der Icons durch die Icon-Entwickler. Diese Probleme sind geringfügig und hindern mich nicht daran, das Plugin zu verwenden oder zu empfehlen.

Divi Icons Pro ist einfach zu bedienen und fügt praktisch ohne Aufwand eine Menge neuer Symbole hinzu. Wenn Sie dem Divi-Builder weitere Symbole hinzufügen möchten, ist Divi Icons Pro ein Blickfang.

Wir wollen von dir hören. Haben Sie Divi Icon Pro ausprobiert? Lassen Sie uns in den Kommentaren wissen, was Sie davon halten.

Ausgewähltes Bild über VectorsMarket / shutterstock.com