Imprimer la Page | Fermez la fenêtre

nanogallery2 avec images entreposées chez Google

Imprimé depuis: Forum openElement
Categorie:

openElement


Nom du Forum: Tutoriaux utilisateurs
Description du Forum: Ecrivez ou consultez des tutoriaux OpenElement
Pas de questions dans cette rubrique merci.
URL: https://forums.openelement.uk/fr/forum_posts.asp?TID=22618
Date: 19 Avr 2024 à 15:09
Version logiciel: Web Wiz Forums 12.04 - http://www.webwizforums.com


Sujet: nanogallery2 avec images entreposées chez Google
Posté par: Hobby001
Sujet: nanogallery2 avec images entreposées chez Google
Posté le: 10 Mar 2017 à 14:17
Ce tutoriel ne fonctionne plus à cause de changements chez Google,  leur gestion 
des applications étant constamment modifiée et en développement.


nanogallery2

http://nanogallery2.nanostudio.org/" rel="nofollow - Application créée par http://forum.openelement.com/fr/member_profile.asp?PF=10010" rel="nofollow -
Depuis le 9 février 2017, pour des raisons évidentes, Google Photos ne peut plus être consulté sans l'autorisation explicite du propriétaire du compte.  L'autorisation permanente n'est possible que pour les applications côté serveur.

Pour répondre à cet état de fait, l'auteur de nanogallery2 a développé une méthode et un outil côté serveur.  Il s'agit de nanogp.

nanogp

http://github.com/nanostudio-org/nanogp" rel="nofollow -
L'application nanogp écrite en php ne fonctionne qu'à partir de votre hébergement. Donc la galerie de photos ne fonctionnera pas en mode de pré-visualisation.

Voici donc une traduction libre de la marche à suivre pour configurer votre compte Google+ et pour utiliser nanoGALLERY2 avec OpenElement.

  1. Téléchargez l'application, vous obtiendrez un fichier nommé: nanogp-master.zip.
  2. Copiez le dossier nanogp-master.zip\nanogp-master\dist à la racine de votre site.
  3. Dans le répertoire \dist\admin vous trouverez le fichier config.php à l'intérieur duquel il faut renseigner les variables $cfg_client_id et $cfg_client_secret.

Maintenant que vous avez l'application serveur pour diffuser vos photos, cette dernière doit être autorisée à leur accéder.

Autorisation d'accès Google

  1. Connectez à la console google avec le compte possédant les photos visées

    http://console.developers.google.com/iam-admin/projects" rel="nofollow - Créez un projet




  2. Donnez-lui un nom significatif



    Le projet est maintenant créé



  3. Accédez à la bibliothèque des API
    http://console.developers.google.com/apis" rel="nofollow -


  4. Créez un identifiant



  5. Renseignez l'identifiant




  6. Vous obtiendrez alors les deux clés requises pour renseigner les variables $cfg_client_id et $cfg_client_secret du fichier  \dist\admin\config.php



    <?php
    $cfg_client_id          = 'Votre ID client';
    $cfg_client_secret      = 'Votre code secret client';
    $cfg_application_name   = 'nanogallery2gp';
    $cfg_max_accounts       = 1;
    $cfg_log                = false;
    ?>



  7. C'est maintenant le temps de valider que tout a bien fonctionné.  Mettez votre projet en ligne puis accédez à la page http://www.mondomaine.com/nanogp/authorize.php avec votre fureteur favori.

    Vous verrez apparaître une demande de confirmation que vous vous empresserez d'approuver.



    Si vous avez bien suivi les instructions vous aurez cette joyeuse confirmation de la part de Google.

nanogallery2

Nous y sommes enfin, vous pouvez installer nanogallery2

Tout d'abord téléchargez l'application du site de l'auteur:  http://nanogallery2.nanostudio.org/" rel="nofollow -

Créez un dossier nanogallery2 à la racine de votre site et copiez-y le contenu du dossier 
nanogallery2-1.1.0.zip\nanogallery2-1.1.0\dist inclus dans le fichier téléchargé.

Dans OpenElement, ouvrez la page qui affichera la galerie.

Insérez un bloc de code HTML en position header et ajoutez-y le bloc de code suivant:

