Estoy tratando de eliminar algo de CSS, que WordPress agrega en el front-end. En la última actualización, WordPress está agregando una clase como esta:
<main id="app" class="wp-container-620d4049355bb wp-block-group">
<div class="wp-container-620d404934f13 entry-content wp-block-post-content">
wp-container-620d4049355bb / wp-container-620d404934f13 para bloques principales.
El problema es que también está agregando algo de CSS:
.wp-site-blocks > * + * {
margin-top: var( --wp--style--block-gap );
}
.wp-site-blocks > * {
margin-top: 0;
margin-bottom: 0;
}
.wp-container-620d4049355bb > * {
margin-top: 0;
margin-bottom: 0;
}
.wp-container-620d404934f13 > * + * {
margin-top: var( --wp--style--block-gap );
margin-bottom: 0;
}
Este CSS tiene un conflicto con mis bloques, donde estoy agregando clases individuales para establecer el margen.
¿Alguien podría ayudarme cómo puedo eliminar ese css? ¿O eliminar esa clase? El hecho curioso es que wp-container-620d42ff1d800 es diferente cada vez que se actualiza la página.
¡Gracias!
La función BlockGap, var( --wp--style--block-gap ); no está habilitado de forma predeterminada. Si habilitó blockGap o las herramientas de apariencia en theme.json, puede deshabilitarlo nuevamente configurándolo en nulo:
tema.json:
{
"version": 2,
"settings": {
"spacing": {
"blockGap": null
}
}
}
Consulte la referencia de theme.json:
https://developer.wordpress.org/block-editor/reference-guides/theme-json-reference/theme-json-living/#spacing
Si desea eliminar el wp-container-random y las alineaciones, los márgenes y los estilos flexibles generados, puede desactivar la función Diseño. Agrega esto a tus temas functions.php o similar:
remove_filter( 'render_block', 'wp_render_layout_support_flag', 10, 2 );
Y si tienes Gutenberg activo:
remove_filter( 'render_block', 'gutenberg_render_layout_support_flag', 10, 2 );
Fuente de wp_render_layout_support_flag: https://github.com/WordPress/WordPress/blob/master/wp-includes/block-supports/layout.php#L142
-
No entiendo esta respuesta. Uso el estándar 2222 con la última versión de WordPress y veo estos estilos en línea generados. Eliminan algunos márgenes en mis imágenes y no tengo idea de cómo eliminarlos. Como no tengo un tema secundario, no puedo editar theme.json ni agregar filtros a una función.php. ¿Alguna idea de cómo eliminar los estilos? Ver el mismo problema aquí: wordpress.org/support/topic/…
– Marc
1 de marzo a las 16:12
-
El primero funcionó para mí: remove_filter(‘render_block’, ‘wp_render_layout_support_flag’, 10, 2); Estoy usando Gutenberg/el editor de bloques.
– Dan Brown
1 de marzo a las 17:23
-
remove_filter(‘render_block’, ‘wp_render_layout_support_flag’, 10, 2); destruye todo mi diseño en un tema vanilla 2022 con WP 5.9. No complementos. ¿De dónde viene este css?
– Marc
2 de marzo a las 14:41
-
Marc, tu pregunta y caso de uso es diferente del iniciador del hilo. Está preguntando cómo cambiar el margen de un solo bloque, mientras que esta pregunta se trata de eliminar los estilos.
– Carolina Nymark
3 de marzo a las 5:05
-
No, pregunto cómo eliminar los estilos en línea y de dónde vienen. Es exactamente el mismo problema.
– Marc
9 de marzo a las 8:58
¿Qué pasaría si apuntaras a la clase no dinámica? ¿Te gusta .wp-block-group?
–Manuel S.
17 de febrero a las 8:24
Mi sistema es similar a “Tailwindcss”. Para mis secciones/bloques por configuración, estoy agregando una clase como “.mt-y”, que agrega X rem padding-top. Entonces, la clase única está siendo anulada por .wp-container-620d404934f13> * + * {}. Una solución por ahora, veo que es reescribir el grupo y el bloque de contenido y simplemente dejar de usarlo.
– Łukasz Gorski
18 de febrero a las 10:32
Veo el mismo comportamiento extraño con veintidós y FSE. ¿Dónde deshabilitamos estos estilos y de dónde vienen? Me está volviendo loco porque no sé cómo desactivarlo. Los estilos eliminan mis márgenes en mis imágenes: wordpress.org/support/topic/…
– Marc
1 de marzo a las 16:10