Visual Composer integreren in uw WordPress-thema's

Visual Composer is WordPress plug-in waarmee pagina's kunnen worden opgebouwd met behulp van een drag-and-drop interface. Het geeft gebruikers de mogelijkheid om pagina's gemakkelijk in te delen en geeft ontwikkelaars de mogelijkheid om waarde toe te voegen aan hun WordPress-thema's. In deze tutorial zullen we kijken naar de juridische en technische implicaties van de integratie van Visual Composer in thema's, klaar voor verkoop.

Visual Composer wordt geleverd met:

• Gecombineerde WordPress-editor in front-end en back-end.
• 40+ ingebouwde inhoudselementen die kant-en-klaar beschikbaar zijn en meer dan 200 add-ons, ontworpen om uw website naar een hoger niveau te tillen.
• Sjabloonbibliotheek waarmee WordPress-gebruikers toegang hebben tot honderden lay-outsjablonen van hoge kwaliteit.
• Skin Builder voor het snel veranderen van de visuele verschijning van het thema.
• Geavanceerde rasterbouwer voor berichten, portfolio, media en aangepaste berichttypen.

Dit zijn dus de belangrijkste kenmerken van Visual Composer, allemaal ingepakt, inclusief professionele ondersteuning voor $ 34 (reguliere licentie vanaf december 2016). 

Visual Composer voor thema-ontwikkelaars

Laten we even nadenken over waarom thema-ontwikkelaars Visual Composer moeten integreren of uitbreiden, en wat de implicaties van de licentie zijn om dit te doen.

Het verkopen van WordPress-thema's kan een lucratieve business zijn, of je nu individueel verkoopt of via een marktplaats als ThemeForest. Als thema-auteurs (Ninzio Themes) begrijpen we de beloningen, maar weten hoe moeilijk de thema-ontwikkeling kan zijn, en wat elke ontwikkelaar van zijn of haar product wil:

• Minder ontwikkelingstijd en -kosten.
• Een product van hoge kwaliteit.
• Gemaximaliseerde inkomsten uit verkoop
• Minder ondersteuningstijd
• Focus op nieuwe functies en marketing
  

En weet je wat? Visual Composer kan u helpen deze doelen direct of indirect te bereiken. Laat me uitleggen hoe:

Veel WordPress-thema's hebben ingebouwde paginabuilders, en het bouwen ervan werd een trend in voorgaande jaren, maar tegenwoordig is het met de toegenomen concurrentie uiterst nadelig in termen van kosten en tijd om een ​​aangepaste oplossing voor uw thema te ontwikkelen. In plaats daarvan kan Visual Composer worden geïntegreerd in uw thema en gratis worden aangeboden aan uw kopers (gratis te gebruiken met alleen uw thema).

Als je door de beste WordPress-thema's van Themeforest bladert, zul je merken dat vrijwel elk thema Visual Composer erin geïntegreerd heeft, zelfs thema's met een eigen ingebouwde ingebouwde paginabuilder. Visual Composer is een bekend product dat duizenden keren is getest door miljoenen gebruikers en ontwikkelaars. 

Top WordPress-thema's op Themeforest

Op dit punt hebben we duidelijk gemaakt waarom Visual Composer (bijna) vereiste kennis is geworden voor succesvolle WordPress-thema-ontwikkelaars, en waarom je zou moeten overwegen om het te integreren in je thema's.

De volgende vragen zijn: hoe integreren we Visual Composer en hebben we het recht om dit te doen?

Thema-integratie: juridische gids

Als u een themaontwikkelaar bent die erover nadenkt om Visual Composer in uw thema's op te nemen, vindt u hier een korte samenvatting van wat nodig is:

"Op 22 januari 2013 heeft Envato hun licenties bijgewerkt en het is niet langer mogelijk om items van marktplaatsen in uw eigen items te gebruiken die te koop zijn op Envato-markten, zonder een samenwerkingsovereenkomst tussen twee auteurs. In dit geval tussen mij (Michael M) en jij (auteur van het thema). "- Michael M

Dus ... als u Visual Composer in uw thema wilt opnemen, moet u Michael schrijven? Gelukkig, nee. Dit proces is geautomatiseerd. Laten we stap voor stap bekijken hoe we Visual Composer correct kunnen licentiëren.

