Cómo crear un blog con el tema EXTRA de WordPress

Si hablamos de temas Premium de WordPress, tenemos que hablar de Elegant Themes, gracias a las continuas actualizaciones y mejoras de sus productos, podemos disfrutar de auténticas herramientas para crear un sitio web de cualquier tipo. Y eso vamos a realizar, un blog con el tema EXTRA en WordPress.

Construir un blog con el tema EXTRA paso a paso

Podemos hacer infinidad de sitios con esta plantilla, aunque se diseñó inicialmente para crear publicaciones, podemos configurarla como queramos para conseguir nuestro propósito.

En varios tutoriales que podéis encontrar en esta web, explico cómo personalizar distintos aspectos de este tema, uno de mis favoritos.

Pero no te preocupes, para los que han llegado a este artículo sin saber nada, voy a explicarte todo el proceso paso a paso.

El resto puede navegar por el menú para localizar lo que le interesa.

Requisitos antes de crear el blog en EXTRA

Extra es un buen tema de WordPress, y como tal, debemos tratarle como se merece. Necesitamos disponer de un hosting, y al ser posible que no sea gratuito, ya que estos carecen de la tecnología mínima necesaria para su buen funcionamiento.

Yo empecé desde cero contratando un hosting en Hostgator, para empezar considero que es de lo mejor que hay en calidad-precio, pero también podéis valorar otras posibilidades como Siteground o Webempresa, estos dos últimos con planes especializados en WordPress y en español.

Os dejo un vídeo para que podáis ver cómo contratar un hosting en Hostgator y los pasos a seguir para conseguirlo. Es fácil, sencillo y rápido. Recomiendo adquirir el dominio conjuntamente con el servidor la primera vez.

Utiliza los siguiente cupones si quieres conseguir descuentos a la hora de contratar el hosting en Hostgator:

• JSC1MESMENOS - Te descontarán el primer mes sobre el precio final
• JSC25DESCUENTO - 25% de descuento en cualquier plan que adquieras

Instalar WordPress en el servidor

Tras contratar el hosting y recibir la información necesaria para acceder al panel e control (cPanel), hay que realizar una instalación de WordPress. El proceso es automático y no requiere de conocimientos especiales paraiello.

PRIMERO: Accedemos a la aplicación de instalación, puede haber un enlace directo de WordPress o unas herramientas llamadas "QuickInstall" o "Softaculous" desde las que podemos WordPress para instalar.

SEGUNDO: Nos pedirá una serie de datos para realizar la instalación, de los cuales los imprescindibles son únicamente el dominio que vamos a utilizar en el sitio, el correo electrónico y el nombre de administración con su clave de acceso.

En algunos servidores puede que, la clave para acceder a la administración de WordPress, nos la proporcionen aleatoriamente. Si es así, la copiamos para poder utilizarla para acceder.

El resto de campos no es bueno rellenarlos, pero no es muy importante, ya que vamos a poder modificarlos con posterioridad si lo necesitamos.

Después de esto ya tenemos WordPress instalado en nuestro hosting, y tendríamos que poder acceder escribiendo el dominio en internet.

Configuración básica e WordPress

En la Zona Premium hay un curso básico de WordPress donde explico todo lo necesario para poner en marcha este gestor de contenidos, como manejarlo y que necesitas saber para controlarlo con soltura.

Antes de empezar a trastear con la web, debemos ir a la pestaña "Ajustes > Generales" y rellenar los siguientes campos:

• Título del sitio
• Descripción corta
• Dirección del correo electrónico
• Idioma (Muy importante)
• Zona horaria
• Formato de fecha
• Formato de hora

En esa misma pestaña de "Ajustes", seleccionamos "Enlaces permanentes". Y marcamos la opción de "Nombre de la entrada".

De esta forma convertimos las URLs de nuestra web en direcciones amigables, permitiendo a los buscadores indexar el contenido de forma que pueda ser localizado con una búsqueda normal.

Instalar el tema EXTRA en WordPress

