¿Quieres crear un tema personalizado de WordPress? ¿Hacer algo hermoso sin tener que codificar? Tener control total sobre el tema de tu sitio web de WordPress es una excelente manera de aumentar las ventas y brindar una experiencia profesional con tu marca.
En este artículo te mostraremos cómo tener control total sobre tu tema. Podrás hacer que se vea genial, incluso si eres principiante. Justo como tú quieres. Y no necesitarás escribir ningún código personalizado ni contratar a un diseñador o desarrollador costoso.
¡Empecemos!
- ¿Qué es un tema de WordPress?
- El desafío de personalizar temas
- Cómo personalizar o creartu propio temasin necesidad de codificar
- Un recorrido rápido por SeedProd + EDD
Nota: este artículo es para trabajar en sitios de WordPress.org, no en sitios de WordPress.com. Haz clic aquí para un artículo que explica la diferencia.
¿Qué es un tema de WordPress?
Cada sitio de WordPress utiliza un tema. Un tema es la plantilla, el aspecto o el diseño general de tu sitio web. Los temas controlan la funcionalidad y la apariencia del front-end de tu sitio web. Son una colección de archivos de plantilla PHP, CSS, Javascript y HTML.
Un sitio de WordPress puede tener varios temas instalados, pero solo uno puede estar activado y mostrarse en el front-end de tu sitio web. Los temas se almacenan en la carpeta wp-content.
Cuando instalas WordPress, viene con un tema predeterminado creado por el equipo principal de WordPress. Nombran sus temas según el año en que fueron escritos (Twenty Twenty Two, Twenty Nineteen, etc.).
Easy Digital Downloads (EDD) proporciona dos temas personalizados gratuitos de WordPress que puedes usar para crear una tienda digital; Themedd y Vendd. También proporcionamos una lista de temas gratuitos y de pago de otros diseñadores/desarrolladores que puedes usar.
➡️ Consulta la página de temas de EDD
El desafío de personalizar temas
Un desafío central con los temas de WordPress es que pueden ser difíciles de crear o personalizar. Necesitarás al menos experiencia o familiaridad con WordPress, HTML y CSS.
Aquí hay algunas de las cosas que debes aprender para hacer desarrollo o personalización de temas de WordPress:
- Comprender conceptos de codificación como 'el bucle', que es código PHP para cargar contenido
- Utilizar la jerarquía de plantillas creando un tema hijo, en su propio directorio de temas. Esto te permite heredar código de un tema padre y limita cuántos archivos tienes que escribir desde cero (como page.php y single.php).
- Los usos del archivo function.php, las áreas de widgets y los permalinks
- Asegúrate de que los archivos de tu tema no ocupen demasiadas líneas de código. Demasiadas líneas de código pueden hacer que tu sitio cargue lentamente, lo que impacta negativamente tu SEO (optimización de motores de búsqueda).
- Configurar un entorno de desarrollo que incluya un editor de código y sitios web ejecutándose localmente en tu computadora para pruebas
Herramientas para facilitarlo
WordPress es conocido por ser fácil de usar. Especialmente en comparación con todo lo demás. ¡Hay una razón por la que impulsa el 43% de Internet!
Existen varias soluciones que se han desarrollado en el ecosistema de WordPress para hacer frente a los desafíos de personalización y creación de temas.
Una solución es usar uno de los miles de temas premium disponibles en diferentes mercados. Puedes elegir un tema que ya se vea y se sienta como tú quieres.
Te contaremos sobre otras soluciones a continuación. 👇🏽
Cómo personalizar o crear tu propio tema sin código
Te mostraremos cuatro soluciones para personalizar o crear un tema de WordPress. ¡Algunas incluso te permiten construir tu propio tema desde cero sin código!
Constructor de temas SeedProd
La mejor manera de construir tu propio tema de sitio web, sin código, es usar el constructor de temas SeedProd.
SeedProd es un constructor de WordPress de arrastrar y soltar. Es una potente herramienta de diseño visual utilizada por más de un millón de profesionales de sitios web.
Es fácil de usar y te permite crear páginas de destino personalizadas o incluso el tema completo de tu sitio web. Funciona perfectamente con el editor de bloques de Gutenberg.
SeedProd comenzó como una forma sencilla de crear tu página de "próximamente", "modo de mantenimiento" o "página 404". Ha sido actualizado y expandido constantemente para crear páginas de destino y ahora para construir temas completos.
Una característica realmente popular y potente de SeedProd es su enorme biblioteca de plantillas y temas prediseñados. Puede ser muy útil comenzar con algo prediseñado, en lugar de una pizarra en blanco. Luego puedes personalizar y construir fácilmente a partir de ahí.
⏭ Haz clic aquí para saltar y ver cómo usar SeedProd + EDD
A continuación se presentan tres soluciones más para personalizar o construir tu tema de WordPress.
El Personalizador
Una solución que muchos temas ofrecen se llama 'el personalizador'. El personalizador te permite controlar muchos elementos visuales del tema sin necesidad de codificar. Estas interfaces de personalización suelen ser geniales y te dan bastante libertad. Nuestros temas gratuitos Themedd y Vendd ofrecen el personalizador.
Muchos temas incluso tienen una casilla llamada 'CSS adicional' en su Personalizador que te permite anular manualmente la apariencia de los temas con tu propio código CSS. Se requieren habilidades de codificación menores o mucha búsqueda en Google para hacer uso de esto.
| 🟢 PROS DEL PERSONALIZADOR | 🔴 CONTRAS DEL PERSONALIZADOR |
|---|---|
| El Personalizador es bastante fácil de usar y potente | Sigues estando limitado al marco y al concepto de diseño del tema que estás utilizando. |
| Algunos temas aprovechan mejor el Personalizador que otros, es posible que descubras que no tienes los controles que deseas sin usar el campo CSS adicional para codificación personalizada. |
Plugins de constructor de páginas
Hay varias empresas que crean constructores de páginas para WordPress. Estos proporcionan una interfaz visual para construir páginas. Algunos de ellos incluso ofrecen la capacidad de personalizar todo el tema con plantillas de encabezado, pie de página, barra lateral y página.
Estos constructores de páginas están editando y controlando archivos PHP, archivos CSS y Javascript complicados para que tú no tengas que hacerlo.
| 🟢 PROS DE LOS CONSTRUCTORES DE PÁGINAS | 🔴 CONTRAS DE LOS CONSTRUCTORES DE PÁGINAS |
|---|---|
| Tienes mucho poder y control | Algunos pueden ralentizar tu sitio |
| Interfaz visual | Muchos constructores de páginas son caros, algunos tienen un plan gratuito |
| Con algunos constructores de páginas todavía tienes que instalar un tema y puede ser confuso trabajar tanto con el tema como con el constructor de páginas |
Edición Completa del Sitio (FSE)
Es posible que estés escuchando mucho sobre la Edición Completa del Sitio de WordPress. Las primeras versiones de FSE se lanzaron recientemente en WordPress 5.8 y 5.9. Este es un nuevo proyecto del equipo principal para hacer posible editar todo tu sitio usando una herramienta de 'editor de bloques'.
El editor de bloques de WordPress (Gutenberg) ha existido durante varios años. Es una interfaz visual gratuita similar a un constructor de páginas para crear las publicaciones y páginas. Se incluye gratis con cualquier sitio de WordPress.
Ahora, o pronto, podrás editar cualquier tema integrado con FSE con una funcionalidad e interfaz similar a la del editor de bloques. Úsalo para controlar cualquier elemento de una página, incluidos menús, encabezados, pies de página, barras laterales y widgets.
¡Esto es emocionante! Será una excelente manera de controlar el tema de tu sitio. Aún no está listo para el público general, al momento de escribir este artículo, FSE todavía está en beta.
| 🟢 PROS de FSE | 🔴 CONTRAS de FSE |
|---|---|
| Pronto será una gran opción, especialmente si ya te gusta y usas el Constructor de Páginas de Gutenberg | Todavía en pruebas beta, al momento de escribir este artículo |
| Requiere un tema compatible con 'Edición completa del sitio', no hay muchos disponibles en este momento |
Un recorrido rápido por SeedProd + EDD
🎉 SeedProd te permite crear tu propio tema de sitio web con facilidad. Sin necesidad de código. Y sin ninguna de las desventajas mencionadas anteriormente.
Te mostraremos lo fácil que es construir tu propio tema de WordPress con SeedProd. Demostraremos su uso con el plugin de comercio electrónico Easy Digital Downloads (EDD).
¡Imagina lo que puedes hacer! Puedes tener control total sobre cada detalle de la experiencia del cliente. Sin esperar semanas o meses a que diseñadores o desarrolladores caros trabajen en tu sitio.
¡Tú conoces a tus clientes y tu tienda mejor que nadie! Y te importa tu sitio más que a nadie. SeedProd es una gran opción para obtener resultados fantásticos... ¡RÁPIDO!
Esto es lo que debes hacer:
- Instalar y activar SeedProd
- ¡Haz clic en un botón para crear un tema!
- Realizar personalizaciones básicas
- Crear plantillas personalizadas para tus Descargas (para EDD)
- Haz aún más
Instalar y Activar SeedProd
Primero necesitas comprar SeedProd. La opción Theme Builder requiere una licencia Pro o Elite.
🤚🏾Haz clic aquí para obtener un 50% de descuento en el precio de introducción de SeedProd
Después de comprar SeedProd Pro o Elite, instálalo como cualquier otro plugin. Si eres nuevo instalando plugins, aquí tienes un gran tutorial.
Una vez instalado el plugin SeedProd, asegúrate de introducir tu clave de licencia.
¡Ahora estás listo para crear tu propio tema nuevo!
Además, asegúrate de instalar Easy Digital Downloads si aún no lo tienes.
EDD es de uso gratuito e incluye:
- Carrito de compras
- Listar tus productos/descargas
- Archivos de producto protegidos, solo los clientes que pagan tendrán acceso a enlaces que caducan automáticamente
- Opciones de pago flexibles
- Códigos de descuento
- Gestión de clientes (CRM básico)
- Informes de comercio electrónico
- Integración con Stripe y/o PayPal
Pases de EDD
Obtén un Pase de EDD para agregar funciones avanzadas de comercio electrónico como integración de correo electrónico, suscripciones, licencias de software, integración con Amazon S3/DropBox y más.
¡Haz clic en un botón para crear un tema!
Busca SeedProd en el lado izquierdo de tu administrador de WordPress. Haz clic en Theme Builder.
A continuación, haz clic en el botón naranja que dice Themes. Esto mostrará los temas predeterminados que puedes elegir. Usaremos el tema predeterminado Starter en nuestro ejemplo a continuación.
Una vez que hagas clic en el tema predeterminado Starter, SeedProd creará cada parte de la plantilla del tema, como: página individual, página de inicio, encabezado, pie de página, barra lateral, etc.
¡Acabas de crear un tema completo con UN CLIC!
No tuviste que crear footer.php, header.php o sidebar.php, archive.php o una hoja de estilos. ¡Todo estaba hecho por ti!
Asegúrate de habilitar el tema haciendo clic en el botón de alternancia Enable SeedProd Theme en la parte superior derecha. Esto deshabilitará tu tema actual. Asegúrate de que estás listo para que esto sea visto por el público, o prueba esto en un servidor de staging.
Nota: cuando usas SeedProd, ya no usas el sistema de temas de WordPress. No verás un nuevo tema con un nombre de tema en la carpeta de temas dentro de wp-content/themes. En cambio, el plugin de SeedProd para WordPress ha tomado el control de la apariencia del sitio.
Personalización básica
Hay algunas personalizaciones que puedes hacer de inmediato. Personaliza tu logo y los colores y estilos básicos.
Personaliza tu logo
Un buen primer paso es agregar tu logo. Hazlo editando la plantilla Header.
Estilos generales personalizados
Segundo, puedes editar rápidamente cualquiera de la configuración de estilos globales. Haz clic en la plantilla Global CSS.
Aquí puedes cambiar muchas configuraciones visuales para el sitio como fuentes, encabezados, enlaces (href), y colores y tamaños. Esto reemplaza la necesidad de saber CSS y personalizar el archivo style.css.
Crea plantillas personalizadas para tus descargas
Los productos que vendes con Easy Digital Downloads se almacenan como un tipo de publicación personalizada llamada Descargas en tu sitio de WordPress.
Tus Descargas se muestran como una Publicación Individual o una Página de Archivo.
- Una Publicación Individual es cuando una Descarga aparece por sí sola en su propia página.
- Una Página de Archivo (en lenguaje de WordPress) es una lista de múltiples Descargas.
No necesitas empezar desde cero. En lugar de elegir agregar nuevas plantillas, simplemente duplica estas dos plantillas que SeedProd acaba de crear para ti:
- Índice del blog, Archivos, Búsqueda y
- Publicación Individual
Asigna a esas plantillas el título de ‘EDD Single Download’ y ‘EDD Download List’ para que no las confundas con otras plantillas.
Edita las condiciones de tus plantillas de descarga
Necesitas configurar estas páginas para que solo carguen Descargas. Es simple. Solo haz clic en el botón de texto debajo del título que dice Editar condiciones.
Para la plantilla EDD Single Download configúrala así:
- Prioridad 10
- Incluir: tipo de publicación Descarga
En la EDD Download List usa estas configuraciones:
- Prioridad 30
- Incluir: archivo de tipo de publicación, y luego escribe ‘download’
Nota: estas configuraciones de prioridad están diseñadas para asegurar que tus condiciones no sean anuladas por otras cuando tengas dos condiciones similares. Aprende más sobre prioridades y condiciones aquí.
Personaliza tus páginas de descarga
Ahora que has creado plantillas separadas para tus Descargas de EDD. Puedes personalizarlas como quieras.
En mi ejemplo, creé una página de descarga de EDD limpia y simple. Una sola columna centrada sin barra lateral ni nada para intentar aumentar las conversiones.
Aquí está en el backend editándose en SeedProd.
Luego, así es como se ve en el frontend.
En esta página de ejemplo de lista de descargas de EDD opté por una cuadrícula de 2 columnas. Puedes hacer lo que quieras. Es increíblemente fácil probar cosas nuevas y previsualizarlas.
En el backend editándose con SeedProd:
Así es como se ve en el frontend:
¡Haz más. El cielo es el límite!
O tal vez el espacio exterior es el límite. Las muestras anteriores son solo una pequeña vista previa de todas las cosas que puedes hacer con SeedProd.
Solo imagina lo que puedes hacer con control total y experimentación ilimitada.
SeedProd viene con cientos de bloques de plantillas y plantillas de página.
Aquí hay solo algunos ejemplos que podrían ser de especial interés para creadores digitales como nosotros.
- Tablas de precios
- Encabezados animados
- Diseños de varias columnas (con configuraciones responsivas para móviles)
- Formulario de contacto
- Sorteo (con RafflePress)
- Formulario de suscripción
- Compartir en redes sociales
- Carrusel de imágenes
- Acordeón
- Facebook; Me gusta, Comentarios, Página o Incrustar
- Twitter; Incrustar, Línea de tiempo, Botón de Tweet, Botón de Seguir
- El buen viejo shortcode
SeedProd es una excelente manera de configurar tu tema de EDD. Es una gran opción, ya sea que recién estés comenzando o quieras probar algo nuevo que impresione a los clientes.
Conclusión
¡Estelar! Acabas de aprender a hacer que tu tema se vea hermoso sin codificar. Imagina lo que puedes hacer para mejorar la experiencia del cliente cuando puedes personalizar todo tú mismo.
Tenemos muchos más recursos para creadores digitales y emprendedores. ¡¿Sobre qué quieres aprender ahora?!
- 🤑 Los asombrosos beneficios de vender descargas digitales
- 💰 La lista completa de descargas digitales que puedes vender
- 💸 Las 14 descargas digitales más populares que puedes vender en 2022
Asegúrate de seguirnos en Facebook y Twitter para obtener más información sobre WordPress y la venta de productos digitales.
