Cómo crear fácilmente un tema personalizado de WordPress (sin ningún código)

¿Le gustaría crear un tema personalizado de WordPress desde cero? En el pasado, tenía que seguir el código de WordPress y tener un conocimiento decente de la codificación para construir un tema personalizado de WordPress. Pero, gracias a los nuevos generadores de temas de WordPress, ahora cualquiera puede crear un tema de WordPress totalmente personalizado en una hora (no se requiere conocimiento de codificación). En este artículo, le mostraremos cómo crear fácilmente un tema personalizado de WordPress sin escribir ningún código.

Creando un tema personalizado de WordPress para principiantes en lugar de sitios HTML estáticos, los temas de WordPress son un conjunto de plantillas escritas en PHP, HTML, CSS y JavaScript. Por lo general, debe tener una comprensión decente de todos estos lenguajes de diseño web o contratar a un desarrollador web para crear un tema personalizado de WordPress.
Si ha contratado a un desarrollador o agencia, entonces el costo de un tema personalizado de WordPress puede alcanzar miles de dólares. Debido a que muchos propietarios de pequeñas empresas no podían pagar los altos costos de una WordPress personalizada, muchos de ellos cumplieron solo con los temas predeterminados que venían con WordPress. Aquellos que no querían establecerse y querían personalizaciones, o usaron un creador de páginas de WordPress de arrastrar y soltar, o usaron un marco temático para construir un tema personalizado. Si bien los marcos temáticos de WordPress han facilitado la construcción de un tema de WordPress, representan una solución para los desarrolladores, no un propietario promedio del sitio web.
Por otro lado, los complementos para el generador de páginas de WordPress hicieron que fuera muy fácil crear modelos de página personalizados utilizando una interfaz de arrastrar y soltar, pero solo estaban limitados a los modelos. No podías construir temas personalizados con él. Hasta que Beaver Builder, uno de los mejores complementos para el generador de páginas de WordPress, haya decidido resolver este problema con su programa de finalización llamado Beaver Themer. Beaver Themer es un programa de complemento del sitio que le permite crear aspectos de tema personalizado utilizando una interfaz de arrastrar y soltar y sin aprender a codificar.

Echemos un vistazo a cómo usar Beaver Themer para crear fácilmente un tema de WordPress. Tutorial de video
Suscríbete a WPBeginner
Si no le gusta el video o necesita más instrucciones, continúe leyendo. Configurar Beaver Themer para crear un tema personalizado de Beaver Themer es un complemento adicional para Beaver Builder, por lo que necesitará ambos complementos para este artículo. Primero, debe instalar y activar complementos Beaver Builder y Beaver Themer. Para obtener más detalles, consulte nuestra guía paso por paso sobre cómo instalar un complemento de WordPress.
Beaver Themer le permite crear un tema personalizado, pero aún necesitará un tema para comenzar. Le recomendamos que utilice un tema ligero que incluya una plantilla de página de ancho completo para actuar como su tema original. Puede encontrar muchos de estos temas en el director de WordPress.org. La mayoría de los temas modernos de WordPress incluyen una plantilla de ancho completo. Nuestras mejores opciones son:
Astra: un tema de WordPress ligero, ligero y multifuncional, que viene con soporte construido para Beaver Builder.oeAnwp: otro WordPress multifuncional gratuito, que viene con soporte para el Builder de páginas completas.
Temas StudioPress: toda su tarea es compatible con Beaver Builder y funcionaría excelente con Beaver Themer.
En aras de este tutorial, usaremos Astra, que es fácil y fácil de personalizar el tema de WordPress.
Configuración de su tema para Beaver Themer Al crear un WordPress personalizado con Beaver Themer, es importante asegurarse de que Beaver Themer tenga acceso a todo el cuerpo de la página (desde el borde hasta el borde). Este es el aspecto Astra predeterminado. Como puede ver, este aspecto incluye una barra lateral que puede ser difícil de trabajar al usar Beaver Themer.
Puede cambiar esto accediendo al panel de administración de su sitio web y luego navegando por la página de personalización de apariencia ». Desde aquí, debes pasar a la pestaña de aspecto »barras laterales.
Una vez que llegue allí, simplemente seleccione “sin barra lateral” en la opción Apariencia predeterminada y haga clic en el botón Publicar para guardar los cambios.

