Hola!

Espero que tengas o hayas tenido un gran día…

En esta publicación vamos a hablar de WORDPRESS

Más especificamente de los temas de este gran CMS.

Si están inmersos en el mundo del diseño web con WordPress sabrán que existen un sin fin de temas o plantillas que nos permitirán disponer del diseño de nuestro sitio web.

Si bien wordpress es gratuito, debemos asegurarnos de adquirir una plantilla para nuestro sitio web y que sea lo más profesional posible.

Entonces…

Es aqui donde entra el constructor de páginas web más completo y optimizado de internet.

Se trata de DIVI de Elegant Themes.

Para el que no la ha sentido hablar, consiste en un motor para crear sitios web con el CMS Wordpress, el cual nos facilitará mucho esta tarea.

La ventaja que tiene este motor de páginas web de WordPress es que disponemos de un sin fin de plantillas las cuales podremos cambiar cuando queramos necesario o conveniente.

Hay muchas otras alternativas donde solo vamos a adquirir 1 sola plantilla.

Perfecto… Continuando

Los pasos basicos para instalar DIVI son muy simples.

1) Asegurarse de tener instalado WordPress

2) Nos registramos en la web desde el enlace, nos descargamos el paquete de archivos y lo instalamos

DIVI posee 2 planes como podemos ver en la siguiente imagen:

Planes de DIVI

Como vemos al dia de la fecha esta el plan de U$89 dolares al año y por otro lado la licencia de por vida con 1 pago de U$249 dolares.

Divi WordPress Theme

Dentro de los productos dispondremos del acceso a el constructor de plantillas DIVI, el creador de plantillas EXTRA orientado a blogs y publicaciones online, la herramienta BLOOM para realizar formularios a modo de embudos de venta y hacer seguimiento y MONARCH que se trata de un plugin que nos va a permitir integrar nuestras redes sociales a nuestro sitio web.

Ademas esta incluido el soporte 24/7. Acceso a todo tipo de actualización y vamos a poder utilizar DIVI en cualquier sitio que necesitemos.

Perfecto…

Elegimos el plan de preferencia, llenamos los datos del formulario y la información de nuestra tarjeta de credito y creamos la cuenta.

Ingresamos a nuestra cuenta desde el sitio web de DIVI y veremos algo como lo siguiente:

Herramientas DIVI 1
Herramientas DIVI 2

Como pueden ver podremos descargar el paquete de acuerdo a lo que vayamos a utilizar.

En nuestro caso va a ser DIVI.

Después nos dirigimos a nuestro panel de WordPress y clickeamos en Apariencia > Temas

Apariencia > Temas

Después agregamos el nuevo plugin:

Agregar nuevo Tema

Subimos el paquete del motor DIVI al servidor de nuestro WordPress descargado anteriormente:

Subiendo el motor DIVI al servidor

Finalmente lo activamos:

Tema instalado y activado correctamente

Si accedemos haciendo click en “Visitar sitio” ya veremos nuestro sitio web con la plantilla por defecto, lo que significa que nuestro DIVI esta funcionando perfectamente:

DIVI activado con plantilla por defecto

Creando nuestro tema hijo

Una vez instalado el tema DIVI lo primero que debemos realizar a continuación es crear un tema hijo. El tema hijo nos brindará independencia a la hora de actualizar el tema principal, por lo que se surgen actualizaciones futuras (algo muy común) actualizaremos el tema Padre sin modificar ningun parámetro de nuestra plantilla personalizada, por ende los cambios se verán realizados en el tema Padre solamente.

Para crear este tema “Hijo” se puede crear manualmente o con plugins. En nuestro caso por practicidad lo haremos mediante el plugin “Child Theme Configurator”.

Nos dirigimos al siguiente enlace plugin y lo descargamos.

Se nos abrirá la siguiente pestaña y procederemos a descargar e instalar el plugin. Como se puede ver en la imagen se actualiza frecuentemente y posee muchas descargas.

Plugin para generar el tema hijo

Procederemos a descargarlo, luego lo instalamos y activamos para continuar con su configuración.

La configuracion es muy sencilla ya lo verán…

Entonces…

Nos dirigimos al menu HERRAMIENTAS >> Temas Hijo, como muestra la siguiente imagen:

Configuracion Temas Hijo

Una vez que entramos al panel de configuracion del tema hijo se nos presentará la siguiente interfaz:

Panel de Configuracion del Plugin

Aqui sencillamente vamos siguiendo los pasos:

En primera medida vamos a seleccionar la opcion que nos dice “CREAR un nuevo tema hijo”.

Como segundo paso seleccionamos el tema padre. Tener en cuenta que si tenemos mas de un tema instalado siempre conviene desinstalar todos aquellos que no utilicemos ya que podrían ser entrada de ataques o nos pueden causar problemas en la integridad de nuestro sitio web.

Por último le damos click al botón “ANALIZAR”

Ahora ya lo tenemos listo para comenzar a trabajar en el diseño.

Paso 4 >> Luego continuamos dandole un nombre al tema hijo.

Paso 5 >> Le mantenemos los estilos de la plantilla del tema padre.

Paso 6 >> Dejamos que el plugin determine las acciones apropiadas para el nuevo tema hijo.

Paso 7 >> Configuramos las descripciones del tema, esto es nombre, descripcion y sus caracteristicas principales de referencia.

Paso 8 >> Copiar menus y widgets se recomiendo activarla ya que no viene por defecto.

Paso 9 >> “Crear nuevo tema hijo”

Luego podriamos realizar una preview o prevista para ver como quedo y si e ve todo en orden antes de activarlo.

Por ultimo nos dirigimos a APARIENCIA >> TEMAS

Y se nos abrira el siguiente panel:

Tema hijo y padre

Entonces activamos el tema hijo y listo….

Ahora cada vez que recibamos una notificacion para actualizar nuestro tema padre, lo actualizamos sin problemas.

Siempre conviene hacer backups o respaldos antes de cualquier accion, nunca estará demás!

Pasos previos de configuración de DIVI

Ahora ya lo tenemos listo para comenzar a trabajar en el diseño.

Pero antes realizaremos unas configuraciones basicas.

Nos dirigimos al menú y clickeamos la opcion DIVI > Theme Options:

Configuración de DIVI

Luego veremos lo siguiente en el apartado principal:

Opciones de DIVI 2

Una vez aqui nos vamos a la opción de “UPDATES” y completamos los datos de nuestro usuario de la web de DIVI y la api Key que nos brinda luego de adquirir el producto:

Datos de cuenta de DIVI

Con esto vamos a registrar el producto y podremos mantener actualizado nuestro constructor DIVI.

Para ver los datos del usuario nos vamos a la web de Elegant Themes e iniciamos sesión:

Nuestra cuenta de Elegant Themes

Y presionamos en la opcion “APIKEYS” y debajo nos saldra nuestra api, la copiamos y la pegamos en los campos correspondientes mostrados en la imagen superior junto con el nombre de usuario:

Obteniendo la APIKEY de DIVI

Perfecto…

Por temas de simplicidad vamos a dejar esta primera parte del tutorial aqui para que no se extienda demasiado.

En el proximo tutorial haremos incapie en el diseño de nuestra web directamente

Nos vemos alli!

PD: Cuentanos que te pareció este tutorial en los comentarios