() translation by (you can also view the original English article)
Visual Composer ist ein WordPress-Plugin, mit dem Seiten über eine Drag-and-Drop-Schnittstelle erstellt werden können. Es gibt Benutzern die Möglichkeit, Seiten einfach zu gestalten, und gibt Entwicklern die Möglichkeit, ihren WordPress-Themes einen Mehrwert hinzuzufügen. In diesem Tutorial werden die rechtlichen und technischen Auswirkungen der Integration von Visual Composer in verkaufsfertige Designs behandelt.
Visual Composer kommt mit:
- Kombinierter Front-End- und Back-End-WordPress-Editor.
- 40+ eingebaute Content-Elemente, die sofort verfügbar sind und über 200 Add-Ons, um Ihre Website auf das nächste Level zu bringen.
- Vorlagenbibliothek, die WordPress-Benutzern Zugang zu Hunderten von hochwertigen Layoutvorlagen bietet.
- Skin Builder zum schnellen Ändern der visuellen Erscheinung des Themas.
- Erweiterter Grid Builder für Posts, Portfolios, Medien und benutzerdefinierte Post-Typen.
Das sind die Hauptmerkmale von Visual Composer, alles inklusive professioneller Unterstützung für 34 US-Dollar (reguläre Lizenz ab Dezember 2016).
Visual Composer für Theme-Entwickler
Lassen Sie uns einen Moment darüber nachdenken, warum Theme-Entwickler Visual Composer integrieren oder erweitern sollten und welche Lizenzimplikationen dafür zur Verfügung stehen.
WordPress-Themes zu verkaufen kann ein lukratives Geschäft sein, egal ob Sie einzeln oder über einen Marktplatz wie ThemeForest verkaufen. Als Themenautoren (Ninzio Themes) verstehen wir die Belohnungen, wissen aber, wie schwierig die Themenentwicklung sein kann und was jeder Entwickler von seinem Produkt erwartet:
- Reduzierte Entwicklungszeit und Kosten
- Ein qualitativ hochwertiges Produkt.
- Maximiertes Einkommen aus Verkäufen
- Reduzierte Supportzeit
- Konzentrieren Sie sich auf neue Funktionen und Marketing
Und weisst du was? Visual Composer kann Ihnen dabei helfen, diese Ziele direkt oder indirekt zu erreichen. Lass mich erklären wie:
Viele WordPress-Themes verfügen über integrierte Page Builder, und ihre Erstellung wurde in den vergangenen Jahren zu einem Trend, aber heutzutage, mit zunehmendem Wettbewerb, ist es äußerst nachteilig in Bezug auf Kosten und Zeit, eine maßgeschneiderte Lösung für Ihr Thema zu entwickeln. Stattdessen kann Visual Composer in Ihr Design integriert und Ihren Käufern kostenlos angeboten werden (nur für die Verwendung mit Ihrem Design).
Wenn Sie die Top WordPress-Themes von Themeforest durchsuchen, werden Sie feststellen, dass in fast jedem Thema Visual Composer integriert ist, sogar in Themes, die ihren eigenen integrierten Seitengenerator haben. Visual Composer ist ein bekanntes Produkt, das tausende Male von Millionen von Benutzern und Entwicklern getestet wurde.
An dieser Stelle haben wir deutlich gemacht, warum Visual Composer (fast) benötigtes Wissen für erfolgreiche WordPress-Theme-Entwickler geworden ist und warum Sie es in Ihre Themen integrieren sollten.
Die nächsten Fragen lauten: Wie integrieren wir Visual Composer und haben wir das Recht dazu?
Thema Integration: Legal Guide
Wenn Sie ein Theme-Entwickler sind, der denkt, Visual Composer in Ihre Designs aufzunehmen, finden Sie hier eine kurze Zusammenfassung dessen, was benötigt wird:
"Am 22. Januar 2013 hat Envato ihre Lizenzen aktualisiert und es ist nicht mehr möglich, Artikel von Marktplätzen innerhalb Ihrer eigenen Artikel, die auf Envato Marktplätzen zum Verkauf stehen, zu verwenden, ohne eine Partnerschaftsvereinbarung zwischen zwei Autoren. In diesem Fall zwischen mir (Michael M) und dir (Themenautor). "- Michael M
Also ... wenn Sie Visual Composer in Ihr Thema aufnehmen wollen, müssen Sie an Michael schreiben? Zum Glück, nein. Dieser Prozess wurde automatisiert. Lassen Sie uns Schritt für Schritt prüfen, wie wir Visual Composer korrekt lizenzieren können.
Erwerben Sie die erweiterte Lizenz
Zuerst müssen Sie die erweiterte Lizenz von Visual Composer von CodeCanyon kaufen. Zum Zeitpunkt des Schreibens beträgt der Preis für eine erweiterte Lizenz 170 US-Dollar.
Was ist eine "Erweiterte Lizenz"?
Die erweiterte Lizenz erlaubt die Nutzung des Plugins durch Sie oder einen Kunden in einem einzigen Produkt, für das die Endbenutzer Gebühren erheben können. Der Gesamtpreis beinhaltet den Artikelpreis und eine Käufergebühr.
Im Wesentlichen erwerben Sie eine Entwicklerlizenz, um Visual Composer mit einem Ihrer Designs zu verwenden. Kunden, die dieses Thema kaufen, müssen die reguläre Lizenz von Visual Composer nicht erwerben.
Was deckt es nicht?
Sie können keine erweiterte Lizenz für mehrere Designs verwenden, und Sie können Ihre erweiterte Lizenz auch nicht mit anderen teilen. Sie müssen den Lizenzschlüssel nicht mit Ihren Kunden teilen, und Ihre Kunden müssen Visual Composer (die mit Ihrem Design mitgelieferte Kopie) nicht aktivieren.
Was ist mit Visual Composer-Aktualisierungen?
Eine der häufigsten Fragen, die wir bei Ninzio Themes hören, ist: "Ich kann Visual Composer nicht aktualisieren". Dies geschieht nicht vom Client aus; Jedes Visual Composer-Update sollte getestet und in Theme-Updates enthalten sein.
Die "Lagerlizenz"
Aber Moment mal - WPBakery sagt: "Es ist nicht länger möglich, Artikel von Marktplätzen innerhalb Ihrer eigenen Artikel zu verwenden, die auf Envato Marktplätzen zum Verkauf stehen." Wie können Sie Visual Composer in Ihre Theme zum Verkauf auf ThemeForest aufnehmen, wenn Ihre erweiterte Lizenz das nicht zulässt? Hier kommt die besondere "Vereinbarung" zwischen Ihnen und Michael M (Visual Composer Plugin Author) ins Spiel: die "Stock-License".
Sobald Sie die erweiterte Lizenz von CodeCanyon erworben haben, gehen Sie zum WPBakery-Support-Portal und melden Sie sich mit Ihrem Envato-Login an.
Eine Popup-Nachricht mit Authorize WPBakery Support Portal, um eine Verbindung zu Ihrem Konto herzustellen? wird auftauchen; Klicken Sie auf Genehmigen. Wenn Sie die erweiterte Lizenz bereits erworben haben, zeigt WPBakery Ihre neu erworbene Lizenz automatisch im Dashboard an. Wählen Sie die Lizenz aus, geben Sie den Namen des Designs ein und klicken Sie auf Senden. Ihre erweiterte Lizenz wird zu einer "Vor-Ort-Lizenz". ThemeForest weiß, WPbakery weiß, weißt du - alles ist lizenziert, also kannst du den Visual Composer in dein Theme aufnehmen und das Theme auf ThemeForest verkaufen.
An diesem Punkt haben wir uns mit den rechtlichen Aspekten der Visual Composer-Integration beschäftigt. Nun ist es an der Zeit, die technische Seite zu untersuchen.
Theme Integration: Technisches Handbuch
Die Integration von Visual Composer in Ihr Design ist nicht besonders aufwendig. Wir erklären den Prozess anhand eines unserer Themen, Focuson, als Beispiel.
Erstellen Sie die erforderliche Umgebung
Wir brauchen folgende Dinge:
- Eine PHP-Datei mit benutzerdefinierten Elementen (Ihre Themen-Shortcodes). In unserem Fall heißt das "shortcodes.php", welches sich im "ninzio-addons" Plugin befindet (ein Plugin mit themenspezifischer Funktionalität). "Shortcodes.php" ist verantwortlich für die endgültige Ausgabe von Shortcodes. Eine Anleitung zum Erstellen von WordPress Shortcodes finden Sie in Rohan Mehtas Tutorial Erste Schritte mit WordPress Shortcodes.
- Eine PHP-Datei, um den Visual Composer zu integrieren. Diese Datei enthält die benutzerdefinierten Elementoptionen, die im Menü des Visual Composer-Dashboards angezeigt werden. In unserem Fall heißt das "ninzio_vc.php" und befindet sich im Themenordner > enthält.
- Ein Visual Composer-Vorlagenordner, der PHP-Dateien der Standardelemente von Visual Composer enthält, falls Sie diese überschreiben müssen. Dieser Ordner muss den Namen "vc_templates" haben, und alle Dateien, die sich in diesem Ordner befinden, sollten genauso benannt werden wie die im Visual Composer "vc_templates" -Ordner. In unserem Fall haben wir vier Dateien, die mit eigener Struktur und Funktionalität erweitert wurden: "vc_column.php", "vc_column_text.php", "vc_row.php" und "vc_video.php". Der Ordner "vc_templates" sollte direkt in den Themenordner theme des Themenstammverzeichnisses > vc_templates eingefügt werden.
Da Visual Composer ein externes Plug-in ist, müssen wir es mit dem Theme-Download-Pack verbinden. Hier haben wir zwei Möglichkeiten:
- Fügen Sie die Datei "js_composer.zip" in das Download-Pack ein und bitten Sie Ihre Käufer, sie manuell zu installieren.
- Verwenden Sie den TGM Plugin Activator, um diesen Prozess zu automatisieren.
Wir finden, dass die zweite Option der beste Weg ist, Plugins für WordPress-Themes anzufordern und zu empfehlen. Um dies zu tun, erstellen Sie einen Ordner "plugins" in Ihrem Thema Stammordner und legen Sie die "js_composer.zip" -Datei (die Visual Composer installierbare Datei, die Sie nach dem Kauf heruntergeladen haben) in sie. Um mehr über den TGM Plugin Activator zu erfahren, werfen Sie einen Blick auf Barış Ünvers Tutorial Verwenden der TGM Plugin-Aktivierungsbibliothek in Ihren Designs.
WordPress Theme Check
WordPress Theme Check gefällt es nicht, wenn ein Theme gepackte Plugins enthält. Es wird eine Warnung geben wie:
REQUIRED: Zip file found. Plugins are not allowed in themes. The zip file found was js_composer.zip
Leider gibt es für diese Situation keine offiziellen Anweisungen. Da der Plugin-Ordner auf Ihrem Server gegen Envato-Lizenz-Plugins in Themes - Theme Check Issue läuft, gibt es keinen besseren Weg, das Plugin mit dem Theme zu versehen.
Komm zu Atem
Also, für jetzt haben wir ...
- ... inklusive js_composer.zip im Theme (fucoson > plugins > js_composer.zip)...
- erstellt die benutzerdefinierten Elemente PHP-Datei (ninzio-addons > shortcodes > shortcodes.php). Denken Sie daran, wir haben das Plugin ninzio-addons mit allen benutzerdefinierten Funktionen und es kommt mit dem Thema.
- ... erstellte die Visual Composer-Integrationsdatei (focuson > includes > ninzio_vc.php)
- ... und den Ordner "vc_templates" erstellt, der Standard-Visual-Composer-Elemente enthält, die mit benutzerdefinierten Funktionen erweitert werden können.
Einschließlich erforderlicher Komponenten
Jetzt schließen wir die Integration ab, indem wir die erforderlichen Komponenten einbeziehen. Öffnen Sie die Datei "functions.php" und fügen Sie mit dem TGM Plugin Activator Visual Composer der Liste der benötigten Plugins hinzu:
1 |
$plugins = array( |
2 |
|
3 |
array( |
4 |
'name' => esc_html__('WPBakery Visual Composer', 'focuson'), |
5 |
'slug' => 'js_composer', |
6 |
'source' => get_template_directory() . '/plugins/js_composer.zip', |
7 |
'required' => true, |
8 |
'force_activation' => false, |
9 |
'force_deactivation' => false, |
10 |
'external_url' => '' |
11 |
)
|
12 |
|
13 |
);
|
Fügen Sie nun die Datei shortcodes.php hinzu. Wie beim Focuson-Thema befindet sich diese Datei innerhalb des "ninzio-addons" -Plugins, sie ist bereits enthalten, wenn das ninzio-addons-Plugin installiert ist.
Als nächstes fügen Sie die Integrationsdatei "ninzio_vc.php" hinzu. Dieser Teil ist sehr wichtig, da wir sicherstellen müssen, dass die installierbare Visual Composer-Datei "js_composer.zip" im Plugins-Ordner liegt und das Visual Composer Plugin erfolgreich installiert und aktiv ist:
1 |
if (defined( 'WPB_VC_VERSION' ) && file_exists( get_template_directory() . '/plugins/js_composer.zip' ) ) { |
2 |
require_once(get_template_directory() . '/includes/ninzio_vc.php' ); |
3 |
}
|
Erst danach benötigen wir die Integrationsdatei "ninzio_vc.php".
1 |
require_once(get_template_directory() . '/includes/ninzio_vc.php' ); |
Fazit
Das ist es! Visual Composer ist in unser Thema integriert und wir haben alles, was es braucht, um es zu erweitern. Im nächsten Tutorial sehen wir uns das Erweitern und Erstellen mit Visual Composer an. Wir sehen uns dort!
