Kreative en Ezoco es una de las plantillas de Genesis, uno de los frameware más populares y que mejor rendimiento tiene para lograr un buen posicionamiento.
Una de mis plantillas preferidas, por su versatilidad es kreative en Ezoco. Es de pago pero merece la pena si quieres una página bien pensada a nivel de diseño y perfecta en cuanto a rendimiento.
La única dificultad que tienen las plantillas de Genesis es que hace falta algo de código HTML para dejar la plantilla como en la demo: https://demo.ezoco.es/kreative
Para facilitar esta puesta a punto voy a compartir el código HTML que me ha servido para optimizar la plantilla.
#1 Instalar y activar.
Para activar una plantilla de Genesis primero hay que subir Genesis Frameware. A continuación se sube y se activa la plantilla de Kreative Pro. Una vez activa se pulsa en personalizar para dejar la HOME perfecta.
#2 Front Page Images.
En este apartado podemos subir una imagen de 1600 x 1050 para personalizar nuestra web. Si no lo hacemos agarrará la imagen por defecto.
#3 Menú.
En este apartado nombramos un menú y le añadimos los elementos de páginas, categorías o entradas. Hasta ahora nada nuevo bajo el Sol.
#4 Widget en kreativ en ezoco.
Ahora empieza lo interesante 9 Front Page y 3 Footer.
Front Page 1.
Añadimos un HTML personalizado con el código:
<h1 class="pepapig">
Examen Juande
</h1>
<h3 class="juande">
Diseña tu propio futuro
</h3>
<a href="#" class="button">Enviar</a>
En este código se puede observar un H1 con una clase que he llamado «pepapig» en la que hago algunos cambios de tipografía y color. También lo hago en el H3. En cambio en la etiqueta A, utilizo una clase predefinida por Kreative en ezoco.
Para definir el CSS3 de cada clase debo irme al apartado de CSS Adiciona o Simple Social CSS dentro de la personalización e incluir el siguiente código:
.pepapig {
color: white;
font-size: 45px;
}
.juande {
color: white;
}
Con esto consigo el efecto deseado.
Front Page 2.
En este Widget debemos añadir un widget de texto y tres de HTML personalizado con el siguiente código:
<i class=" fa fa-cubes"></i>
<h4>
Eficiencia demostrada
</h4>
<p>
Resultados demostrados
</p>
Se puede apreciar en el código como en la etiqueta <i></i> añadimos una clase que extraemos de la web: https://www.w3schools.com/icons/fontawesome_icons_webapp.asp
En esta web podemos encontrar un amplio abanico de iconos para personalizar nuestro proyecto. En cada HTML se puede introducir el mismo código cambiando el «fa fa-cubes» por otro icono.
Front Page 3.
Este espacio es algo especial. Para tenerlo activo y funcional debemos descargar un plugin «Genesis Protfolio Pro» donde podemos crear un portfolio de productos o servicios para que se puedan incorporar desde este espacio widget.
La creación del portfolio es sencilla, similar a una entrada o página.
Cuando tengamos creados los elementos del porfolio, volvemos al Front Page 3 para añadir un widget de texto y un widget Genesis Featured Portfolio. Desde este widget llamamos al portfolio e incorporamos los productos o servicios, mostrando la imagen destacada y el título.
Front Page 4.
En este espacio añadimos a los miembros del equipo. Necesitamos tres imágenes cuadradas de 200 x 200 en nuestra biblioteca de medios. Copiamos la url de la imagen y la pegamos en el código HTML.
<img src="/wp-content/uploads/sites/78/2022/03/team3.jpg"/>
<h4>Pepa Motos</h4>
<p>
Cargo que ocupa
</p>
<a href="#"><i class="fa fa-facebook"></i></a>
<a href="#"><i class="fa fa-twitter"></i></a>
<a href="#"><i class="fa fa-instagram"></i></a>
En el código se añade la imagen con la URL, un H4 y un párrafo. Por último dentro de una etiqueta A, introducimos una etiqueta «i» para añadir los iconos de redes sociales.
Front Page 5.
De nuevo un widget de texto para los titulares y tres widget HTML. En cada HTML añadimos una lista y un botón.
<h2>39 €</h2>
<ul>
<li><i class="fa fa-check"></i> Servicio 1</li>
<li><i class="fa fa-check"></i> Servicio 2</li>
<li><i class="fa fa-check"></i> Servicio 3</li>
<li><i class="fa fa-check"></i> Servicio 4</li>
<li><i class="fa fa-check"></i> Servicio 5</li>
</ul>
<a href="#" class="button" target="_blank">Contratar</a>
Front Page 6.
Este espacio es para reseñas de clientes. Un texto y tres widget HTML:
Grandes profesionales, de confianza. Me han ayudado mucho.
<img class="testimonial-avatar" src="/wp-content/uploads/sites/78/2022/03/team3.jpg"/>
<h4>
Rafa Toribio
<span>Empresario</span>
</h4>
Front Page 7.
En esta ocasión añadimos una llamada a la acción con un botón que lleva a una de nuestras páginas donde convertir.
<h1>
Lets Create Something Together
</h1>
<p>We offer custom services to our clients. Got a project in mind that you'd like to work together on? We'd love to hear more about it.
</p>
<a href="#" class="button" target="_blank">Start a Project</a>
Pie de página 1.
En este apartado vamos a poner nuestros datos para que puedan ser clicados desde un móvil. Se puede hacer con un widget de texto o HTML.
<h1>
Contacto
</h1>
<p>
Avda. Madrid 40
</p>
<a href="http://tel+34600100200">600100200</a>
Pie de página 2.
En este apartado podemos añadir un widget de texto con nuestros datos que horarios y dirección. Con el widget simple social icons, podemos añadir iconos de redes sociales. Para ello será necesario que hayamos instalado y activado este plugin.
Pie de página 3.
En el último espacio añadimos un widget de texto y un widget de Genesis enew extended. Este widget se puede activar si hemos instalado y activado el plugin correspondiente.
Este plugin permite generar listas de correo que conectan con nuestra herramienta de email marketing ACUMBAMAIL para poder automatizar el envío de nuestro boletín de noticias.
Topbar.
Este espacio de cabecera se completa con un html personalizado y un widget de nuevo con los iconos de redes sociales «Simpel Social Icons».
<ul>
<li><i class="fa fa-phone"></i> +1-(123)-456-7890</li>
<li><i class="fa fa-envelope-o"></i> info@kreativ.com</li>
</ul>
También puedes seguir el vídeo con las instrucciones de configuración.
Demuestra la Eficacia de tus Campañas con Acumbamail
Si estás buscando una herramienta que te permita enviar campañas de email marketing con la máxima eficiencia y obtener resultados demostrables, Acumbamail es tu solución ideal. Esta plataforma se destaca por su facilidad de uso y por ofrecer una forma sencilla y efectiva para gestionar tus listas de suscriptores, diseñar newsletters atractivos y analizar el impacto de tus campañas en tiempo real.
Con la demo de Acumbamail, tendrás la oportunidad de explorar todas las funcionalidades que esta herramienta ofrece, sin compromiso alguno. La demo está diseñada para mostrarte lo intuitiva que es la plataforma y cómo puedes aprovechar al máximo sus características para mejorar la comunicación con tus clientes y potenciar tu negocio.
No esperes más para comprobar cómo Acumbamail puede transformar tu estrategia de email marketing. Accede a la demo, experimenta con las diversas opciones de personalización y segmentación, y empieza a cosechar los frutos de campañas de correo electrónico más efectivas y bien dirigidas.
Juande Marín
Profesor de Marketing digital, divulgador de inteligencia artificial y neuroeducación. Especializado en posicionamiento en buscadores y diseño web. Autor de varios libros relacionados con el comercio electrónico y el marketing digital (McGraw Hill, Paraninfo,…) Juande2marin