Su tema ahora comenzará a usar un aspecto libre. Este es el mejor aspecto para usar con Beaver Themer.

Este aspecto de página completa permite que Beaver Themer use cada centímetro de la pantalla, por lo que puede crear una experiencia visual de un extremo a otro. La mayoría de los temas de WordPress incluyen un archivo de plantilla de ancho completo. Si usa otro tema, puede encontrar una opción para eliminar las barras laterales del tema. Si no lo encuentra, comuníquese con el desarrollador de temas y pueda ayudarlo. Una vez que haya configurado su tema en un aspecto de ancho completo, está listo para crear el tema personalizado de WordPress usando Beaver Themer. Beaver Beaver Themer Beaver Themer funciona sobre Beaver Builder. Como complemento para el generador de páginas, Beaver Builder le permite deslizar y sujetar elementos en una página para crear modelos personalizados. Tiene los siguientes elementos que puede usar en sus modelos:
Plantilla: una colección de filas de columnas y módulos que constituyen un aspecto completo de la página.

Columnas: módulos de apariencia vertical que ayudan a alinear el contenido en el horizontal.
Filas: colección horizontal de múltiples módulos
Módulo: un elemento que muestra información específica, como el título, el bloque de texto, la tabla, la galería, etc.
Simplemente edite una página en Beaver Builder y luego haga clic en el botón Agregar en la esquina superior derecha. Luego puede extraer las redes, las filas, los módulos en su página y comenzar a editarlas de inmediato.
Si no desea comenzar desde cero, seleccione desde una lista de plantillas prefabricadas para comenzar.
Beaver Builder también le permite guardar sus aspectos y luego usarlos más tarde como plantillas. Para obtener más información, consulte nuestro artículo sobre cómo crear un aspecto de página personalizado con Beaver Builder. Sin embargo, no solo queremos crear modelos de página. Queremos crear un tema personalizado completo. Entonces Beover Themer interviene. Agregue otro elemento a Beaver Builder llamado “Diseño de Themer”. Themer AsspECTERS le permite crear aspectos personalizados para el encabezado, el sótano, las áreas de contenido, la página 404 y otras partes de la plantilla.
Estos son los elementos básicos de todos los temas de WordPress y, al usarlos, podrá crear un tema personalizado que se adapte a sus necesidades. El uso de plantillas de Beaver Themer para crear un tema personalizado de WordPress en las siguientes instrucciones, lo guiaremos a través de Los pasos necesarios para construir los elementos temáticos personalizados más populares. Hasta que haya terminado, habrá transformado por completo el tema básico en un tema totalmente personalizado para los niños de WordPress.

Construyendo un encabezado personalizado para que su tema comience con el área de encabezado de su sitio web. Un encabezado personalizado es un componente esencial de un tema y su construcción puede ser difícil utilizando métodos tradicionales.

Afortunadamente, Beaver Themer ha construido funciones de encabezado. Puede usar la plantilla pre-creada o usar el menú y los módulos de imagen con dos columnas. Para llegar a esta área de encabezado, primero tendremos que configurar un encabezado en Beaver Themer. Visite Beaver Builder »Agregue una nueva página y proporcione un título para su encabezado.

Después de eso, seleccione “Diseño Themer” como tipo y “encabezado” como opción de diseño. Después de haber terminado, haga clic en el botón “Agregar diseño themer” para continuar. Esto lo llevará a la página de configuración de Look. Desde aquí debe seleccionar el “sitio completo” como una ubicación donde se mostrará la plantilla de encabezado. Beaver Builder se lanzará con una columna básica simple y un encabezado de dos líneas como punto de partida.
Puede usar las mismas herramientas de deslizamiento y fijación de Beaver Builder para cambiar el fondo, los colores, el texto, etc. Puede agregar otros módulos, cargar plantillas prefabricadas y agregar filas / columnas haciendo clic en Agregar a la esquina superior derecha. Una vez que esté satisfecho con el diseño, haga clic en el botón terminado para guardar o publicar el aspecto. Ahora puede visitar su sitio web para ver la sede del tema personalizado en acción. Como puede ver, aplicamos la apariencia del encabezado de nuestro tema personalizado.