Koop Uitgebreide Licentie

Eerst moet u de uitgebreide licentie van Visual Composer van CodeCanyon kopen. Vanaf het moment van schrijven is de prijs voor een verlengde licentie $ 170.

De uitgebreide licentie van Visual Composer van CodeCanyon

Wat is een "Uitgebreide licentie"?

De uitgebreide licentie staat gebruik van de plug-in toe, door u of een klant, in één enkel product waarvoor eindgebruikers in rekening kunnen worden gebracht. De totale prijs is inclusief de artikelprijs en een kopersvergoeding.

In wezen koopt u een ontwikkelaarslicentie om Visual Composer te gebruiken met een van uw thema's. Cliënten die dit thema kopen, hoeven de standaardlicentie van Visual Composer niet aan te schaffen. 

Wat dekt het niet?

U kunt niet één uitgebreide licentie gebruiken voor meerdere thema's, evenmin kunt u uw uitgebreide licentie delen met iemand anders. U hoeft de licentiesleutel niet te delen met uw klanten en uw klanten hoeven Visual Composer (de kopie die bij uw thema wordt geleverd) niet te activeren. 

Hoe zit het met Visual Composer-updates? 

Een van de meest voorkomende vragen die we bij Ninzio Themes horen is: "Ik kan Visual Composer niet bijwerken". Dit gebeurt niet vanaf het client-einde; elke Visual Composer-update moet worden getest en opgenomen in thema-updates.

De "In-licentie"

Maar wacht even - WPBakery zegt: "het is niet langer mogelijk om items van marktplaatsen te gebruiken in uw eigen items die te koop zullen zijn op Envato-marktplaatsen". Dus hoe kunt u Visual Composer opnemen in uw thema's te koop op ThemeForest als uw uitgebreide licentie dat niet toestaat? Dit is waar de speciale "overeenkomst" tussen u en Michael M (Visual Composer Plugin Author) in het spel komt: de "In-licentie".

Nadat u de uitgebreide licentie van CodeCanyon hebt gekocht, gaat u naar de WPBakery-ondersteuningsportal en logt u in met uw Envato-login.

WPBakery-inlogscherm

Een pop-upbericht met Autoriseer WPBakery Support Portal om verbinding te maken met uw account? zal verschijnen; Klik Goedkeuren. Als u vervolgens de uitgebreide licentie hebt gekocht, toont WPBakery automatisch uw nieuw aangeschafte licentie in het dashboard, dus selecteer de licentie, voer de naam van het thema in en druk op voorleggen. Uw uitgebreide licentie verandert in een "In-Stock-licentie". ThemeForest weet het, WPbakery weet het, weet je - alles is gelicentieerd, dus je kunt de Visual Composer opnemen in je thema en het thema verkopen op ThemeForest.

Op dit moment zijn we klaar met het bekijken van de juridische aspecten van Visual Composer-integratie, nu is het tijd om de technische kant te onderzoeken.

Thema-integratie: technische handleiding

Er is niet veel te doen met de integratie van Visual Composer met uw thema. We zullen het proces uitleggen met een van onze thema's, Focuson, als een voorbeeld.

Focus op

Creëer Vereiste Omgeving

We hebben de volgende dingen nodig:

1. Een php-bestand met aangepaste elementen (uw thema-shortcodes). In ons geval wordt dit "shortcodes.php" genoemd, dat zich bevindt in de plug-in "ninzio-addons" (een plug-in met aangepaste thema-functionaliteit). "Shortcodes.php" is verantwoordelijk voor de uiteindelijke uitvoer van shortcodes. Voor een handleiding over het maken van WordPress-shortcodes, bekijk Rohan Mehta's tutorial Aan de slag met WordPress Shortcodes.
2. Een php-bestand om de Visual Composer te integreren. Dit bestand bevat uw aangepaste elementopties die worden weergegeven in het dashboard van Visual Composer. In ons geval wordt dit "ninzio_vc.php" genoemd en bevindt het zich in themamap> bevat.
3. Een map met Visual Composer-sjablonen, die php-bestanden van de standaardelementen van Visual Composer bevat, voor het geval u ze moet overschrijven. Deze map moet de naam "vc_templates" hebben en alle bestanden in die map moeten exact dezelfde naam hebben als die in de map "vc_templates" van Visual Composer. In ons geval hebben we vier bestanden die worden uitgebreid met aangepaste structuur en functionaliteit: "vc_column.php", "vc_column_text.php", "vc_row.php" en "vc_video.php". De map "vc_templates" moet rechtstreeks in de hoofdmap van het thema worden geplaatst themamap> vc_templates.