<link href="nanogallery2/css/nanogallery2.min.css" rel="stylesheet" type="text/css">
<script type="text/javascript" src="nanogallery2/jquery.nanogallery2.min.js"></script>


Sur votre page WEB.

Insérez un panneau d'éléments.
Donnez-lui la largeur désirée, un pourcentage de la largeur de l'écran pour être responsive.
Mettez la hauteur:auto.
Insérez et centrez un bloc de code visuel de largeur 100% dans lequel vous ajouterez le code suivant:


<div id=mynanogalery4 data-nanogallery2='{
"userID": "1XXXXXXXXXXXXXXXXX6",
"kind": "google2",
"google2URL": "http://www.MonDomaine.com/nanogp/nanogp.php",
"albumList2": ["Essai","Gaspésie Rocher Percé et île Bonaventure","Essai partage", "test deux", "test 3", "Test nano galerie"],
"breadcrumbAutoHideTopLevel": false,
"thumbnailHeight":200,
"thumbnailWidth": "auto",
"thumbnailHoverEffect2": "scale120|labelAppear"
}' >
</div>

Notes:
  1. Votre UserID est disponible dans l'URL affiché quand vous cliquez sur profil dans Google+.  Si vous ne vous y retrouvez pas: https://www.youtube.com/watch?v=dkPHxRDp9wY" rel="nofollow - La liste des albums est celle des albums auxquels vous désirez donner accès.
  2. Pour plus d'options ou pour personnaliser votre affichage référez-vous au site de l'auteur de http://nanogallery2.nanostudio.org/" rel="nofollow -
    Si vous utilisez, disons une largeur de 80% de l'écran, il serait judicieux d'utiliser les "media queries" pour l'ajuster à 100% sur les petits appareils.




Version originale du tuto 10 mars 2017 par Hobby001
Détails sur le panneau d'éléments contenant la galerie. 06  juin 2017 par Hobby001
Changement d'URL pour nanogp





-------------
https://denislafrance.net" rel="nofollow - https://denislafrance.net https://www.youtube.com/playlist?list=PLWg7A6YtIr7VtnP3HvRpMhx8tFJET_fih" rel="nofollow - , Formation vidéo sur OE



Réponses:
Posté par: brolysan
Posté le: 15 Avr 2017 à 14:05
Très clair Hobby001, top même je dirais. Clap

-------------
https://sensode.com" rel="nofollow - Sensode
https://www.creads.fr/blog/graphiste-freelance2/parole-de-brolysan-45-ans-graphiste" rel="nofollow - Biographie


Posté par: Maurice306
Posté le: 16 Avr 2017 à 09:26
Tout ça me parait très intéressant et facile à mettre en oeuvre expliqué de la sorte Thumbs Up

Merci Hobby001 Beer


-------------
La vie est belle !!!....., elle est comme chacun se la fait. Ne soyez pas pressé, partez plus tôt, car il n'y a pas de personnes pressée elles ne sont qu'en retard !!!


Posté par: Bridet
Posté le: 16 Avr 2017 à 09:46
Il y a un petit truc qui m'échappe, je n'ai rien changé depuis février et mon album est toujours visible sur mon site.


-------------
http://accessit.be" rel="nofollow - Les Billets d'une Bobonne Bougonne - http://gite.vervoz.be" rel="nofollow - Gîte Le Vicus


Posté par: Hobby001
Posté le: 16 Avr 2017 à 15:15
Message posté par Bridet Bridet a écrit:

Il y a un petit truc qui m'échappe, je n'ai rien changé depuis février et mon album est toujours visible sur mon site.

En fait ce qui fonctionnait avant, fonctionne toujours.  Les droits déjà accordés restent accordés.

Ce tuto fonctionne pour les nouvelles installations.




Posté par: Hobby001
Posté le: 06 Juin 2017 à 12:44
Ajout de détails sur le panneau d'éléments contenant la galerie dans le http://forum.openelement.com/fr/forum_posts.asp?TID=22618&PID=152150&title=nanogallery2-avec-images-entreposes-chez-google" rel="nofollow - tuto