Además del encabezado, aún no mostrará ningún contenido y probablemente verá el área del sótano del tema básico. Cambiemos eso. Construyendo un sótano personalizado para su tema. Puede crear un sótano personalizado para su tema usando Beaver Themer justo cuando creó un encabezado personalizado. Vaya a Beaver Builder »Agregue una nueva página y proporcione un título para su look de sótano.
Haga clic en el botón “Agregar diseño Themer” para continuar. Esto lo llevará a la página de configuración de Look. Desde aquí debe seleccionar “todo el sitio” como una ubicación en la que se mostrará la plantilla.

Después de eso, haga clic en el botón “Iniciar Beaver Builder” para abrir la interfaz del constructor. Beaver Builder se lanzará con una apariencia en el sótano utilizando tres columnas. Puede usar esto como punto de partida y puede comenzar a editar. Puede agregar módulos, bloques de texto o lo que desee. Siempre puede cambiar los colores, las fuentes, agregar una imagen de fondo y más. Después de estar satisfecho con el diseño, haga clic en el botón terminado para guardar o publicar el aspecto. Construyendo el área de contenido para publicar y páginas ahora que hemos creado la sede y los sótanos para cada página y la publicación en el sitio, es hora de construir la publicación o cuerpo de la página (área de contenido). Comenzaremos de la misma manera que construimos el encabezado y el sótano agregando la apariencia “singular” en la nueva página ADD.

Luego elegirás dónde mostrar este aspecto. Puede elegir Singular para usarlo para todas las publicaciones y páginas individuales o puede elegir publicaciones o solo páginas.

Después de eso, haga clic en el botón “Iniciar Beaver Builder” para abrir la interfaz del constructor.

Beaver Builder cargará una muestra singular con el título de Post / Page en la parte superior, seguido del contenido, el cuadro biográfico del autor y el área de comentarios. Puede indicar y hacer clic para editar cualquiera de estos elementos o puede agregar nuevos módulos, columnas y filas, según sea necesario. Después de estar satisfecho con el aspecto, haga clic en el botón terminado para guardar y publicar los cambios. Ahora puede visitar su sitio web para verlo en acción.

Creación de aspectos de archivo para su tema personalizado Ahora que el tema personalizado ha comenzado a delinear, puede pasar a crear modelos para otras partes de su sitio web. Las páginas de archivo son donde WordPress muestra las categorías, etiquetas, autor y archivos mensuales. Creemos una aparición para las páginas de archivo de su tema personalizado. Comenzará a visitar Beaver Builder »Agregar una nueva página y proporcionar un título para la apariencia del archivo. Haga clic en el botón “Agregar diseño Themer” para continuar. Esto lo llevará a la página de configuración de Look. Desde aquí debe seleccionar “todos los archivos” como una ubicación en la que se mostrará la plantilla. También puede crear modelos separados para cada tipo de archivo individual, como fecha, resultados de búsqueda, categoría, etiquetas, etc.

Después de eso, haga clic en el botón “Iniciar Beaver Builder” para abrir la interfaz del constructor. Beaver Builder se lanzará con una apariencia básica para una sola columna. Mostrará el título del archivo en la parte superior, seguido de publicaciones.







Copyright statement: Unless otherwise noted, this article is Collected from the Internet, please keep the source of the article when reprinting.

Check Also

gkOVSBm5B8SgiXmo

Shopify vs WooCommerce – ¿Cuál es la mejor plataforma?(Comparación)

Shopify vs WooCommerce

Leave a Reply

Your email address will not be published. Required fields are marked *