Cómo integrar Visual Composer en tus temas de WordPress

Visual Composer es el complemento de WordPress que permite crear páginas utilizando una interfaz de arrastrar y soltar. Le da a los usuarios el poder de diseñar páginas fácilmente, y les brinda a los desarrolladores la oportunidad de agregar valor a sus temas de WordPress. En este tutorial veremos las implicaciones legales y técnicas de la integración de Visual Composer en los temas, listos para la venta..

Visual Composer viene con:

• Editor de WordPress de front-end y back-end combinado.
• Más de 40 elementos de contenido integrados disponibles y más de 200 complementos, diseñados para llevar su sitio web al siguiente nivel.
• Biblioteca de plantillas que brinda a los usuarios de WordPress acceso a cientos de plantillas de diseño de alta calidad.
• Constructor de pieles para cambiar rápidamente la apariencia visual del tema..
• Generador de cuadrículas avanzado para publicaciones, cartera, medios y tipos de publicaciones personalizadas.

Así que esas son las características principales de Visual Composer, todo incluido, incluido el soporte profesional por $ 34 (licencia regular a partir de diciembre de 2016). 

Compositor visual para desarrolladores de temas

Pensemos por un momento por qué los desarrolladores de temas deben integrar o ampliar Visual Composer, y cuáles son las implicaciones de la licencia para hacerlo..

La venta de Temas de WordPress puede ser un negocio lucrativo, ya sea que venda individualmente o a través de un mercado como ThemeForest. Como autores de temas (Temas de Ninzio) entendemos las recompensas, pero sabemos lo difícil que puede ser el desarrollo de un tema y lo que cada desarrollador quiere de su producto:

• Reducción del tiempo y coste de desarrollo..
• Un producto de alta calidad..
• Ingresos maximizados de ventas
• Tiempo de soporte reducido
• Foco en nuevas funcionalidades y marketing.
  

¿Y sabes qué? Visual Composer puede ayudarlo a lograr estos objetivos directa o indirectamente. Déjame explicarte cómo:

Muchos temas de WordPress tienen creadores de páginas integrados, y construirlos se convirtió en una tendencia en años anteriores, pero hoy en día, con una mayor competencia, es extremadamente desventajoso en términos de costos y tiempo desarrollar una solución personalizada para su tema. En su lugar, Visual Composer puede integrarse en su tema y ofrecerse a sus compradores de forma gratuita (gratis para usar solo con su tema).

Si navega por los principales temas de WordPress de Themeforest, notará que casi todos los temas tienen Visual Composer integrado, incluso los temas que tienen su propio creador de páginas integrado personalizado. Visual Composer es un producto conocido, probado miles de veces por más millones de usuarios y desarrolladores.. 

Los mejores temas de WordPress en Themeforest

En este punto, hemos dejado en claro por qué Visual Composer se ha convertido (casi) en el conocimiento requerido para los desarrolladores de temas de WordPress exitosos, y por qué debería considerar integrarlo en sus temas.

Las siguientes preguntas son: ¿cómo integramos Visual Composer y tenemos el derecho de hacerlo??

Integración de Temas: Guía Legal

Si eres un desarrollador de temas que está pensando en incluir Visual Composer en tus temas, aquí tienes un breve resumen de lo que necesitas:

“El 22 de enero de 2013, Envato actualizó sus licencias y ya no es posible utilizar artículos de los mercados dentro de sus propios artículos que estarán a la venta en los mercados de Envato, sin un acuerdo de asociación entre dos autores. En este caso entre yo (Michael M) y tú (autor del tema). ”- Michael M

Entonces ... ¿si quieres incluir Visual Composer en tu tema, tienes que escribirle a Michael? Por suerte, no. Este proceso ha sido automatizado. Examinemos, paso a paso, cómo podemos licenciar correctamente Visual Composer.

Compra de licencia extendida

Primero tendrá que comprar la licencia extendida de Visual Composer de CodeCanyon. En el momento de escribir este documento, el precio de una licencia extendida es de $ 170..

Licencia extendida de Visual Composer de CodeCanyon

¿Qué es una "licencia extendida"??

La licencia extendida permite el uso del complemento, por usted o por un cliente, en un solo producto por el cual se puede cobrar a los usuarios finales. El precio total incluye el precio del artículo y una tarifa de comprador.

Esencialmente, compras una licencia de desarrollador para usar Visual Composer con uno de tus temas. Los clientes que compren ese tema no están obligados a comprar la licencia regular de Visual Composer. 

Lo que no cubre?

No puede usar una licencia extendida para varios temas, ni puede compartir su licencia extendida con otra persona. No tendrá que compartir la clave de licencia con sus clientes, y sus clientes no tendrán que activar Visual Composer (la copia que viene con su tema). 

¿Qué pasa con las actualizaciones de Visual Composer?? 

Una de las preguntas más comunes que escuchamos en los Temas de Ninzio es: "No puedo actualizar Visual Composer". Esto no se hace desde el extremo del cliente; cada actualización de Visual Composer debe probarse e incluirse en las actualizaciones de temas.

La "licencia en stock"

Pero espere un minuto: WPBakery dice que "ya no es posible utilizar artículos de los mercados dentro de sus propios artículos que estarán a la venta en los mercados de Envato". Entonces, ¿cómo puede incluir Visual Composer en sus temas a la venta en ThemeForest si su licencia extendida no lo permite? Aquí es donde entra en juego el "acuerdo" especial entre usted y Michael M (Visual Compositor Plugin Author): la "Licencia en existencia".

