Agregar CSS en WordPress de manera correcta
Вставка
- Опубліковано 2 лют 2025
- Aprende diferentes formas de cómo agregar código CSS en WordPress de manera correcta.
➡️ Ver artículo completo: decodecms.com/...
📘 Cursos WordPress: decodecms.com/...
👉 Hosting que uso, link de afiliado: decodecms.com/...
👉 Videos relacionados: • Agregar CSS en WordPre...
Gracias por tu video. Estoy usando tema Ashe y no me aparecen la numeración de páginas. ¿Sabrías que css poner? Gracias
Hola, mostrar esa información no tiene que ver con CSS, debe ser alguna configuración de tu tema, prueba temporalmente con otro tema y verifica si te sucede lo mismo.
Muchas gracias! me has iluminado.
Gracias por la ayuda
De nada
Hola, yo uso tema hijo, pero en WordPress uso la opción de CSS adicional para hacer cambios del tema de la plantilla, en caso el tema se actualize perdería los cambios? Si lo hago directo en CSS adicional ? , gracias.
Hola, no, no perderás los cambios, agregar CSS adicional es también una opción, aunque si tienes mucho código mejor organizarlo en el style.css del tema hijo, además tienes la ventaja de que este archivo se puede mantener en cache. En tu caso el código que agregas en CSS adicional se muestra como parte del documento HTML, es por eso que de preferencia lo uses cuando tienes poco código agregado allí.
Hola. Muy buen tutorial. De todas cual seria la opción mas recomendable para tomar por costumbre? Grácias
Hola, depende, usualmente si es mucho código que agregues, te recomiendo usar un tema hijo y colocar en su style.css todo el código
Excelente trabajo !!
Mi pregunta es , como edito el css de un plugin insertado en el wordpress, por ejemplo de un reproductor que instale , e inserte el shortcode
Quiero cambiar colores !! Ayúdame porfavor 🙏
Ya que hice las modificaciones respectivas del CC dentro del tema y posteriormente dentro del plugin para cargar los colores, y no sucede nada !
Posiblemente tienes que usar CSS personalizado, revisa este artículo de referencia: decodecms.com/usar-el-inspector-de-codigo-para-modificar-un-theme-wordpress/
Hola buen vídeo, explicas muy bien.. tengo una pregunta si quiero colocar CSS a una pagina especifica lo agrego allí también o hay otro método?
Hola, puedes agregar el código CSS con cualquiera de los métodos, sin embarg en ese caso tienes además que especificar el ID de la página con alguna de las clases que vienen por defecto, por ejemplo: .page-id-XX, revisa este artículo.
decodecms.com/estilos-css-defecto-genera-wordpress/
Hola. ¿Tienes un video que explicas acerca de cómo editar un widget con css?
Hola, puedes ayudarte del inspector de código: decodecms.com/usar-el-inspector-de-codigo-para-modificar-un-theme-wordpress/
Hola, sabes si para poner el CSS adicional tiene que ser el tema hijo? porque uso el mismo código que use antes y no funciona :'(
No necesariamente, prueba agregarlo en Apariencia > Personalizar > CSS
@@Decodecms Sí, justo ahí estoy agregando el código pero no surte efecto :/ Tengo un codigo puesto que recién hizo efecto pero si lo quito ya no se revierten esas opciones, sabes que podría estar pasando?
@@RoyalKitchensAndHome debe ser un tema de cache, prueba en tu navegador como incógnito
Gracias , Muchas Gracias
Excelenteeeee, muy agradecido estoy
:). que bueno que te sirvió.
Que interesante este tema, a raíz de este vídeo busque cual sería la manera más eficiente de usarla? donde es mejor para la web ? si usamos alguna de estas 4 maneras la web cargará igual o con alguna siempre funcionará mejor? busqué al respecto y hay varios autores que se contradicen.. que opinan?
Hola, depende, si el código adicional que agregarás será poco e incluso crítico para el primer vistazo de tu sitio, podrías agregarlo como parte del HTML, ya sea código inline o desde la opción del personalizador del tema. Si haces varias modificaciones CSS adicionales no críticas será mejor tenerlas en un archivo, por ejemplo el style.css del tema hijo. La ventaja de tenerlas en el tema hijo es que los plugins la pueden minimizar, fusionar con otros archivos y el navegador también lo puede mantener en cache.
amigo una consulta si el tema tiene la opcion de añadir css y despues el tema se actualiza se pierden esos cambios? o es mas recomendable hacerlo en un tema hijo? gracias por compartir tus conocimientos saludos!!!
Hola, no debería perderse si el theme tiene esa opción, lo mismo si haces un theme hijo. Te recomiendo hacer theme hijo si vas a realizar muchos cambios CSS y también posibles cambios en el archivo functions.php u otros archivos, si sólo son pocos cambios CSS puedes usar la opción de tu theme para agregar CSS.
ok amigo gracias por responder, y por brindar esta valiosa informacion, saludos!!
Hola, sucede que al momento de usar el panel de "CCS adiconal" quiero por ejemplo mover una imagen, pero lamentablemente al aplicar el CCS se me mueven todas las imágenes y yo solo quiero que se mueva una, igual pasa con los textos.
Para poner CCS a una imagen lo que hago es ir a "inspeccionar elemento" con clic derecho y escoger el identificador de la imagen que lamentablemente siempre es este: ".wp-block-image:not(.is-style-rounded) img {}", en el caso de los textos siempre es: ".p{}" entonces cada vez que quiero cambiarle algo a alguna imagen o texto, se va a cambiar a todo.
¿Alguien conoce alguna forma de evitar esto?, me gustaría saber como poner CCS en el panel de "CCS adicional" a una sola foto o a un solo texto.
Gracias por su ayuda.
Hola, tienes que especificar más, lo mejor si no es posible la especificación a más detalle es que en el bloque agregues una clase CSS, esta te servirá de base para hacer los cambios únicos a ese elemento.
Hola, tienes que especificar más, lo mejor si no es posible la especificación a más detalle es que en el bloque agregues una clase CSS, esta te servirá de base para hacer los cambios únicos a ese elemento.
DecodeCMS excelente vídeo, Tengo una pregunta como podría hacer estas modificaciones en tiempo real desde mi ordenador, obviamente la web ya esta subido al hosting , pero sin plugin ya que siempre genera problemas a largo plazo
Hola, para ver los cambios en tiempo real puedes usar el Inspector de Código: decodecms.com/usar-el-inspector-de-codigo-para-modificar-un-theme-wordpress/ , sin embargo para que estos cambios se queden de manera permanente tienes que usar alguno de los métodos que detallo en el video, personalmente crear o que lo mejor sería usar un tema hijo especialmente si harás muchas modificaciones.
Si cambio el tema, ¿se eliminaría el CSS añadido?
Hola, si cambias de tema el CSS que hayas agregado posiblemente no será compatible, fisicamente no se elimina, simplemente no te aparecerá, si vuelves a cambiar de tema tu CSS debería estar allí.
es normal que ese editor este bloqueado en algunopos temas???
Sería extraño, no debería, sin embargo si te bloquea es posible que haya una configuración similar a nivel del tema para agregar CSS
amigo gracias por el video, necesitaba eliminar la cantidad de carrito de compras de woocommerce y lo hice con css .product-quantity {display:none} funciono genial en la versión pc pero en la versión móvil no desaparece me podrias ayudar? gracias tus videos me han salvado en más de una ocasión, saludos
Hola, inspecciona el código en movil, es posible que se generen otras clases, esto depende de tu theme o si usas plugins que cambian esta funcionalidad, si sigues con problemas envía la url de tu sitio
Hola! Gracias por la información! Quisiera saber si pueden explicar cómo agregar estilos mediante body_class()
Hola, pocas veces necesitarás agregar una clase al body ya que las clases que se generan automáticamente son suficientes para identificar una página de manera única, revisa: decodecms.com/estilos-css-defecto-genera-wordpress/
he visto que existe un plugin para conectarse a nuestra web y hacer los cambios directamente es parecido al inspector de elementos la única ventaja es que se puede conectar a nuestra web y hacer los cambios en tiempo real no se como se llama ese plugin si lo conoces cuéntamelo y haz un tutorial
Hola, supongo que te refieres a este: siteorigin.com/css/ , es similar al inspector de código (el modo avanzado).
Buenos dias , que buen video :)
Una pregu, si necesito agregar dos archivos diferentes de CSS , debo hacer dos codigos o en este mismo puedo cargar los dos ?
Puedes agregar dos veces pero el registro del script, es decir dos veces función: wp_enqueu_style()
Cómo puedo agregar un clase personalizada a un elemento específico? Tengo esto: Contenido y quiero lograr esto: Contenido
Hola, una opción es ubicar el código PHP que genera ese elemento y hacer las modificaciones. Si sólo quiere para una página específica, podrías evaluar usar las clases del body que cambian de acuerdo a la página.
Amigo tengo una duda, estoy usando este codigo para agregar css:
add_action( 'wp_enqueue_scripts', 'custom_enqueue_styles');
function custom_enqueue_styles() {
wp_enqueue_style( 'custom-style',
get_stylesheet_directory_uri() . '/css/custom.css',
array(),
wp_get_theme()->get('Version')
);
}
mi duda es: si quiero agregar otra hoja de estilo, por ejemplo, animations.css, que modificaciones tengo que hacerle? soy nueva en esto, te lo agradeceria mucho
Hola, agrega simplemente otra línea de cola, es decir usa nuevamente la función wp_enqueue_style dentro de custom_enqueue_styles
+DecodeCMS amigos me surgio otra duda resulta que agregue mi HTML dentro de un widget y en algunos id me marca un error que dice: "the id value must be unique" y no permite que se cargue la hoja de estilo completamente solo se carga una parte en los id que no tiene ese error, ya no se que hacer
Hola, entiendo que estas agregando el código HTML directamente en los widgets, cuida que el atributo id sea único usa un prefijo al nombre ya que puede ser que se encuentre repetido como parte del tu theme, sin embargo esto no debería afectar la carga de tu hoja de estilos.
Toma agüita
Lo tendré en cuenta, gracias por la sugerencia