Comment créer des galeries WordPress à l'aide des médias Google Drive

Les galeries sont l'une des parties les plus importantes d'un site Web car c'est le moyen le plus professionnel de montrer vos médias et de permettre à vos utilisateurs d'avoir une bonne expérience visuelle lors de la visite de votre site, on sait qu'il existe trop de façons de créer des galeries telles comme utiliser un plugin, mais qu'en est-il de les servir directement depuis le cloud ? Laissez-moi vous dire que c'est tout à fait possible avec WP Media Folder et vous verrez comment faire cela sur ce post ;)

 Connectez Google Drive à WordPress en vidéo

 Connecter Google Drive à votre site Web

La première étape de ce tutoriel consiste à connecter Google Drive à votre site et vous verrez à quel point c'est facile, tout d'abord, vous aurez besoin du Cloud Addon de WP Media Folder qui va vous permettre de connecter votre site avec Google Drive.

Maintenant que nous avons installé WP Media Folder et le Cloud Addon nous pouvons commencer la configuration. Pour cela, il existe deux options, manuelle et automatique , alors expliquons-les.

Pour démarrer la configuration, accédez à Paramètres> WP Media Folder > Cloud> Google Drive . Ici, vous pourrez sélectionner le type de lecteur :

• Personal Drive : votre compte personnel.
• Drive partagé : votre compte Gsuite.
  

Sélectionnez ensuite le type de lien pour vos images :

• Lien public : générez un lien public accessible pour vos fichiers et affectez les droits appropriés sur les fichiers cloud (Lien partagé). Par exemple : https://drive.google.com/uc?id=1Bq_VQt4z5Sy74Xg3IoN3KKWg4P7gymV1
• Lien privé : lien AJAX, masquez le lien cloud pour conserver le droit d'accès d'origine de votre fichier (les utilisateurs ont besoin d'un login pour voir les images).
  Par exemple : https://votredomaine.com/wp-admin/admin-ajax.php?action=wpmf-download-file&id=1Bq_VQt4z5Sy79Xg3IoN3KKWg4P7gymV1&dl=0

Et ensuite, procédez à la connexion :

Tout d'abord, pour utiliser cette fonctionnalité, vous devez lier votre compte Joomunited dans Menu Paramètres > Général , veuillez cliquer sur le lien des paramètres WordPress si vous n'êtes pas encore connecté.

Après cela, retournez dans Paramètres > WP Media Folder > Cloud > Google Drive , sélectionnez le Mode automatique , puis sur Connecter Google Drive .

Suivez les étapes pour connecter votre compte Google, et c'est tout, votre site est connecté :)

Vraiment facile et rapide, n'est-ce pas?

Mode manuel : tout d'abord, vous devez créer Google Dev APP pour la connecter à votre site, pour cela, allez ici et créez un Create Project .

Ensuite, sélectionnez le nom du projet et l'emplacement.

Si c'est la première fois que vous utilisez l' API Google Drive , accédez à APIs & Services > Library , recherchez l' API Google Drive et cliquez sur Enable .

Maintenant que vous l'avez activé, créons les clés pour connecter votre site WordPress allez à nouveau dans le menu de gauche et cliquez sur API & Services > Credentials .

Cliquez sur + Créer des informations d'identification > ID client OAuth , s'il le demande, veuillez ajouter un nom à votre écran de consentement OAuth.

Lors de l'application, vous pouvez sélectionner Application Web et ajouter un nom de votre choix, pour les autres paramètres, utilisez les éléments suivants :

• Origine JavaScript autorisée : https://votre-domaine.com (remplacez par votre nom de domaine, sans slash de fin)
• URI de redirection autorisés : https://votre-domaine.com/wp-admin/options-general.php?page=option-folder&task=wpmf&function=wpmf_authenticated
  (remplacer par votre nom de domaine)
  

Veuillez garder à l'esprit que si cet avertissement apparaît : "Pour créer un ID client OAuth, vous devez d'abord définir un nom de produit sur l'écran de consentement", vous devez cliquer sur le bouton Configurer l'écran de consentement ou aller dans APIs & Services >> Écran de consentement OAuth, puis ajoutez votre nom de domaine dans Domaines autorisés.

Tout d'abord, vous devrez sélectionner un type d'utilisateur .

Vous pouvez choisir entre :

• Interne : votre application est limitée aux utilisateurs G Suite au sein de votre organisation.
• Externe : votre application sera accessible à tout utilisateur disposant d'un compte Google.
  

Dans une dernière étape, allez dans Paramètres> WP Media Folder > Cloud> Google Drive et sélectionnez le mode manuel, dans cet écran, vous verrez l'option d'ajouter le secret client et l'ID client, donc fondamentalement, collez-les là et cliquez sur Connecter Google Drive .

Autorisez WP Media Folder à accéder à l'APP et c'est tout !
Vous aurez le compte Google connecté !

 Créons des galeries cloud WordPress

Maintenant que nous avons connecté Google Drive à notre médiathèque, la connexion fonctionnera très simplement, elle générera un dossier racine dans votre compte Google Drive et tous les médias/dossiers qui y seront ajoutés apparaîtront sur votre médiathèque sous les dossiers Google Drive, et tous les médias/dossiers ajoutés à votre médiathèque ajoutés sous les dossiers Google Drive apparaîtront sur votre compte Google Drive.

Commençons donc par la création de la galerie, pour cela, allez dans votre médiathèque > Google Drive et vous pouvez ajouter un nouveau dossier pour garder les choses organisées, par exemple, nous en ajoutons un nouveau appelé Galerie à utiliser sur ce tutoriel.

Téléchargez les images là-bas et vous les verrez reflétées sur Google Drive.

Et passons à la partie la plus amusante, créez les galeries ! Pour cela, allez dans Article/Page > Ajouter un nouveau (ou modifiez-en un déjà créé).

Nous utiliserons l'éditeur Gutenberg dans ce cas, mais vous pouvez utiliser n'importe quel autre générateur de pages car ils sont tous compatibles avec WP Media Folder ;)