Para instalar la plantilla en WordPress y poder tener un blog con el tema EXTRA, necesitamos descargar los archivos. La suscripción básica de Elegant Themes por un año cuesta 89$ (unos 75 euros), y tienes acceso a las actualizaciones durante ese periodo.

Instalar la plantilla Extra y el tema Hijo

No hay ningún misterio, vamos a la pestaña "Apariencia > Temas" y pinchamos primero en "Añadir un tema nuevo" y seguidamente en la pestaña "Subir tema".

Primero realizamos el proceso con el tema padre y luego el tema hijo. Sólo debemos activar el tema hijo para empezar a funcionar.

Si no disponemos del archivo del tema hijo, podemos crearlo instalando un plugin llamado "Child Theme Configurator".

En este enlace puedes ver cómo crear el Child Theme de EXTRA con este plugin.

El tema hijo nos va a permitir realizar cambios, como modificar los créditos del pie de la página que podéis ver en el enlace anterior, y no perder esos cambios con las actualizaciones de tema.

Traducir el tema EXTRA al español

Si os manejáis bien con el inglés, puede que sólo necesitéis traducir algunas cadenas de palabras de cara al usuario que visitará nuestra web. Para eso podéis seguir el tutorial que tengo en este enlace.

Pero si os descargáis los archivos completos de traducción, que también podéis encontrar en el enlace anterior, tendremos traducido el 99% de una sola atacada.

PRIMERO: Descomprimimos el archivo de las traducciones en el escritorio del ordenador.

SEGUNDO: Instalamos un plugin llamado "File manager", con el que podremos manejar los archivos del servidor sin necesidad de acceder a cPanel o de FTP.

TERCERO: Abrimos el plugin desde la nueva pestaña y buscamos la ruta "wp-content > languages > themes". Aquí subiremos los archivos .mo, ya que los .po son para editar las traducciones y no lo vamos a hacer.

Si el servidor que hemos contratado es Linux, también subiremos al mismo sitio el archivo .mo que hay en la carpeta "theme".

CUARTO: Vamos a plugins, desactivamos y borramos el plugin "File Manager" que ya no necesitaremos y refrescamos la página para ver los cambios.

Al cambiar el idioma, puede que tengamos que decirle a WordPress que recuerde los "Enlaces permanentes". Para eso vamos a:

• Ajustes > Enlaces permanentes: Elegimos la opción "Nombre de la entrada" y guardamos.
• Extra > Opciones del Tema: Sólo pinchamos en guardar cambios.
• Apariencia > Widgets: Elegimos de nuevo los widgets que queremos utilizar y los colocamos en la barra lateral.

Otras instalaciones necesarias para el blog con el tema EXTRA

Aunque pensemos que con tener un tema bonito, y que se vea bien en internet, está todo hecho, no es así. Hay que tener algunos puntos en cuenta como la seguridad y la optimización.

Piensa que internet es una plaza llena de gente de todo tipo, buenas y malas personas, y que tu web ahora mismo es un niño pequeño sólo en medio de todas ellas. Hay que enseñarle a protegerse.

Entre los plugins más básicos que todo WordPress debe tener están:

• Seguridad: "Akismet" para evitar el spam de los comentarios y "Sucuri" para proteger el blog o la web de ataques.
• Optimización: "Yoast seo" nos ayudará a definir la forma de indexar las páginas y optimizarla.
• Cookies: Debemos avisar de la utilización de cookies con "Cookie notice".

Configurar el layout de la página de inicio del blog en el tema EXTRA

Vamos a empezar por olvidarnos de la opción que trae EXTRA de crear la página de inicio con una categoría. Si quieres utilizar esa opción me parece bien, pero no es la que voy a usar yo, ya que está muy limitada la utilización de los módulos.

Lo primero que vamos a crear son dos páginas, una la llamaremos "Inicio" y la otra "Blog", y las publicamos sin hacer nada más.

Vamos al menú "Ajustes > Lectura" y elegimos la opción de una "página estática" para elegir la página principal y el blog.

Configuración básica de los módulos para crear un blog

