Comment insérer une galerie de photos dans une page ou blog wordpress

Vous pouvez utiliser la page WordPress Insérer média à insérer une galerie complète de photos dans vos pages (ou messages). Suivez ces étapes pour insérer une galerie de photos dans une page (ou post):

  1. Sur la page (ou post) dans lequel vous souhaitez insérer une galerie, télécharger vos images.

  2. Sur le Ajouter une nouvelle page (ou Ajouter nouveau post), cliquez sur le bouton Ajouter médias.

    La boîte de dialogue Insérer un média apparaît.

  3. Cliquez sur le lien Galerie sur le côté gauche de la boîte de dialogue Insérer Media Create.

    L'onglet Galerie apparaît uniquement pour les postes ou les pages qui ont un ou plusieurs images téléchargées.

    Cet onglet affiche les vignettes de toutes les images que vous avez téléchargées sur votre page (ou post).

    image0.jpg
  4. Cliquez sur le bouton Nouveau Galerie de Créer.

    Cette étape ouvre la page Modifier Galerie, où vous pouvez glisser et déposer les images pour déterminer l'ordre dans lequel ils doivent apparaître sur votre site.

  5. Dans la section Paramètres de la galerie, définir les options d'affichage de votre galerie:

    • Lié à: Sélectionnez fichier numérique (le fichier d'image physique) ou l'attachement Page (une page qui affiche uniquement l'image elle-même).

    • Ordre aléatoire: Sélectionnez cette option pour faire apparaître les images dans un ordre aléatoire.

    • Colonnes: Sélectionnez le nombre de colonnes d'images que vous voulez afficher dans votre galerie.

    • Cliquez sur le bouton Insérer Galerie au bas de la boîte de dialogue.

      WordPress rendements à l'Ajouter une nouvelle page (ou Ajouter nouveau post) page. Vous pouvez voir que WordPress a inséré dans votre page (ou post) un morceau de court code (un extrait de code que WordPress utilise pour exécuter certaines fonctions, telles que l'affichage de la galerie) qui ressemble à ceci:

      [Galerie]



      Note: Vous devez passer à l'affichage HTML (cliquez sur l'onglet HTML) pour voir ce code.

    • (Facultatif) Dans la page (ou Post) boîte d'édition en mode HTML, vous pouvez modifier l'ordre d'apparition des images dans la galerie, ainsi que le balisage (balises HTML ou des sélecteurs CSS), en entrant le code courte suivante:

      captiontag: Change le balisage qui entoure la légende de l'image en modifiant le code court de la galerie. Par example,

      [Galerie captiontag = "div"]

      lieux

      balises autour de la légende de l'image. (La
      tag, qui est considéré comme un élément de niveau bloc, crée un récipient séparé pour le contenu.)

      Pour avoir la galerie apparaître sur une ligne de son propre, utilisez le code suivant:

      [Galerie captiontag = "p"]

      Ce code lieux

      balises autour de la légende de l'image. Le balisage par défaut pour le captiontag sélectionnez dd.

      icontag: Définit le balisage HTML autour de chaque image individuelle des vignettes dans votre galerie. Changer le balisage autour de la icontag (icône miniature) de l'image en modifiant le code court de la galerie pour ressembler à quelque chose comme ceci:

      [Galerie icontag = "p"]

      Ce code lieux

      balises autour de chaque icône miniature. Le balisage par défaut pour icontag est dt.

      itemtag: Définit le balisage HTML autour de chaque article dans votre galerie. Changer le balisage autour de la itemtag (chaque élément) dans la galerie en modifiant le code court de la galerie pour ressembler à quelque chose comme ceci:

      [Galerie itemtag = "span"]

      Ce code lieux balises autour de chaque élément dans la galerie. Le balisage par défaut pour le itemtag est dl.

      commandé par: Définit l'ordre que les images présentent au sein de votre galerie. Changer l'ordre utilisé pour afficher les vignettes dans la galerie en modifiant le code court de la galerie pour ressembler à quelque chose comme ceci:

      [Galerie orderby = "ASC menu_order"]

      Ce code affiche les vignettes dans l'ordre croissant de menu. Un autre paramètre, vous pouvez utiliser est Id_order ASC, qui affiche les vignettes dans l'ordre croissant en fonction de leurs cartes d'identité.

    • Lorsque vous avez terminé, cliquez sur le bouton Aperçu pour prévisualiser votre Modifications- Lorsque vous êtes satisfait, cliquez sur le bouton Publier pour publier votre page.

      Code Gallery CourtProduction
      [gallery columns = "4" size = "medium"]Une galerie à quatre colonnes contenant des images de taille moyenne
      [gallery columns = id "10" = "215" size = ” thumbnail ”]Une galerie de dix colonne contenant des images miniatures tiré fromthe blog avec l'ID 215
      [Galerie captiontag = "p" icontag = "span"]A trois colonnes (par défaut) la galerie dans laquelle chaque image issurrounded par tags et la légende de l'image est entouré par les balises

    Suivez ces étapes pour modifier la feuille de style pour votre thème pour inclure les styles de galerie dans le CSS:

    1. Du tableau de bord, choisissez apparence Thèmes-Editor et puis ouvrez votre feuille de style CSS.

    2. Définir le style de la tags dans votre feuille de style.

      La Tags Créez un élément en ligne. Un élément contenu dans un tag reste sur la même ligne que l'élément avant it- il n'y a aucun saut de ligne. Vous avez besoin d'un peu de connaissance de CSS pour modifier la balises. Voici un exemple de ce que vous pouvez ajouter à la feuille de style (style.css) Pour votre thème actuel pour définir le style de la tags:

      span.gallery-icon img {padding: 3px; fond: blanc-border: 1px solid black-margin: 0 5px;}

      Placer ce peu de CSS dans la feuille de style (style.css) De votre thème actif place automatiquement une bordure noire de 1 pixel autour de chaque vignette, avec 3 pixels de remplissage et un fond blanc. Les marges gauche et droite sont 5 pixels de large, la création d'agréable espacement entre les images de la galerie.

    3. Cliquez sur le bouton de mise à jour du fichier pour enregistrer les modifications à votre feuille de style (style.css) Modèle.

    Voici une galerie photo en utilisant les étapes précédentes et l'exemple de CSS dans le mille treize thème par défaut. Voici le code court de la galerie:

    image1.jpg
    [Galerie icontag = "span" size = "vignette"]

    Matt Mullenweg, un co-fondateur de la plate-forme WordPress, créé une vaste galerie de photos en utilisant les options de galerie intégrés dans WordPress.

    Certains plugins WordPress utiles travaillent en tandem avec la galerie fonction WordPress.


    » » » » Comment insérer une galerie de photos dans une page ou blog wordpress