-------------
https://denislafrance.net" rel="nofollow - https://denislafrance.net https://www.youtube.com/playlist?list=PLWg7A6YtIr7VtnP3HvRpMhx8tFJET_fih" rel="nofollow - , Formation vidéo sur OE


Posté par: jjb1
Posté le: 10 Juil 2017 à 14:23
Bonjour Hobby001,
J'essaie la nouvelle procédure de google+.
Au début du tuto, vous indiquez :
  1. Téléchargez l'application, vous obtiendrez un fichier nommé: nanogp-master.zip.
Je ne trouve pas ce téléchargement.
Je me suis donc servi du répertoire nanogp que j'avais installé avec la version "nanogallery" antérieure.
Par ailleurs, lorsque je lance en ligne ma page d'album, j'ai un message d'erreur suivant :
"nanogallery2: error: no image to process. [mynanogalery4]".

Merci d'avance de votre aide.


-------------
http://prod.chasse-autreches.xyz" rel="nofollow - Mon site-(1.57 R9)


Posté par: Hobby001
Posté le: 10 Juil 2017 à 14:29
Je vérifie pour nanogp.

Assurez-vous de bien transférer vos images avec FileZilla ou avec l'utilitaire de OE.  Attention, elles ne seront pas transférées automatiquement parce qu'elles ne sont pas incluses dans un élément "Image" d'OE.

Erreur de ma part j'ai répondu trop vite pour les photos


-------------
https://denislafrance.net" rel="nofollow - https://denislafrance.net https://www.youtube.com/playlist?list=PLWg7A6YtIr7VtnP3HvRpMhx8tFJET_fih" rel="nofollow - , Formation vidéo sur OE


Posté par: Hobby001
Posté le: 10 Juil 2017 à 14:32
Nanogp est disponible sur  https://github.com/nanostudio-org/nanogp" rel="nofollow - https://github.com/nanostudio-org/nanogp

-------------
https://denislafrance.net" rel="nofollow - https://denislafrance.net https://www.youtube.com/playlist?list=PLWg7A6YtIr7VtnP3HvRpMhx8tFJET_fih" rel="nofollow - , Formation vidéo sur OE


Posté par: Hobby001
Posté le: 10 Juil 2017 à 14:37
Attention, l'auteur y a ajouté une mise en garde concernant la nécessité d'utiliser un compte Google dédié pour des raisons de sécurité.

-------------
https://denislafrance.net" rel="nofollow - https://denislafrance.net https://www.youtube.com/playlist?list=PLWg7A6YtIr7VtnP3HvRpMhx8tFJET_fih" rel="nofollow - , Formation vidéo sur OE


Posté par: Hobby001
Posté le: 10 Juil 2017 à 14:43
Message posté par jjb1 jjb1 a écrit:


Par ailleurs, lorsque je lance en ligne ma page d'album, j'ai un message d'erreur suivant :
"nanogallery2: error: no image to process. [mynanogalery4]".


Est-ce que ça fonctionne en local?


-------------
https://denislafrance.net" rel="nofollow - https://denislafrance.net https://www.youtube.com/playlist?list=PLWg7A6YtIr7VtnP3HvRpMhx8tFJET_fih" rel="nofollow - , Formation vidéo sur OE


Posté par: jjb1
Posté le: 10 Juil 2017 à 16:46
Non, cela ne fonctionne pas en local non plus.
J'ai vu pour télécharger nanogp.
Je pense avoir bien complété les ID et code secret.
Je ne comprend pas bien comment on indique un album dan le bloc visuel ; faut-il mettre le nom de l'album, ou faut-il récupérer un ID quelque part.

Les sources d'erreur sont innombrables dans cette nouvelle procédure.
Merci d'avance de votre aide.


-------------
http://prod.chasse-autreches.xyz" rel="nofollow - Mon site-(1.57 R9)


Posté par: jjb1
Posté le: 10 Juil 2017 à 19:09
J'ai recréé un projet dans "console.developers.google.com" et j'ai remis à jour le fichier "config.php".

