Habituellement, les gens utilisent des plugins comme NextGen Gallery pour obtenir cet effet. En plus d'utiliser des plug-ins tiers, vous pouvez également utiliser les propres fonctions de WordPress pour obtenir le même effet. Mais avant cela, nous devons avoir une certaine compréhension de WordPress et du HTML/CSS.
Effet final de l'album photo
Avant de commencer, déterminons l'effet final :
Lorsque l'utilisateur clique sur la page de l'album, la page affiche différentes couvertures dans une grille pour représenter les albums des différents mois. Chaque mois, nous créons un album photo contenant toutes les photos de ce mois.
Si l'utilisateur clique sur la couverture de l'album, il verra une page exclusive pour l'album, où vous pourrez écrire quelques informations de base et lister toutes les photos de l'album.
Si les utilisateurs cliquent sur une photo individuelle, ils peuvent accéder à la page propre à chaque photo, où ils peuvent voir le titre de chaque photo, des informations sur la personne qui l'a prise et des liens associés.
Si l'ensemble du site Web est utilisé pour afficher des albums photo, vous pouvez utiliser le format de publication par défaut. Mais si vous avez toujours un blog, vous devez utiliser un type de publication personnalisé.
Créons un album photo
Vous devez d'abord créer un plug-in spécifique au site Web (ou même un plug-in spécifique au projet).
Si vous souhaitez utiliser une publication personnalisée, vous devez générer un code et le coller dans le plug-in dédié du site.
Afin de créer un effet de grille, vous devez ensuite définir la taille de l'image jointe dans WordPress.
Par exemple : après avoir défini la taille de l'image, nous devons également ajouter des champs au répertoire de téléchargement multimédia. De cette façon, vous pouvez télécharger chaque image avec le nom du photographe et son URL.
Une fois cette étape terminée, nous pouvons continuer à ajouter des albums photos. Téléchargez toutes les photos que vous souhaitez ajouter à l'album. Ensuite, attachez une autre couverture photo et faites-en l'image principale. Vous pouvez rédiger des informations générales dans la colonne de contenu de la publication.
Maintenant que vous avez ajouté plusieurs albums photo en arrière-plan, nous pouvons ajouter du code pour le faire fonctionner. En supposant que votre type de publication personnalisé s'appelle albums, vous créerez un nouveau dossier de modèles appelé archive-albums.php. Collez l'en-tête et le pied de page, la barre latérale et d'autres éléments de conception souhaités, puis créez une nouvelle boucle de publication.
Dans ce PL, nous listerons toutes les pièces jointes dans le même article, mais n'inclurons pas les vignettes qui sont liées par un hyperlien vers une seule page.
Nous ajouterons également la vignette de la publication principale (c'est-à-dire la couverture de l'album), puis la lierons par hypertexte à une seule page de publication (c'est-à-dire la page de l'album).
Nous allons utiliser une méthode de liste pour créer des images de grille. Ce programme est comme ceci :
Pour le style CSS principal, ce que tout le monde doit vraiment prendre en compte, c'est la classification de la grille des albums afin que nous puissions placer chaque image à la position appropriée dans la grille pour obtenir le style souhaité.
Ensuite, vous devez créer un nouveau modèle pour une seule pièce jointe. Ce sera la page que les utilisateurs verront à l’avenir afin qu’ils puissent voir chaque image. Ici, les utilisateurs verront le titre de l'image, le nom du photographe et leur lien. Chacun est libre d’ajuster les modèles individuels à sa guise.
Il reste maintenant une dernière chose à faire. En supposant que votre type de publication personnalisé s'appelle album, vous devez créer un nouveau fichier single-albums.php et ajouter tous les en-têtes, queues, barres d'outils ou autres éléments de conception de votre choix. tous.
Effectuez essentiellement le même traitement dans l'élément de boucle que dans le modèle d'album d'archive. Mais avant d'ajouter l'image principale et les pièces jointes, vous devez également ajouter un titre et une description de l'album. Cette étape peut être effectuée en ajoutant du code, comme ceci :
D'accord ! Vous avez terminé!
Comment WordPress génère automatiquement de véritables paramètres de page statiques :
La méthode est très simple. Il vous suffit de télécharger et d'installer un plug-in wordpress appelé cos-html-cache.
COS-HTML-Cache est un plugin de mise en cache de pages WordPress très efficace qui rend les sites Web WordPress plus réactifs. Basé sur la réécriture d'URL, le plug-in générera automatiquement de vrais fichiers HTML lorsqu'un utilisateur ou un robot de moteur de recherche visite votre page pseudo-statique, le plug-in mettra automatiquement à jour le fichier HTML et les modifications d'article associées.
Vous pouvez sélectionner Plug-in>Installer le plug-in dans le backend WordPress, saisir cos-html-cache et rechercher l'installation, et enfin l'activer. Ou accédez au site Web WordPress pour télécharger le package compressé cos-html-cache, décompressez-le et téléchargez-le dans le répertoire /wp-content/plugins/ à l'aide de FTP, puis activez-le en arrière-plan.
Une fois que le plug-in est installé avec succès et prend effet, il ne générera pas de fichiers statiques HTML immédiatement. Il générera ou mettra à jour automatiquement les fichiers HTML la prochaine fois qu'un utilisateur entrera ou qu'une araignée visitera. Si vous souhaitez générer rapidement un fichier HTML et voir l'effet, vous pouvez utiliser la détection de liens morts dans les outils pour les webmasters et imiter une araignée pour visiter votre site Web.
Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!
![[Web front-end] Démarrage rapide de Node.js](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
