Så här integrerar du Visual Composer i dina WordPress-teman

Visual Composer är WordPress plugin som tillåter sidor att byggas med hjälp av ett dra-och-släpp-gränssnitt. Det ger användarna möjlighet att layoutsides enkelt, och det ger utvecklare möjlighet att lägga till värde för sina WordPress-teman. I denna handledning ser vi på de juridiska och tekniska konsekvenserna av att integrera Visual Composer i teman, redo för försäljning.

Visual Composer kommer med:

  • Kombinerad front-end och back-end WordPress editor.
  • 40+ inbyggda innehållsdelar tillgängliga ut ur lådan och 200 + tillägg, utformade för att ta din webbplats till nästa nivå.
  • Mallbiblioteket ger WordPress-användare tillgång till hundratals layoutmallar av hög kvalitet.
  • Hudbyggare för att snabbt ändra tematets visuella utseende.
  • Avancerad nätverksbyggare för inlägg, portfölj, media och anpassade posttyper.

Så det är huvudfunktionerna i Visual Composer, alla invecklade, inklusive professionellt stöd för $ 34 (vanlig licens från december 2016). 

Visual Composer för temautvecklare

Låt oss tänka en stund om varför temutvecklare ska integrera eller utöka Visual Composer, och vad licensimplikationerna är för att göra det.

Sälja WordPress Teman kan vara ett lukrativt företag, oavsett om du säljer individuellt eller via en marknadsplats som ThemeForest. Som temaförfattare (Ninzio Themes) förstår vi belöningarna, men vet hur svårt temat utveckling kan vara och vad varje utvecklare vill ha från sin produkt:

  • Minskad utvecklingstid och kostnad.
  • En högkvalitativ produkt.
  • Maximerad inkomst från försäljning
  • Minskad stödtid
  • Fokusera på nya funktioner och marknadsföring

Och vet du vad? Visual Composer kan hjälpa dig att uppnå dessa mål direkt eller indirekt. Låt mig förklara hur:

Många WordPress-teman har inbyggda sidbyggare och byggandet av dem blev en trend under tidigare år, men nuförtiden är det med ökad konkurrens extremt ofördelaktigt när det gäller kostnader och tid för att utveckla en anpassad lösning för ditt tema. Istället kan Visual Composer integreras i ditt tema, och erbjuds gratis till dina köpare (gratis att använda med ditt tema).

Om du bläddra bland Themeforests bästa WordPress-teman kommer du märka att nästan alla teman har Visual Composer integrerad i den, även teman som har en egen inbyggd sidobyggare. Visual Composer är en välkänd produkt som testats tusentals gånger av fler miljoner användare och utvecklare. 

Top WordPress-teman på Themeforest

Vid denna tidpunkt har vi klargjort varför Visual Composer har blivit (nästan) nödvändig kunskap för framgångsrika WordPress-temutvecklare, och varför bör du överväga att integrera den i dina teman.

Nästa fråga är: hur integrerar vi Visual Composer, och har vi rätt att göra det?

Tema Integration: Legal Guide

Om du är en temautvecklare som tänker på att inkludera Visual Composer i dina teman, här är en snabb sammanfattning av vad som behövs:

"Den 22 januari 2013 uppdaterade Envato sina licenser och det är inte längre möjligt att använda varor från marknadsplatser inom egna objekt som kommer att säljas på Envato-marknadsplatser utan partnerskapsavtal mellan två författare. I det här fallet mellan mig (Michael M) och dig (temaförfattare). "- Michael M

Så ... om du vill inkludera Visual Composer i ditt tema måste du skriva till Michael? Lyckligtvis nej. Denna process har automatiserats. Låt oss undersöka, steg för steg, hur vi rätt kan licensiera Visual Composer.

Köp Utökad Licens

Först måste du köpa Visual Composers utökad licens från CodeCanyon. Från tidpunkten för skrivandet är priset för en förlängd licens $ 170.

Visual Composers utökad licens från CodeCanyon

Vad är en "Extended License"?

Den förlängda licensen tillåter användning av plugin, av dig eller en klient, i en enda produkt som slutanvändare kan debiteras för. Det totala priset inkluderar varupriset och en inköpsavgift.

I huvudsak köper du en utvecklarlicens för att använda Visual Composer med en av dina teman. Kunder som köper det temat behöver inte köpa Visual Composers regelbundna licens. 

Vad täcker det inte?

Du kan inte använda en förlängd licens för flera teman, inte heller kan du dela din utökad licens med någon annan. Du behöver inte dela licensnyckeln med dina kunder, och dina kunder behöver inte aktivera Visual Composer (kopian som följer med ditt tema). 

Vad om Visual Composer-uppdateringar? 

En av de vanligaste frågorna vi hör på Ninzio Themes är: "Jag kan inte uppdatera Visual Composer". Detta görs inte från klientänden; varje Visual Composer-uppdatering ska testas och inkluderas i teman uppdateringar.

"In-stock-licensen"

Men vänta en stund - WPBakery säger att "det är inte längre möjligt att använda varor från marknadsplatser inom dina egna föremål som kommer att säljas på Envato-marknadsplatser". Så hur kan du inkludera Visual Composer i dina teman till salu på ThemeForest om din förlängda licens inte tillåter det? Här är det speciella "avtalet" mellan dig och Michael M (Visual Composer Plugin Author) som spelar in: "In-stock License".