Existen miles de formas de configurar la página de inicio para crear un blog con el tema Extra, las distintas combinaciones que podemos hacer con los módulos es muy variada. Pero todas las haremos desde el "Constructor DIVI".

Para ir viendo el resultado tenemos que haber escrito varios artículos, al principio no tienen porque ser con contenido real, ya los cambiarás cuando escribas en serio.

La más básica sería añadir dos módulos "Blog", el primero mostraría sólo el último artículo a una anchura completa y el segundo lo configuraríamos como "Grilla" o rejilla, para que muestre el resto de artículos en tres columnas.

No voy a explicar cómo se configuran los módulos para esta composición, voy a explicar otro formato del que podéis extrapolar la configuración si os gusta la de arriba.

Configuración del blog en el tema EXTRA a dos columnas

PRIMERO: Al editar la página de inicio, tenemos a la derecha unos paneles. Vamos a marcar la casilla "Ocultar título e información meta en la entrada" en el panel "Ajuste de EXTRA".

SEGUNDO: Vamos a componer con el "Constructor Divi" la siguiente configuración sobre una única sección estándar.

El módulo "Blog", de la primera fila, tiene la siguiente configuración básica:

• PESTAÑA CONTENIDO:
  • Número de entradas: 1
  • Contenido: Mostrar extracto
  • Número de compensación: 0
  • Mostrar imagen destacada: SI
  • Mostrar paginación: NO
  • (El resto de las opciones son libres de configuración)
• PESTAÑA DISEÑO:
  • Diseño: Ancho completo
  • (Lasa demás opciones las configuráis para adaptarlas a vuestros gustos, tipografías, colores...)
• PESTAÑA AVANZADO:
  • Clase CSS: margenblog colorfondoblog

El módulo de "Texto" es  únicamente para añadir una línea horizontal y crear una separación entre las filas. es totalmente prescindible si no queréis ponerlo.

En la segunda fila vamos a configurar una vez el módulo "Blog", y después lo duplicaremos las veces que queramos cambiando el valor del apartado "Número de compensación" por un número cada vez mayor para evitar que se repitan las entradas:

• PESTAÑA CONTENIDO:
  • Número de entradas: 1
  • Contenido: Mostrar extracto
  • Número de compensación: 1
  • Mostrar imagen destacada: SI
  • Mostrar paginación: NO
  • (El resto de las opciones son libres de configuración)
• PESTAÑA DISEÑO:
  • Diseño: Ancho completo
  • Usar borde: SI y elegir un color
  • (Lasa demás opciones las configuráis para adaptarlas a vuestros gustos, tipografías, colores...)
• PESTAÑA AVANZADO:
  • Clase CSS: margenblog

La "Llamada a la acción" es un simple botón que nos llevará a la página del fedd del Blog, donde se encuentran la totalidad de los artículos.

Podéis colocar un simple link con un módulo de texto, o no ponerlo si tenemos el acceso en el menú.

Añadir código CSS para ajustar los márgenes de las entradas del blog

Suena a lago complicado, pero no hay que asustarse, si habéis puesto bien los nombres en el apartado "Clase CSS" como os indicaba, es coser y cantar.

Abrimos el "Personalizador de Tema" desde "Apariencia > Personalizar", nos dirigimos a la pestaña "CSS adicional" y copiamos las siguientes líneas de código tal cual.

El "layout" de la página de inicio debería quedarnos de la siguiente manera:

Configuraciones adicionales para el blog con el tema EXTRA

Con esto ya podéis poneros a escribir como locos y publicar contenido en internet, cuanto más interesante sea más visitas recibiréis.

Pero, aunque el blog funcione a la perfección, debéis personalizarlo a nivel de diseño. Añadir imágenes, poner una cabecera única, añadir un formulario de contacto con el que interactuar con tu público...

Una serie de cosas, que según te vayan surgiendo, puedes consultar en muchos de los tutoriales que tengo en esta web sobre el tema EXTRA.

Y si no están, puedes sugerirlo en los comentarios y probaremos a buscar la solución.