Mon bloc de code visuel dans OE se présente comme cela :
<div id=mynanogalery4 data-nanogallery2='{
"userID": "1... ...7",
"kind": "google2",
"google2URL": "http://test-v3.chasse-autreches.xyz/nanogp/nanogp.php",
"album":["2017-02-12"]
"breadcrumbAutoHideTopLevel": false,
"thumbnailHeight":200,
"thumbnailWidth": "auto",
"thumbnailHoverEffect2": "scale120|labelAppear"
}' >
</div>
J'ai toujours ce message d'erreur : "nanogallery2: error: no image to process. [mynanogalery4]".

J'ai de gros doutes sur la syntaxe d'identification de mon album photos



-------------
http://prod.chasse-autreches.xyz" rel="nofollow - Mon site-(1.57 R9)


Posté par: Hobby001
Posté le: 11 Juil 2017 à 13:41
Je regarde ça d'ici la fin de la semaine

-------------
https://denislafrance.net" rel="nofollow - https://denislafrance.net https://www.youtube.com/playlist?list=PLWg7A6YtIr7VtnP3HvRpMhx8tFJET_fih" rel="nofollow - , Formation vidéo sur OE


Posté par: jjb1
Posté le: 11 Juil 2017 à 19:42
Merci d'avance, de plus, il n'y a pas le feu.

Information : mon site n'est pas directement à la racine, mais dans un répertoire (/dev en l'occurrence).
C'est dans ce répertoire que j'ai copié nanogallery2 et nanogp.



-------------
http://prod.chasse-autreches.xyz" rel="nofollow - Mon site-(1.57 R9)


Posté par: Hobby001
Posté le: 13 Juil 2017 à 00:23
Impossible de refaire fonctionner ce tutoriel suite à des changements chez Google+.

Leur gestion des applications est en constant développement et change régulièrement.




-------------
https://denislafrance.net" rel="nofollow - https://denislafrance.net https://www.youtube.com/playlist?list=PLWg7A6YtIr7VtnP3HvRpMhx8tFJET_fih" rel="nofollow - , Formation vidéo sur OE


Posté par: jjb1
Posté le: 13 Juil 2017 à 23:29
Merci Hobby001.
Cette fois, c'est définitif, j'abandonne Google+.
C'était la deuxième tentative, mais il n'y en aura pas trois.
J'opte pour la solution FlickR moins chi....te (pour le moment).

Désolé du dérangement, et encore merci pour le temps passé.


-------------
http://prod.chasse-autreches.xyz" rel="nofollow - Mon site-(1.57 R9)


Posté par: Hobby001
Posté le: 14 Juil 2017 à 12:54
Tant que Google ne stabilisera ni ne démocratisera pas son produit, je n'y travaillerai plus.  

De plus, la solution de Google vis de plus en plus les entreprises et risque de devenir payante alors...

La seule bonne nouvelle c'est que les droits déjà octroyés restent actifs.


-------------
https://denislafrance.net" rel="nofollow - https://denislafrance.net https://www.youtube.com/playlist?list=PLWg7A6YtIr7VtnP3HvRpMhx8tFJET_fih" rel="nofollow - , Formation vidéo sur OE


Posté par: jjb1
Posté le: 15 Juil 2017 à 09:49
Message posté par Hobby001 Hobby001 a écrit:

La seule bonne nouvelle c'est que les droits déjà octroyés restent actifs.
Pourvou qué ça dourrre !!!

Les monopoles et la dictature font souvent bon ménage.

Que cette aventure nous serve de leçon.


-------------
http://prod.chasse-autreches.xyz" rel="nofollow - Mon site-(1.57 R9)


Posté par: jjb1
Posté le: 13 Dec 2018 à 16:14
Bonjour à tous, et particulièrement à Hobby001 s'il est dans le coin,
Je reviens sur son tutoriel qui semble toujours d'actualité si j'en crois les sites Nanogallery de Christophe Bribois, que je ne parviens pas à joindre.
Dans le bloc de code visuel ci-dessous, tiré dudit tutoriel, je lis "<div id=mynanogallery4 ... ..." ; à quoi correspond cet ID, et où se trouve-t-elle ; s'agit-il du nom du projet créé dans les API google.
D'avance merci du renseignement, si quelqu'un connait la réponse.
<div id=mynanogalery4 data-nanogallery2='{
"userID": "1XXXXXXXXXXXXXXXXX6",
"kind": "google2",
"google2URL": "http://www.MonDomaine.com/nanogp/nanogp.php",
"albumList2": ["Essai","Gaspésie Rocher Percé et île Bonaventure","Essai partage", "test deux", "test 3", "Test nano galerie"],
"breadcrumbAutoHideTopLevel": false,
"thumbnailHeight":200,
"thumbnailWidth": "auto",
"thumbnailHoverEffect2": "scale120|labelAppear"
}' >
</div>