När du har köpt den utökade licensen från CodeCanyon, gå till supportportalen för WPBakery och logga in med din Envato-inloggning.

WPBakery inloggningsskärm

Ett popupmeddelande med Godkänn WPBakery Support Portal för att ansluta till ditt konto? Kommer komma; klick Godkänna. Därefter, om du redan har köpt det utökade licensen, visar WPBakery automatiskt din nyinköpta licens i instrumentpanelen, så välj licensen, skriv in temanamnet och tryck på Lämna. Din förlängda licens blir till en "In-Stock License". ThemeForest vet att WPbakery vet att du vet att allt är licensierat så att du kan inkludera Visual Composer i ditt tema och sälja temat på ThemeForest.

Vid denna tidpunkt har vi tittat på de juridiska aspekterna av Visual Composer integration, nu är det dags att undersöka den tekniska sidan.

Tema Integration: Teknisk Guide

Det är inte för mycket involverat att integrera Visual Composer med ditt tema. Vi kommer att förklara processen genom att använda en av våra teman, Focuson, som ett exempel.

Fokusera på

Skapa nödvändig miljö

Vi behöver följande saker:

  1. En php-fil med anpassade element (dina temakortkoder). I vårt fall kallas det "shortcodes.php" som finns i pluginprogrammet "ninzio-addons" (ett plugin med temat anpassad funktionalitet). "Shortcodes.php" är ansvarig för den slutliga utmatningen av kortnummer. För en guide om hur man skapar WordPress-kortkoder, ta en titt på Rohan Mehtas handledning Komma igång med WordPress-kortkoder.
  2. En php-fil för att integrera Visual Composer. Den här filen innehåller dina anpassade elementalternativ, som visas i Visual Composer-instrumentpanelen. I vårt fall kallas detta "ninzio_vc.php" och ligger i temmapp> innehåller.
  3. En mapp för Visual Composer-mallar, som innehåller php-filer i Visual Composers standardelement, om du behöver skriva över dem. Den här mappen måste kallas "vc_templates", och alla filer som finns i den mappen ska namngöras exakt som de i vc_templates-mappen Visual Composer. I vårt fall har vi fyra filer som utökas med anpassad struktur och funktionalitet: "vc_column.php", "vc_column_text.php", "vc_row.php" och "vc_video.php". "Vc_templates" -mappen ska sättas direkt inuti din temrotsmapp temmapp> vc_templates.

Sist men inte minst, eftersom Visual Composer är ett externt plugin, måste vi inkludera det med temat nedladdningspaket. Här har vi två alternativ: 

  1. Inkludera filen "js_composer.zip" i nedladdningspaketet och fråga dina köpare om att installera det manuellt.
  2. Använd TGM Plugin Activator för att automatisera denna process. 

Vi finner det andra alternativet är det bästa sättet att kräva och rekommendera plugins för WordPress-teman. För att skapa detta skapar du en mapp "plugins" inuti din temrotormapp och lägger filen "js_composer.zip" (den installerbara filen Visual Composer, som du har laddat ner efter inköpet) i den. För att lära dig mer om TGM Plugin Activator, ta en titt på Barış Ünvers handledning Använda TGM Plugin Activation Library i dina teman. 

WordPress Theme Check

WordPress Theme Check tycker inte om det när ett tema innehåller packade plugins. Det kommer att ge en varning som:

KRAV: Zip-fil hittades. Plugins är inte tillåtna i teman. Den zip-fil som hittades var js_composer.zip

Tyvärr är det för denna situation inga officiella instruktioner. Eftersom det inkluderar plugin-mappen på din server går emot Envato-licensinställningar i teman - temakontrollutgåva finns det inget annat bättre sätt att inkludera plugin med temat.

Hämta andan

Så för närvarande har vi ...

  1. ... ingår js_composer.zip inuti temat (fucoson> plugins> js_composer.zip)
  2. ... skapade anpassade element php-filen (ninzio-addons> kortnummer> shortcodes.php). Kom ihåg att vi har plugin med ninzio-addons med all anpassad funktionalitet i den, och det kommer med temat.
  3. ... skapade Visual Composer-integrationsfilen (focuson> innehåller> ninzio_vc.php)
  4. ... och skapade mappen "vc_templates" som innehåller standard Visual Composer-element för att utöka med anpassad funktionalitet.

Inklusive nödvändiga komponenter

Låt oss nu slutföra integrationen genom att inkludera de nödvändiga komponenterna. Öppna ditt tema "functions.php" -fil och, med TGM Plugin Activator, lägg till Visual Composer i listan med nödvändiga plugins:

 $ plugins = array ('name' => 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 '=> "));

Nu innehåller filen "shortcodes.php". Som i fallet med Focuson-temat är den här filen placerad i plugin-programmet "ninzio-addons", det ingår redan när pluginet för ninzio-addons är installerat.

Följ sedan integrationsfilen "ninzio_vc.php". Den här delen är väldigt viktig, eftersom vi måste vara säkra på att den installerbara filen "js_composer.zip" är inuti plugin-mappen och pluginprogrammet Visual Composer är installerat och aktivt:

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

Först efter det behöver vi integrationsfilen "ninzio_vc.php".

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

Slutsats

Det är allt! Visual Composer är integrerad med vårt tema och vi har allt som krävs för att utöka det. I nästa handledning ser vi på att utvidga och bygga med Visual Composer. Vi ses där!