photo2html
Make an album without using any external service. Creates a static page with flexbox.
Requirements
- Python 3 or 2.7
- ImageMagick
brew install imagemagick
apt-get install ghostscript imagemagick
Install
Put run.py
in the folder containing your photos, then:
python run.py
It will create an index.html
page, and a thumb
folder containing all thumbnails.
Note. The current version of the code assumes your photos have .jpg
extension (not uppercase). If not, please change the glob
filter on line 22 of run.py
.
Useful links
- A Complete Guide to Flexbox
- Jeffrey Friedl's Image Metadata Viewer
- Two useful Stack Overflow posts:
Long story short: sometimes, images are displayed in landscape instead of portrait in browsers. It is because some phones (ex. iPhone) use the Orientation EXIF metadata, which is ignored by browsers unless you have image-orientation: from-image
which is only recognized by Firefox so far.
ImageMagick saved us, by using the flag -auto-orient
for creating the thumbnails.
Next steps (please open PRs!)
- Get valid HTML5 code
😇 - Provide a better default flexbox configuration (= tweak the magic numbers so that any phone has at least two columns of pictures)
- Use fancybox. Vanilla JS responsive alternatives are welcome.