Maintenant que nous sommes ici, cliquez sur + > WP Media Folder Gallery .

Cela vous montrera tous les dossiers disponibles, y compris ceux de Google Drive, nous sélectionnerons celui que nous avons créé appelé Galerie , puis cliquez sur Créer une galerie .

Vous verrez un aperçu du thème, vous pouvez le modifier dans le panneau de droite.

Aperçus du thème :

Défaut

Masonry

Portefeuille

Glissière

Comme vous pouvez le voir, c'est aussi simple que de sélectionner les images, le thème et de le publier, il existe d'autres options pour que vous puissiez ajuster les galeries comme vous le souhaitez, comme l'ordre, l'action au clic et la taille de la Lightbox.

Vous pouvez confirmer sur votre serveur que les images n'existeront pas car elles ne sont hébergées que sur Google Drive ;)

 Utiliser le module complémentaire Gallery pour créer des galeries professionnelles

L'autre option lorsque vous souhaitez créer des galeries consiste à utiliser le module complémentaire de
la galerie , ce module complémentaire génial vous offre plus de thèmes de galerie et d'options pour les modifier avec une interface pour les personnaliser avant d'être publiés.

Vous pouvez le trouver en allant dans Média > Galeries de dossiers multimédias , sur cet écran, cliquez sur +Ajouter une nouvelle galerie et configurez les options de la galerie, vous pouvez sélectionner un nom pour la galerie et également sélectionner le thème de la galerie que vous allez utiliser.

Choisissez le nom, le niveau de la galerie, le thème de la galerie, puis cliquez sur Créer .

Maintenant, ici vous pouvez voir toutes les options disponibles pour ajouter des images, pour ce cas où nous allons utiliser l'addon Google Drive, sélectionnez l'icône WordPress.

Cela ouvrira la médiathèque , nous allons sélectionner le dossier Google Drive que nous avons créé auparavant, dans ce cas, appelé Galerie , et sélectionner toutes les images que vous souhaitez ajouter à la galerie, enfin, cliquez sur Importer .

Vous verrez les images sur cet écran afin que vous puissiez réorganiser, définir une image comme couverture ou modifier les paramètres d'une image spécifique, des choses comme le nom alternatif et le titre :)

Alors maintenant, tout ce que nous avons à faire est de choisir la galerie, de l'adapter à votre contenu, de confirmer votre galerie avec l'aperçu et de l'enregistrer !

Dans les paramètres d'affichage et le code court , vous pouvez définir :

• Thème
• Taille de l'image de la galerie
• Taille de la visionneuse
• Action au clic (ouvrir une nouvelle page ou une lightbox)
• Colonnes
• Ordre
• Paramètres de navigation (comme la taille des boutons et des boutons)

Vous pouvez également copier le shortcode à partir de cet écran si vous souhaitez l'utiliser à la place du bloc prédéfini pour chaque Page Builder.

Maintenant, la dernière étape consiste à prévisualiser la galerie pour confirmer que tout va bien, cela peut être fait dans le troisième onglet appelé Aperçu .

Les thèmes supplémentaires disponibles avec l'addon sont les suivants :

Glissière d'écoulement

Grille carrée

Matériel

Maintenant que vous avez sélectionné le thème et terminé la configuration, vous pouvez procéder à la publication de la galerie. Pour cela, accédez à votre article/page et modifiez-le, pour l'éditeur Gutenberg, puis cliquez sur + > WPMF Gallery Addon.

Cliquez sur Sélectionner ou créer une galerie , cela chargera le tableau de bord du module complémentaire de la galerie afin que vous puissiez sélectionner la galerie, ou également en créer une nouvelle directement à partir de là, vérifiez l'aperçu, puis cliquez sur Insérer .

Alors maintenant, insérez votre galerie et enfin, publiez-la ! Comme vous pouvez le voir, l'Addon Gallery vous offre plus de possibilités que les galeries normales, c'est comme passer au niveau suivant :)

 Créez votre premier Google Drive Galleri dans WordPress

Ce n'est qu'une des fonctionnalités impressionnantes que l'on peut trouver avec l' WP Media Folder , il y en a bien d'autres comme l'ajout de vidéos distantes à partir de services de streaming !

Comme vous avez pu le voir dans l'article, c'est un article vraiment facile à utiliser et utile pour passer au niveau supérieur avec votre site Web ! Alors qu'est-ce que tu attends? Allez ici et obtenez votre adhésion maintenant!