web-dev-qa-db-fra.com

Ignorer la largeur maximale de l'image dans le thème (à l'aide de l'éditeur Gutenberg)

J'ai récemment installé Gutenberg plugin pour mon installation Wordpress. Le thème que j'utilise n'est pas en pleine largeur pour les publications. Il existe une option "Large" pour les images dans une publication, mais le thème ne permet pas à l'image de dépasser les règles du thème.

J'ai essayé cette solution (ajouter le support du thème) proposée par l'équipe de Gutenberg. Mais pas de chance.

add_theme_support( 'gutenberg', array(

// Theme supports wide images, galleries and videos.
'wide-images' => true,

// Make specific theme colors available in the editor.
'colors' => array(
    '#ffffff',
    '#000000',
    '#cccccc',
),

Que dois-je rechercher dans le code pour commencer à trouver une solution à cela?

Je vous remercie

add-theme-supportblock-editor
3
mox

add_theme_support('gutenberg', ['wide-images' => true ]) indique à gutenberg, hé, le CSS de cette zone de contenu de sites est configuré pour gérer des images larges. Le code theme_support Wide-Images n’est pas une solution miracle, c’est un accusé de réception du développeur du thème auprès de gutenberg, du fait que les thèmes CSS sont prêts pour le contenu étendu de gutenberg.

-

Si vous faites simplement des essais et souhaitez que les modifications CSS soient apportées aux pages qui utilisent gutenberg, vous pouvez utiliser un extrait de code comme celui-ci pour vérifier si la page est bien gutenberg:

add_action('body_class', function($classes){
    if (function_exists('the_gutenberg_project') && gutenberg_post_has_blocks( get_the_ID() ) )
        $classes[] = 'using-gutenberg';
    return $classes;
});

Vous pouvez mieux sélectionner vos éléments pour gutenberg uniquement, ce qui rend votre CSS semblable à

body.using-gutenberg #container.container {
    /* ..wtv full width css */
}

Si vous êtes curieux de savoir comment le contenu CSS est créé, par rapport à Gutenberg, consultez le gutenberg-starter-theme sur GitHub pour référence.

2
David Sword