Als laatste, maar daarom niet minder belangrijk, omdat Visual Composer een externe plug-in is, moeten we het opnemen in het themadownloadpakket. Hier hebben we twee opties: 

1. Neem het bestand "js_composer.zip" op in het downloadpakket en vraag uw kopers om het handmatig te installeren.
2. Gebruik de TGM Plugin Activator om dit proces te automatiseren. 

We vinden dat de tweede optie de beste manier is om plug-ins voor WordPress-thema's te vereisen en aan te bevelen. Hiertoe maakt u een map "plug-ins" in uw themawortelmap en plaatst u daarin het bestand "js_composer.zip" (het installeerbare bestand Visual Composer dat u na de aankoop hebt gedownload). Voor meer informatie over de TGM-plugin-activator, bekijkt u de handleiding van Barış Ünver De activeringsbibliotheek TGM-plug-in gebruiken in uw thema's. 

WordPress Theme Check

WordPress Theme Check vindt het niet leuk als een thema over ingesloten plug-ins beschikt. Het zal een waarschuwing geven zoals:

VERPLICHT: Zip-bestand gevonden. Plug-ins zijn niet toegestaan ​​in thema's. Het gevonden zipbestand was js_composer.zip

Helaas zijn er voor deze situatie geen officiële instructies. Zoals inclusief de plugin-map op uw server gaat tegen Envato-licentie Plugins in Thema's - Themacontroleprobleem er is geen andere betere manier om de plug-in met het thema op te nemen.

Op adem komen

Dus, voor nu hebben we ...

1. ... inclusief js_composer.zip in het thema (fucoson> plug-ins> js_composer.zip)
2. ... het PHP-bestand met aangepaste elementen gemaakt (ninzio-addons> shortcodes> shortcodes.php). Vergeet niet dat we de ninzio-addons-plug-in hebben met alle aangepaste functies en het wordt geleverd met het thema.
3. ... het integratiebestand Visual Composer gemaakt (focuson> omvat> ninzio_vc.php)
4. ... en de map "vc_templates" gemaakt die standaardelementen van Visual Composer bevat voor uitbreiding met aangepaste functionaliteit.

Inclusief vereiste componenten

Laten we nu de integratie voltooien door de vereiste componenten op te nemen. Open uw thema "functions.php" bestand en voeg met TGM Plugin Activator Visual Composer toe aan de lijst met vereiste plug-ins:

 $ plugins = array (array ('naam' => esc_html __ ('WPBakery Visual Composer', 'focuson'), 'slug' => 'js_composer', 'source' => get_template_directory (). '/plugins/js_composer.zip ',' required '=> true,' force_activation '=> false,' force_deactivation '=> false,' external_url '=> "));

Voeg nu het bestand "shortcodes.php" toe. Net als in het geval van het Focuson-thema bevindt dit bestand zich in de plug-in "ninzio-addons", het is al opgenomen wanneer de ninzio-addons-plug-in is geïnstalleerd.

Voeg vervolgens het integratiebestand "ninzio_vc.php" toe. Dit onderdeel is erg belangrijk, omdat we er zeker van moeten zijn dat het installeerbare bestand "js_composer.zip" van Visual Composer zich in de map plugins bevindt en de plug-in Visual Composer correct is geïnstalleerd en actief is:

if (defined ('WPB_VC_VERSION') && file_exists (get_template_directory (). '/plugins/js_composer.zip')) require_once (get_template_directory (). '/includes/ninzio_vc.php'); 

Pas daarna hebben we het integratiebestand "ninzio_vc.php" nodig.

require_once (get_template_directory (). '/includes/ninzio_vc.php');

Conclusie

Dat is het! Visual Composer is geïntegreerd in ons thema en we hebben alles wat nodig is om het uit te breiden. In de volgende tutorial zullen we kijken naar het uitbreiden en bouwen met Visual Composer. Zie je daar!