Una vez que haya comprado la licencia extendida de CodeCanyon, vaya al portal de soporte de WPBakery e inicie sesión con su inicio de sesión de Envato.

Pantalla de inicio de sesión de WPBakery

Un mensaje emergente con Autorice el portal de soporte de WPBakery para conectarse con su cuenta? aparecerá; hacer clic Aprobar. A continuación, si ya ha comprado la licencia extendida, WPBakery muestra automáticamente su licencia recién comprada en el tablero, así que seleccione la licencia, ingrese el nombre del tema y presione Enviar. Su licencia extendida se convertirá en una "Licencia en existencia". ThemeForest sabe, WPbakery sabe, usted sabe que todo tiene licencia, por lo que puede incluir el Visual Composer en su tema y venderlo en ThemeForest.

En este punto, hemos terminado de analizar los aspectos legales de la integración de Visual Composer, ahora es el momento de examinar el aspecto técnico..

Integración del tema: Guía técnica

No hay mucho involucrado con la integración de Visual Composer con su tema. Explicaremos el proceso usando uno de nuestros temas, Focuson, como ejemplo.

Concentrarse en

Crear el entorno requerido

Necesitamos las siguientes cosas:

1. Un archivo php con elementos personalizados (los códigos cortos de tu tema). En nuestro caso, esto se llama "shortcodes.php" que se encuentra en el complemento "ninzio-addons" (un complemento con funcionalidad personalizada del tema). "Shortcodes.php" es responsable de la salida final de shortcodes. Para obtener una guía sobre cómo crear códigos cortos de WordPress, eche un vistazo al tutorial de Rohan Mehta Introducción a los códigos cortos de WordPress.
2. Un archivo php para integrar el Visual Composer. Este archivo contiene sus opciones de elementos personalizados, que se muestran en el menú del panel de Visual Composer. En nuestro caso, esto se llama "ninzio_vc.php" y se encuentra en carpeta de temas> incluye.
3. Una carpeta de plantillas de Visual Composer, que contendrá archivos php de los elementos predeterminados de Visual Composer, en caso de que necesite sobrescribirlos. Esta carpeta debe llamarse "vc_templates", y todos los archivos ubicados dentro de esa carpeta deben nombrarse exactamente como los de la carpeta "vc_templates" de Visual Composer. En nuestro caso, tenemos cuatro archivos que se extienden con una estructura y funcionalidad personalizadas: "vc_column.php", "vc_column_text.php", "vc_row.php" y "vc_video.php". La carpeta "vc_templates" se debe colocar directamente dentro de la carpeta raíz del tema carpeta de temas> vc_templates.

Por último, pero no menos importante, como Visual Composer es un complemento externo, debemos incluirlo en el paquete de descarga de temas. Aquí tenemos dos opciones: 

1. Incluya el archivo "js_composer.zip" dentro del paquete de descarga y pida a sus compradores que lo instalen manualmente.
2. Use el Activador de Complementos TGM para automatizar este proceso. 

Encontramos que la segunda opción es la mejor manera de solicitar y recomendar complementos para los temas de WordPress. Para hacer esto, cree una carpeta de "complementos" dentro de su carpeta raíz de tema y coloque el archivo "js_composer.zip" (el archivo instalable de Visual Composer, que habrá descargado después de la compra). Para obtener más información sobre el Activador de complementos TGM, consulte el tutorial de Barış Ünver Uso de la biblioteca de activación de complementos TGM en sus temas. 

WordPress Theme Check

A WordPress Theme Check no le gusta cuando un tema incluye complementos empaquetados. Le dará una advertencia como:

REQUERIDO: archivo zip encontrado. Los complementos no están permitidos en los temas. El archivo zip encontrado fue js_composer.zip

Desafortunadamente, para esta situación no hay instrucciones oficiales. Como la inclusión de la carpeta de complementos en su servidor va en contra de los complementos de la licencia de Envato en Temas - Problema de verificación de tema, no hay otra forma mejor de incluir el complemento con el tema.

Recuperar el aliento

Entonces, por ahora tenemos ...

1. … Incluido js_composer.zip dentro del tema (fucoson> plugins> js_composer.zip)
2. … Creó el archivo php de elementos personalizados (ninzio-addons> shortcodes> shortcodes.php). Recuerde que tenemos el complemento ninzio-addons con todas las funciones personalizadas en él, y viene con el tema.
3. … Creó el archivo de integración de Visual Composer (focuson> incluye> ninzio_vc.php)
4. ... y creó la carpeta "vc_templates" que contiene elementos predeterminados de Visual Composer para ampliar con funcionalidad personalizada.

Incluyendo componentes requeridos

Ahora completemos la integración incluyendo los componentes requeridos. Abra su archivo de “funciones.php” del tema y, con TGM Plugin Activator, agregue Visual Composer a la lista de complementos necesarios:

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

Ahora incluye el archivo "shortcodes.php". Como en el caso del tema Focuson, este archivo se encuentra dentro del complemento "ninzio-addons", ya se incluye cuando se instala el complemento ninzio-addons.

A continuación, incluya el archivo de integración "ninzio_vc.php". Esta parte es muy importante, ya que necesitamos asegurarnos de que el archivo instalable de Visual Composer "js_composer.zip" esté dentro de la carpeta de complementos y que el complemento de Visual Composer se haya instalado y activo correctamente:

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

Solo después de eso requerimos el archivo de integración "ninzio_vc.php".

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

Conclusión

¡Eso es! Visual Composer está integrado con nuestro tema y tenemos todo lo necesario para extenderlo. En el siguiente tutorial veremos cómo ampliar y construir con Visual Composer. Te veo allí!