Flickr & Google Photos - embed code
.nGY2 {
-webkit-box-sizing: content-box;
overflow: auto !important;
}
|
Flickrit |
sEmbedder flickrEmbed |
nanogallery2 |
publicalbum.org |
ccPanGallery² |
Flickr |
|
|
|
|
|
Google Photos |
|
|
|
|
|
Instagram |
|
|
|
|
|
HTML5 |
|
|
|
|
|
thumbnail carousel |
|
|
all albums / one album (but then without main photo) |
|
|
responsive |
100% |
|
all albums: (aspect ratio varies) → ³ one album: no (aspect ratio varies) one photo: yes |
|
(100%) |
fullscreen toggle |
|
 (even when embedded in FW) (in D7???) |
|
 (also when embedded in D7 or FW) |
 (in FW, also in D7???) |
web friendly (compressed files) |
3 MB → 188 KB |
2,3 MB → 389 KB |
→ use "viewerZoom": false 29 MB → 208 KB |
33 MB → 177 KB |
32 MB → 222 KB |
transparent background |
|
|
|
|
|
embeddable in foswiki |
0-14-CPGallery-Flickrit |
0-17-CPGallery-SEmbedder=FlickrEmbed |
0-17-CPGallery-Nanogallery2 |
0-19-CPGallery-PublicAlbum |
0-17-CPGallery-CcPanGallery |
embeddable in Drupal7 |
|
|
|
 (via lokale htm) |
??? |
embeddable in Drupal7 using Iframe module |
|
|
|
|
??? |
load speed |
|
|
|
|
|
VERDICT |
voorbijgestreefd door sEmbedder/flickrEmbed |
thumbnails & fullscreen, maar geen Google Photos |
ondersteuning van Google Photos, leuke switch van alle albums naar één album naar één foto, maar geen thumbnails |
ondersteuning van Google Photos, fullscreen mogelijk in Drupal, maar geen thumbnails |
sowieso voor fotoreeksen met audio!!! Ook thumbnails, maar geen ondersteuning voor Google Photos of Flickr, dus veel handmatig werk! |
² JQuery Multimedia Gallery Slideshow With Touch Pan by Tean
³ code om rechtstreeks in Drupal in te voeren: zie
0-17-CPGallery-Nanogallery2
Flickrit v1 does not offer the possibility to go full screen - don't use it anymore!
Embeddability
tool |
embeddable? |
as iframe? |
as iframe in Drupal?² |
Flickrit sEmbedder flickrEmbed |
|
|
|
nanogallery2 |
|
|
|
publicalbum.org |
|
|
|
ccPanGallery2 |
|
|
|
² but no possibility to watch full screen
a) flickrEmbed settings
THEME |
Default No TextPanel |
SKIN |
Default - Transparent |
SCALE MODE |
Fill |
LAYOUT |
RESPONSIVE |
IMAGE SOURCE |
FLICKR |
SORTING CRITERIA |
|
b) nanogallery2 settings
links
live usage
- nanogp2-directory:
- nanogp2/admin/config.php: hier moeten jouw eigen client_id & client_secret komen te staan
- in een html-bestand…
- verwijs je dan naar css & js van nanogallery
- de url van jouw nanogp2.php
- bepaal je thumbnailHeight & Width
- zet je de viewerZoom af (om geen images in 100% filesize te downloaden)
- voeg je eventueel nog andere parameters toe
in drupal
- zie hierboven onder de vergelijkende tabel
c) publicalbum.org settings
d) ccPanGallery settings
Haalt dus niet vanzelf de afbeeldingen van een album op.
Photo Gallery
Ik haal eerst de id's op via Photo Gallery (zie verder onder Google Photos > Photo Gallery)
Dan haal ik er wat trucen mee uit in Excel (
GooglePhotoGallery2ccPanGallery.xlsx), zodat ik bruikbare tags heb om te gebruiken in ccPanGallery.
Responsive iframes
Drupal iframe
- Iframe module
- blijkt goed te werken voor alle bovenstaande gallery's (flickrEmbed, nanogallery2, publicalbum, ccPanGallery)
Flickr
Google Photos
Photo Gallery
Naast
publicalbum.org kun je ook
Photo Gallery gebruiken, een add-on voor
Google Spreadsheets.
Het vereist wel dat je 3rd party cookies toestaat voor [*.]googleusercontent.com
Rearrange album order
see:
https://support.google.com/photos/thread/470656?hl=en
You can change the order of albums by changing dates:
- To change the "Date taken" of a photo at Google Photos
- Open a photo
- Click the "i" (Info) icon at the top-right
- In the Info panel, click the pencil (edit) icon
- In the "Edit date & time" window, click into the fields to change the year, month, day, time; and time zone drop-down arrow
- Click Save
- To "batch edit" date and time
- Selecting multiple photos
- Click 3 vertical dots ("More options")
- Click "Edit date & time"
- Click either option "Shift dates & times" or "See one date & time" and make your changes.
Lightbox jQuery plugins
Photo editing online
TinyPNG
- https://tinypng.com/
- Bijzonder krachtige compressor voor png & jpg met behoud van kwaliteit!!!
- max. 20 afbeeldingen van elk max. 5 MB per keer
Bulk Resize Photos
- https://bulkresizephotos.com/
- om een heleboel foto's dezelfde hoogte/breedte te geven
- bovendien heel snel omdat het eigenlijk lokaal op je eigen pc wordt uitgevoerd (clever!)
Birme