Unlimited Wordpress themes, plugins, graphics & courses! Unlimited asset downloads! From $16.50/m
Advertisement
  1. Web Design
  2. Theme Development
Webdesign

Paano Isama ang Visual Composer sa Iyong WordPress Themes

by
Difficulty:IntermediateLength:LongLanguages:

Tagalog (Wikang Tagalog) translation by Robert Alexander (you can also view the original English article)

Visual Composer ay WordPress plugin kung saan magagawa ang mga pahina gamit ang drag-and-drop na interface. Nabibigyan nito ang mga gumagamit ng kakayahan para ma-layout ng mabilis ang mga pahina, at nagbibigay daan din ito sa mga gumagawa ng pagkakataon na madagdagan ng halaga ang kanilang WordPress themes. Sa pagtuturo na ito titingnan natin ang legal at teknikal na implikasyon ng pagsama ng Visual Composer sa themes, handa para mabenta.

Ang Visual Composer ay mayroong:

  • Pinagsamang front-end at back-end WordPress editor.
  • 40+ na nakakabit na content elements na kakaiba at 200+ na add-ons, na naka-desenyo para ilagay sa sunod na antas ang iyong website.
  • Template library na nagbibigay sa mga gumagamit ng WordPresss ng access sa daan-daang mataas na kalidad na layout templates.
  • Skin builder para sa mabilis na pagbago ng visual appearance ng theme.
  • Advanced grid builder para sa posts, portfolio, media, at custom post types.

At iyon ang mga pangunahing katangian ng visual composer, kumpleto, kasama na ang professional support para sa $34 (regular na lisensya mula noong December 2016).

Visual composer Para Sa Mga Gumagawa Ng Theme

Saglit nating isipin kung bakit ang mga gumagawa ng theme ay dapat isama o pahabain ang Visual Composer, at para saan ang implikasyon ng lisensya sa paggawa nito.

Ang pagbenta ng Wordpress Themes ay maaaring magandang pagkakitaan , alinman sa pagbenta nito ng paisa-isa o kaya sa pamamagitan ng marketplace katulad ng ThemeForest. Bilang gumawa ng theme (Ninzio Themes) naiintindihan namin ang gantimpala, subalit maintindihan ninyo kung gaano kahirap gumawa ng theme, at ano ang gusto ng bawat gumawa mula sa kanyang produkto:

  • Nababawasan ang time sa paggawa at gastos.
  • Mataas na kalidad ng produkto.
  • Napapalawak ang kita mula sa sales
  • Nababawasan ang oras sa support
  • Nagbibigay ng kaukuang atensyon sa bagong katangian at marketing

At alam niyo ba? Ang Visual Composer ay maaaring makatulong sa inyo para makamit ang mga hangaring ito direkta o hindi direkta. Hayaan ninyong ipaliwanag ko ito kung papaano:

Marami sa WorPress themes ay may dati ng nakakabit na Page Builders, at ang paggawa dito ay naging sikat sa mga nakaraang taon, subalit sa ngayon, sa tumataas ng kumpetisyon, ay hindi na ito nakakalamang pagdating sa halaga at oras para makagawa ng custom solution para sa iyong theme. Sa halip, ang Visual Composer ay maaaring isama sa iyong theme, at ialok sa iyong mamimili ng libre (libreng gamitin sa iyong theme lamang).

Kung iba-browse mo ang nangungunang Themeforest na WordPress themes mapapansin mo na halos bawat theme ay may visual composer na kasama dito, kahit na iyong themes na may sariling custom built-in page builder. Ang Visual Composer ay kilalang produkto, subok na ng libong beses ng mas maraming milyong gumagamit at gumagawa.

ThemeForests top WordPress themes
Nangungunang WordPress themes themes sa Themeforest

Sa puntong ito nabigyan natin ng linaw kung bakit ang visual composer ay naging (halos) kailangang kaalaman para sa matagumpay na mga gumagawa Wordpress theme, at kung bakit kailangang isaalang-alang ang pagsama nito sa iyong themes.

Ang mga susunod na tanong ay: papaano isama an Visual Composer, at may katwiran ba tayo para gawin ito?

Ang Pagsama ng Theme: Legal na Gabay

Kung ikaw ay gumagawa ng theme at nag-iisip na isama ang visual composer  sa iyong themes, narito ang mabilis na buod ng kakailanganing gawin:

