le Deux Le module galerie est disponible en 2 tailles pour vos vignettes. Vous pouvez choisir entre le format paysage (400 x 284 pixels) et le format portrait (400 x 516 pixels). Dans ce tutoriel, je vais vous expliquer comment changer les tailles de vignettes de Divi Gallery pour votre site.

Tu vas apprendre:

  • Comment changer la vignette de la Divi Gallery de paysage en portrait
  • Comment créer une vignette carrée
  • Voici comment empêcher Divi de recadrer les miniatures de la galerie

Comment changer la vignette de la Divi Gallery de paysage en portrait

Celui-ci est facile à faire. Ouvrez votre module de galerie et passez à l’onglet Conception. Sous Disposition> Orientation des miniatures, passez à Portrait.

Changer la vignette de la Divi Gallery de paysage en portrait

Comment créer une vignette carrée

Le module de galerie n’inclut pas d’option pour une vignette carrée. Cependant, avec un peu de CSS, nous pouvons facilement y parvenir.

Vignettes carrées de la Divi Gallery

Ouvrez le module Galerie et passez à l’onglet Avancé. Placez la classe dans le champ CSS espace galerie mh.

Placer une classe CSS dans le module de la galerie Divi

Ensuite, allez dans Divi> Options du thème> CSS et placez l’extrait suivant:

.mh-gallery-square .et_pb_gallery_image {
  padding-top: 100%;
}

.mh-gallery-square .et_pb_gallery_item img {
  position: absolute;
  height: 100%;
  bottom: 0;
  object-fit: cover;
}

Voici comment empêcher Divi de recadrer les vignettes de la galerie

Les images miniatures de la galerie sont automatiquement recadrées par Divi. Nous pouvons désactiver cette fonctionnalité. Cela signifie que le rapport hauteur / largeur de la vignette sera utilisé.

Laisse-moi expliquer.

Si vous téléchargez une vignette de la galerie, cette image sera recadrée à 400 × 284. Cela correspond à un rapport hauteur / largeur de 100: 71. Si vous passez en orientation portrait, il est 400 × 516 avec un rapport hauteur / largeur de 100: 129.

Si nous désactivons la fonction de recadrage, nous pouvons télécharger n’importe quelle taille d’image sans être recadrée. Il est important que toutes les images de la galerie aient le même rapport hauteur / largeur. Par exemple, je téléchargerai une miniature de 400 × 267. Il s’agit d’un rapport hauteur / largeur de 3: 2. Toutes vos vignettes doivent alors avoir le même rapport hauteur / largeur, sinon une vignette aura une hauteur différente des autres vignettes de votre site. Il est donc normal d’avoir des tailles d’image différentes. Par exemple, vous pouvez également télécharger une image de 600 x 400 pixels. Il s’agit également d’un rapport hauteur / largeur de 3: 2.

Si vous voulez savoir quel rapport hauteur / largeur vous utilisez, voici ce que vous pouvez faire Calculateur de rapport hauteur / largeur Outil.

Ce code vous permettra d’empêcher Divi de recadrer les vignettes de la galerie. Collez-le dans le fichier function.php de votre sujet enfant. Suivez ce tutoriel Comment créer un thème enfant Divi vierge? créer un thème pour enfants.

function wpc_remove_height_cropping($height) {
	return '9999';
}
function wpc_remove_width_cropping($width) {
	return '9999';
}

add_filter( 'et_pb_gallery_image_height', 'wpc_remove_height_cropping' );
add_filter( 'et_pb_gallery_image_width', 'wpc_remove_width_cropping' );

Tu pourrais l’aimer aussi…



Source link

Recent Posts