• [CSS] Modifier le rendu de la galerie

    Bonjour,

    Un petit article pour la mise en forme des images des galeries d'images.

    Pour information, les galeries d'images dans Eklablog sont gérées par cerabox.

    Sur clic sur une image de la galerie, l'image s'affiche dans un élément div d'identifiant « cerabox ».

    [CSS] Modifier le rendu de la galerie
    Affichage des images d'une galerie

    Non visible sur ce schéma : un élement « div » de classe « cerabox-content-protection » qui recouvre l'image.

    Pour modifier le rendu, le code CSS  est à écrire dans « Apparence » => « Modifier le thème » => « Ajouter du CSS ».

    Ajouter « !important » à chaque attribut pour forcer sa priorité.

    Par exemple :

    Pour afficher la légende sous l'image et non pas dessus :
    .cerabox-title { position:relative !important;}

    Le fond du blog est opaque à 50%, il est possible d'augmenter l'opacité (0.9 dans l'exemple, doit être compris entre 0 et 1) :
    #cerabox-background {opacity:0.9 !important;}

    On peut également ajouter des bordures :
    .cerabox-content { border:4px solid black !important; }
    .cerabox-title { border:2px solid black !important; }

    Pour « protéger » les images (la protection est sommaire et empêche juste le click droit => enregistrer sous) :
    .cerabox-content-protection { display:block !important;}
     

     

    « [QUIZ] Insérer des quiz dans Eklablog

  • Commentaires

    1
    Mercredi 26 Janvier 2022 à 17:07

    ah oui avec toi on en apprend  toujours ,  je ne fais pas beaucoup de galerie  ! mais j'essaierais je pense 

    merci Gilbert  belle soirée a+ 

    Suivre le flux RSS des commentaires


    Ajouter un commentaire

    Nom / Pseudo :

    E-mail (facultatif) :

    Site Web (facultatif) :

    Commentaire :