“Noong ika-22 ng January, 2013 Envato ay nag-update ng kanilang lisensya at hindi na possibleng gumamit ng items mula sa marketplaces mula sa iyong sariling items na ibebenta sa []marketplaces, ng walang partnership na kasunduan sa pagitan ng dalawang sumulat. Sa pagkakataong ito, sa pagitan name ni (Michael M) at ikaw (gumawa ng theme).” – Michael M

Kung kaya... kung nais mo na isama ang Visual Composer sa iyong theme kailangan mong sumulat kay Michael? Sa kabutihang palad ay hindi. Ang proseso na ito ay automated. Suriin natin ng sunud-sunod, papaano natin magagawang lisensyado ng maayos ang Visual Composer.

Purchase Extended na Lisensya

Una kailangan mong bumili ng extended na lisensya ng Visual Composer sa CodeCanyon. Sa mismong oras na ito ang presyo ng extended na lisensya ay $170.

Visual Composers extended license from CodeCanyon
Visual Composer’s extended na lisensya sa CodeCanyon

Ano ba ang “Extended na Lisensya”?

Nagbibigay daan sa pag-gamit ng plugin, maaaring ikaw o isang kliyente, sa isang produkto kung saan ang gumagamit ay maaaring singilin. Ang kabuuang presyo ay kasama na ang presyo ng item at bayad sa bibili.

Ang kinakailangan, bumili ka ng developer license para magamit ang Visual Composer sa isa sa iyong mga themes. Ang kliyente na bibili ng theme ay hindi na kailangang bumili ng regular na liensya ng Visual Composer .

Ano Ba Ang Hindi Nito Saklaw?

Hindi mo maaaring gamitin ang isang extended na lisensya para sa iba-ibang themes, o kaya ibahagi ang exended na lisensya kahit kanino. Hindi mo kailangang ibahagi ang license key sa iyong mga kliyente, at ang iyong kliyente ay hindi kailangang i-activate ang Visual Composer (ang kopya mula sa iyong theme).

At ang Updates Tungkol sa Visual Composer?

Isa sa mga karaniwang katanungan na naririnig natin  sa Ninzio Themes ay: “Hindi ako makapag-update Visual Composer”. Hindi ito ginagawa mula sa kliyente; bawat update mula sa Visual Composer ay dapat subukan muna at kasama sa theme updates.

Ang “In-Stock na Lisensya”

Subalit sandali lang ang sabi ni WPBakery “hindi na possibleng gumamit ng items mula sa marketplace mula sa iyong sariling items na ibebenta sa Envato marketplaces”. Kung kaya papaano mo isasama ang Visual Composer sa iyong themes na ibebenta[] kung hindi ito pinapayagan ng extended na lisensya? Dito pumapasok ang espesyal na “kasunduan” sa pamamagitan mo at ng Michael M( Visual Composer Plugin Author): ang “In-Stock na Lisensya”.

Kapag nabili mo na ang extended na lisensya mula sa CodeCanyon, pumunta sa portal ng WPBakery support at mag log-in mula sa iyong Envato login.

WPBakery login
WPBakery login screen

