Crea una cuenta o inicia sesión

¡Continúa aprendiendo sin ningún costo! Únete y comienza a potenciar tu carrera

Estructura de Theme de WordPress

3/13
Recursos

Aportes 18

Preguntas 21

Ordenar por:

¿Quieres ver más aportes, preguntas y respuestas de la comunidad? Crea una cuenta o inicia sesión.

👋🏼 Hola
En la sección de recursos pueden encontrar una lectura sobre Git Graph.
Git Graph es una extensión de VSCode para navegar por el repositorio.
En la lectura aprenderán a instalarla y comenzarla a usar. 🙂

Un truco para tomar una captura sin tercer programa

Para los que esten como yo y no sepan de donde se obtiene este recurso
https://code.visualstudio.com/

3. Estructura de Theme de WordPress

Podemos consultar la estructura de cómo funcionan los archivos de WordPress en https://wphierarchy.com/

Se debe crear la carpeta que tendrá nuestro tema en la raíz de nuestro archivo wordpress en /themes/nombreDeCarpeta

Un tema de WordPress mínimo debe tener dos archivos: style.css e index.php

La plantilla para rellenar el archivo style.css de acuerdo a la documentación es:

/*
Theme Name: Twenty Twenty
Theme URI: https://wordpress.org/themes/twentytwenty/
Author: the WordPress team
Author URI: https://wordpress.org/
Description: Our default theme for 2020 is designed to take full advantage of the flexibility of the block editor. Organizations and businesses have the ability to create dynamic landing pages with endless layouts using the group and column blocks. The centered content column and fine-tuned typography also makes it perfect for traditional blogs. Complete editor styles give you a good idea of what your content will look like, even before you publish. You can give your site a personal touch by changing the background colors and the accent color in the Customizer. The colors of all elements on your site are automatically calculated based on the colors you pick, ensuring a high, accessible color contrast for your visitors.
Tags: blog, one-column, custom-background, custom-colors, custom-logo, custom-menu, editor-style, featured-images, footer-widgets, full-width-template, rtl-language-support, sticky-post, theme-options, threaded-comments, translation-ready, block-styles, wide-blocks, accessibility-ready
Version: 1.3
Requires at least: 5.0
Tested up to: 5.4
Requires PHP: 7.0
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: twentytwenty
This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned with others.
*/

La documentación la podemos encontrar en:

https://developer.wordpress.org/themes/basics/main-stylesheet-style-css/

Para cambiar la preview del tema es, debe ser 1200x900px y se pone con el nombre de screenshot el cual puede ser .jpg o .png y WordPress lo tomará como preview del tema. Finalmente me quedó así, y estoy bastante contento, aunque por el momento está vacío.

tambien pueden arrastrar la carpeta public a VSCode y abre automaticamete

Me encanta! me salió todo

Hola, para los que no les muestra el nuevo tema creado
la solución es simple
En el programa localwp dentro de su sitio (proyecto) esta el botón
ADMIN y OPEN SITE
dar click al ADMIN , les pedirá la contraseña y listo sigan los paso del curso

Ubicar la carpeta de nuestro theme en app/pubic/wp-content/themes. Creamos dos archivos el style.css y el index.php
Para poner una imagen a nuestro theme debemos añadir una imagen llamada screenshot.png de 1200 x 900.

Siempre utilicé Child themes, es algo semejante… Aunque sin duda hacerlo desde cero es mucho más interesante.
Muy bien explicada la clase Cristian 😉

Gracias, muy buena la clase.

Diria que es mejor hacerlo desde in theme child o publico asi te ahorras mucho trabajo. yo tengo componentes ya creado solo de copiar y pegar en nuevos proyectos .

En mi caso no se llego a subir la imagen ya revise si hay typo. Será porque en mi tema me aparece como " no esta permitido con php" ?

Listo ya llegue hasta subirlo pero ahora me sale que la versión de ese tema no me sale en php jajaja 😦

como se sabe que ya esta guardado? Escribí el código pero no veo un boton de guardar

Cuando estoy en local solo me sale la opcion : Platzi comerce
Al profe le sale

  • Blog

  • Proyecto

  • Yard sales

Que hice mal ?

A mi no me aparece esas opciones en el local 😦

No es cool que la screen del profesor vaya como lento 😦 estaba bugeada la grabadora de pantalla o algo.

Excelente clase, una forma super fácil de aprender a crear temas para WordPress.