-------------
http://prod.chasse-autreches.xyz" rel="nofollow - Mon site-(1.57 R9)


Posté par: Hobby001
Posté le: 13 Dec 2018 à 23:07
Message posté par jjb1 jjb1 a écrit:

Dans le bloc de code visuel ci-dessous, tiré dudit tutoriel, je lis "<div id=mynanogallery4 ... ..." ; à quoi correspond cet ID, et où se trouve-t-elle ; s'agit-il du nom du projet créé dans les API google.

Ce n'est qu'une ID recommandée par Christophe Brisbois.  Elle agit comme n'importe-quelle ID.


-------------
https://denislafrance.net" rel="nofollow - https://denislafrance.net https://www.youtube.com/playlist?list=PLWg7A6YtIr7VtnP3HvRpMhx8tFJET_fih" rel="nofollow - , Formation vidéo sur OE


Posté par: jjb1
Posté le: 14 Dec 2018 à 09:29
Merci,
Ceci n'est donc pas la source de mon message d'erreur.
Je ne comprends pas, j'ai franchi toutes les étapes d'autorisation google, mais je ne parviens pas à afficher mes albums.
Résultat de : http://dev.chasse-autreches.xyz/nanogp/authorize.php
{"nano_status":"ok","nano_message":"Authorisation successfully granted (userID=1........7)."}
Je ne pense pas que la solution soit du côté d'OE.
Je vais retenter le contact avec Chris Bribois.
Merci encore.


-------------
http://prod.chasse-autreches.xyz" rel="nofollow - Mon site-(1.57 R9)


Posté par: jjb1
Posté le: 14 Dec 2018 à 17:15
Je crois que Hobby001 peut réhabiliter son tutoriel qui m'a bien remis le pied à l'étrier dans ma démarche.

Cela fait 3 jours que je sue, je saigne et je pleure pour parvenir à, ENFIN, ouvrir un album avec des photos déposées chez google photos. (je vais quitter Flickr à regret suite à sa nouvelle politique).
C'est vrai que la démarche pour autoriser nanogallery à afficher les images de google photos est pour le moins complexe (pour mes maigres compétences).
Outre le tuto de Hobby001, les deux tutos de Chris Bribois m'ont été fort utiles.

https://nanogallery2.nanostudio.org/builder.html" rel="nofollow - https://nanogallery2.nanostudio.org/builder.html
https://github.com/nanostudio-org/nanogp" rel="nofollow - https://github.com/nanostudio-org/nanogp

Je suis reparti pour un tour, jusqu'au prochain dikta d'une de ces sociétés dont nous sommes trop dépendants.


-------------
http://prod.chasse-autreches.xyz" rel="nofollow - Mon site-(1.57 R9)


Posté par: Bridet
Posté le: 14 Dec 2018 à 17:38
En même temps, le tout gratuit c'est fini ...


-------------
http://accessit.be" rel="nofollow - Les Billets d'une Bobonne Bougonne - http://gite.vervoz.be" rel="nofollow - Gîte Le Vicus


Posté par: jjb1
Posté le: 14 Dec 2018 à 22:04
Eh oui !!
Résultat : gilets jaunes.


-------------
http://prod.chasse-autreches.xyz" rel="nofollow - Mon site-(1.57 R9)


Posté par: jjb1
Posté le: 20 Mar 2019 à 16:48
Je me permets cette intervention concernant la mise à jour de nanogallery, liée aux nouvelles autorisations exigées par google.
Si Hobby 001 n'en est pas d'accord, il pourra toujours effacer ce message, sans que je m'en offusque un instant.

Une nouvelle version de nanogp est mise à disposition par Christophe Brisbois  https://github.com/nanostudio-org/nanogp2" rel="nofollow - ICI