Ang popup message na may Authorize WPBakery Support Portal para kumonekta sa iyong account? Ay lalabas; pindutin ang Approve. Sunod, kapag nabili mo na ang extended na lisensya, ang WPBakery ay kusang ilalabas ang iyong bagong nabiling lisensya sa dashboard, kaya piliin ang lisensya, ipasok ang pangalan ng theme, at pindutin ang Submit. Ang iyong extended na  lisensya ay magiging “In-Stock License”. ThemeForest alam, [alam, alam mo lahat ay lisensyado, kung kaya maaari mong isama ang Visual Composer sa iyong theme at ibenta ang theme sa ThemeForest.

Sa puntong ito, natapos na nating tingnan ang legal na aspeto ng  pagsama ngVisual Composer, ngayon ay oras na para i-eksamin ang teknikal na aspeto.

Pagsama ng Them: Teknikal na Gabay

Walang gaanong saklaw  ang pagsama ng Visual Composer sa iyong theme. Ipapaliwanag natin ang proseso gamit ang isa sa mga themes, Focuson, bilang halimbawa.

Focuson
Focuson

Gumawa ng Kailangang Environment

Kailangan natin ang mga sumusunod na bagay:

  1. Ang php file na may custom na elements (ang iyong theme shortcodes). Sa ati ang tawag dito ay “shortcodes.php” na makikita sa “ninzio-addons” plugin (ang plugin na may theme custom na functionality). Ang “shortcodes.php” ay responsable sa huling output ng shortcodes. Para sa gabay kung paano gumawa ng WordPress shortcodes, tingnan ang pagtuturo ng Rohan Mehta Panimula Sa WordPress Shortcodes.
  2. Ang php file para isama ang Visual Composer. Ang file na ito ay naglalaman ng custom element na pagpipilian, na makikita sa Visual Composer dashboard menu. Sa atin ay tinatawag itong “ninzio_vc.ph” at makikita sa theme folder > na kasama.
  3. Ang Visual Composer templates folder, na maglalaman ng php files ng dati ng element ng Visual Composer, sakaling kailangan mong patungan ang mga ito. Ang folder na ito ay dapat pangalanang “vc_templates”, at lahat ng files na nasa loob ng folder ay dapat pangalanan ng pareho ng nasa “vc_templates” na folder. Dito ay may apat na files na may custom structure at functionality: “vc_column.php”, “vc_column_text.php”, “vc_row.php”, and “vc_video.php”. Ang [] ay  dapat ilagay ng direkta sa loob ng theme root  folder theme folder > vc_templates.

At ang huli, bilang ang Visual Composer ay external plugin, kailangan nating isama ito sa theme download pack. Dito mayroon tayong dalawang pagpipilian:

  1. Isama ang “js-composer.zip” file sa loob ng download pack at ipa-install ito manually sa iyong mga mamimili.
  2. Gamitin ang TGM Plugin Activator para ma-automate ang proseso.

Nakita natin ang pangalawang pagpipilian ang pinakamagandang paraan para hilingin at irekomenda ang plugins para sa WordPress themes. Para magawa ito gumawa ng folder “plugins” sa loob ng theme root folder at ilagay ang “js_composer.zip” file (ang Visual Composer installable file, na ida-download mo pagkatapos bilhin) dito. Para sa mas karagdagang kaalaman sa TGM Plugin Activator tingnan ang Barış Ünver na pagtuturo gamit ang TGM Plugin Activation Library sa Iyong Themes.

WordPress Theme Check

Hindi gusto ng WordPress Theme check kapag ang theme ay may kasamang packed plugins. Magbibigay ito ng babala katulad ng:

REQUIRED: Zip file found. Plugins are not allowed in themes. The zip file found was js_composer.zip

Sa kasamaang palad, sa sitwasyon na ito ay walang opisyal na pagtuturo. Dahil ang pagsama ng plugin folder sa iyong server ay labag sa Envato na lisensya Plugins in Themes-Theme Check Issue walang mas mabuting paraan para isama ang plugin sa theme.

Pigilin ang Hininga

Kung kaya, sa ngayon mayroon tayong…

  1. …kasama an js-composer.zip sa loob ng theme (fucoson>plugins>js_composer.zip)
  2. …gumawa ng custom elements php file (ninzio-addons>shortcodes>shortcodes.php). Tandaan mayroon tayong ninzio-addons plugin sa lahat ng custom functionality nito, at may kasama itong theme.
  3. …gumawa ng Visual Composer integration file (focuson>kasama >ninzio_vc.php)
  4. …at gumawa ng “vc_templates” folder na naglalaman ng dati ng Visual Composer elements para sa pagpahaba ng custom functionality.

Pagsama ng Kailangang Components

Ngayon ay kumpletuhin natin ang pagsasama sa pamamagitan ng kailanganing components. Buksan ang iyong theme “functions.php” file at , sa TGM Plugin Activator, idagdag ang Visual Composer sa listahan ng kailangang plugins:

Ngayon isama ang “shortcodes.php” na file. Sa Focuson theme ang file na ito ay nasa loob ng “ninzio-addons”plugin, kasama na ito noong ang ninzio-addons plugin ay ininstall.

Sunod, isama ang integration file “ninzio_vc.php”. Ang bahaging ito ay napaka-importante, dahil kailangan nating masiguro na ang Visual Composer installable file “js_composer.zip” ay nasa loob ng plugins folder at Visual Composer plugin matagumpay na na-install at aktibo:

Pagkatapos lamang nito kailangan natin ang integration file “ninzio_vc.php”.

Konklusyon

Iyon lamang! Visual Composer ay kasama sa ating sariling theme at nasa atin lahat ng kailangan para pahabain ito. Sa susunod  na pagtuturo titingnan natin ang pag-extend at pag gawa ng Visual Composer. Kita kita tayo doon!

Advertisement
Advertisement
Advertisement
Advertisement
Looking for something to help kick start your next project?
Envato Market has a range of items for sale to help get you started.