Recadrer et redimensionner automatiquement thumbnails (image à la une) (Créer un compte)

  • Statut : non résolu
5 sujets de 1 à 5 (sur un total de 5)
  • Auteur
    Messages
  • #549082
    Miracle
    Participant
    Padawan WordPress
    77 contributions

    Bonjour,

    Ma configuration WP actuelle
    – Version de WordPress : 4.1.1
    – Version de PHP/MySQL : 5.1
    – Thème utilisé : Vertex (child)
    – Extensions en place :
    – Nom de l’hebergeur : OVH
    – Adresse du site : http://www.avocats-anstett-pavolini.com

    Problème(s) rencontré(s) :

    Je voudrais que les vignettes des articles sur la page Actualités (http://www.avocats-anstett-pavolini.com/actualites/) soient carrées. Ces vignettes correspondent à l’image à la une ou, à défaut, à la première image dans l’article.

    J’ai essayé de régler ça avec le CSS, en vain. Le code :

    .thumbnail:before {
    float:left;
    -moz-box-shadow: inset 0 0 8px rgba(0, 0, 0, 0.5);
    -webkit-box-shadow: inset 0 0 8px rgba(0, 0, 0, 0.5);
    box-shadow: inset 0 0 8px rgba(0, 0, 0, 0.5);
    content: «  »;
    top: 0; left: 0;
    width: 100%; height: 100%;
    }

    .thumbnail {
    margin: 7px 25px 30px 0;
    padding: 0;
    float: left;
    width: 14.1em;
    height: 14.1em;
    position: relative;
    }

    (J’ai essayé aussi avec « clip », sans plus de succès.)

    On m’a suggéré de créer une nouvelle taille d’image, avec redimensionnement à l’upload.

    add_image_size( ‘custom_size’, 200, 200, array( ‘center’, ‘center’ ) );

    J’ai consulté le Codex à ce sujet (https://codex.wordpress.org/Function_Reference/add_image_size) mais je n’arrive pas à tester cette solution car mes connaissances en PHP sont limitées et je ne sais où/comment intégrer cette ligne de code. 😳

    Je suppose que ça concernerait ce passage du fichier functions.php :

    function et_attach_bg_images() {
    $template_directory = get_template_directory_uri();
    $header_bg = et_get_option( ‘vertex_header_bg_image’, $template_directory . ‘/images/bg.jpg’ );

    if ( is_single() || is_page() || ‘project’ === get_post_type() && has_post_thumbnail() ) {
    if ( ( $et_custom_image = get_post_meta( get_the_ID(), ‘_et_single_bg_image’, true ) ) &&  » !== $et_custom_image ) {
    $header_bg = $et_custom_image;
    } else if ( has_post_thumbnail() ) {
    $image_attributes = wp_get_attachment_image_src( get_post_thumbnail_id( get_the_ID() ), ‘full’ );
    $header_bg = $image_attributes[0];
    }
    }

    Ne trouvant pas la solution, je pourrais me contenter de vignettes juste redimensionnées MAIS celles-ci, pour une raison que j’ignore, apparaissent recadrées de manière, pour moi, aléatoire (donc moche).

    Je n’ai pas eu plus de succès avec la méthode manuelle de recadrage des images à la une (dans les Médias).

    Quelqu’un aurait-il la bonté de m’aider ? Je sèche ! Merci d’avance.

    #1002555
    Miracle
    Participant
    Padawan WordPress
    77 contributions

    (mot de passe pour Actualités : chocolat) 😋

    #1002554
    Li-An
    Participant
    Maître WordPress
    28497 contributions

    Le codex sur les images à la une et les miniatures qui vont avec: https://codex.wordpress.org/Post_Thumbnails. Il y a de nombreux tutos pour les utiliser.

    Dans votre code

    add_image_size( ‘custom_size’, 200, 200, array( ‘center’, ‘center’ ) );

    array( ‘center’, ‘center’ ) n’a aucun sens pour moi.

    add_image_size( ‘carre’, 200, 200);

    suffira largement. À mettre dans le fichier functions.php juste en dessous de

    add_theme_support( ‘post-thumbnails’ );

    #1002556
    Li-An
    Participant
    Maître WordPress
    28497 contributions

    Remplacer la ligne

    $image_attributes = wp_get_attachment_image_src( get_post_thumbnail_id( get_the_ID() ), ‘full’ );

    par

    $image_attributes = wp_get_attachment_image_src( get_post_thumbnail_id( get_the_ID() ), ‘carre’ );

    et je pense que ça devrait le faire – vous devriez d’ailleurs utiliser un thème enfant pour ce genre de manip.

    #1002557
    Miracle
    Participant
    Padawan WordPress
    77 contributions

    Bonsoir et merci de votre réponse.

    J’ai testé votre proposition et cela aboutit à nouveau à un site totalement inaccessible (page blanche).

    J’utilise effectivement un thème enfant. Le problème peut-il venir de là ? Je procède comme suit :

    Je remplace ‘full’ par ‘carre’ dans functions.php (fichier du thème enfant).

    En revanche,

    add_theme_support( ‘post-thumbnails’ );

    se trouve dans un fichier post_thumbnails_vertex.php situé dans un sous-dossier du thème parent (dossier « epanel »).

    J’ai donc ajouté la ligne

    add_image_size( ‘carre’, 200, 200);

    dans une copie du fichier post_thumbnails_vertex.php que j’ai mise dans le dossier du thème enfant. J’ai essayé en le mettant à la racine de ce dossier ou dans un sous-dossier reproduisant l’architecture du thème parent : ça revient au même, page blanche, site HS.

    D’où cela peut-il venir ?
    Merci d’avance.

5 sujets de 1 à 5 (sur un total de 5)
  • Vous devez être connecté pour répondre à ce sujet.