Par ailleurs, les scripts sont modifiés comme suit :

Dans le bloc de code en Html Header, il faut copier :
<link href="https://unpkg.com/nanogallery2/dist/css/nanogallery2.min.css" rel="stylesheet" type="text/css">
<script type="text/javascript" src="https://unpkg.com/nanogallery2/dist/jquery.nanogallery2.min.js"></script>

Dans le bloc de code visuel, il faut copier :

<div ID="nanogallery2" data-nanogallery2='{
        "userID": "VOTRE USER-ID",
        "kind": "google2",
        "google2URL": "http://VOTRE-SITE/nanogp2/nanogp2.php",
        "album": "VOTRE ID Album",
        "thumbnailWidth": "210",
        "thumbnailHeight": "140",
        "thumbnailBorderVertical": 6,
        "thumbnailBorderHorizontal": 6,
"thumbnailLabel": {
          "display": false
        },
        "slideshowDelay": 5000,
"thumbnailHoverEffect2": "toolsSlideUp|imageScale150",
"thumbnailAlignment": "center"
}'>
</div>

Il faudra préalablement intervenir dans google API comme indiqué dans  https://github.com/nanostudio-org/nanogp2" rel="nofollow - nanogp2  pour donner l'autorisation à nanogallery d'aller voir les photos de google photos, et pour récupérer vos identifiants.

Bon courage.


-------------
http://prod.chasse-autreches.xyz" rel="nofollow - Mon site-(1.57 R9)


Posté par: Hobby001
Posté le: 20 Mar 2019 à 17:30
Message posté par jjb1 jjb1 a écrit:

Je me permets cette intervention concernant la mise à jour de nanogallery, liée aux nouvelles autorisations exigées par google.
Si Hobby 001 n'en est pas d'accord, il pourra toujours effacer ce message, sans que je m'en offusque un instant.

Bon sang, qui serais-je pour oser censurer toute forme d'aide aussi constructive? Wink



-------------
https://denislafrance.net" rel="nofollow - https://denislafrance.net https://www.youtube.com/playlist?list=PLWg7A6YtIr7VtnP3HvRpMhx8tFJET_fih" rel="nofollow - , Formation vidéo sur OE


Posté par: Hobby001
Posté le: 20 Mar 2019 à 17:31
Peut-être qu'un jour je reverrai le tuto avec google photos mais j'ai, en quelque sorte, perdu confiance en eux.


Google a son propre agenda et la planète doit s'en accommoder.


-------------
https://denislafrance.net" rel="nofollow - https://denislafrance.net https://www.youtube.com/playlist?list=PLWg7A6YtIr7VtnP3HvRpMhx8tFJET_fih" rel="nofollow - , Formation vidéo sur OE


Posté par: jjb1
Posté le: 21 Mar 2019 à 15:36
Message posté par Hobby001 Hobby001 a écrit:

Peut-être qu'un jour je reverrai le tuto avec google photos mais j'ai, en quelque sorte, perdu confiance en eux.

Google a son propre agenda et la planète doit s'en accommoder.
Je partage entièrement cette méfiance pour avoir été échaudé à plusieurs reprises.
Mais je dois convenir que, malgré bien des inconvénients et des défauts majeurs, google photos est pratique pour déposer des photos et le couple gp-nanogp est d'une grande efficacité.
Je préfère de beaucoup le couple Flickr-nanogp, mais la politique de Flickr a fondamentalement changé concernant sa gratuité.

Quant à la censure (le mot est fort) :
Je me suis essayé à faire un tutoriel avec notamment la partie "autorisation google API" ; j'ai vite renoncé devant la difficulté de l'exercice vis à vis de mes maigres connaissances.
J'aurais donc très bien compris la "censure" de ma pollution.

Merci pour votre aide, passée, présente et sans aucun doute, future.


-------------
http://prod.chasse-autreches.xyz" rel="nofollow - Mon site-(1.57 R9)



Imprimer la Page | Fermez la fenêtre

Forum Software by Web Wiz Forums® version 12.04 - http://www.webwizforums.com
Copyright ©2001-2021 Web Wiz Ltd. - https://www.webwiz.net