Experiment with an image gallery populated by a Google Spreadsheet. Using Middleman with Haml, Sass/Compass and CoffeeScript.
Switch branches/tags
Nothing to show
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Failed to load latest commit information.
.bundle
source
.gitignore
Gemfile
Gemfile.lock
README.md
baseUrl.txt
config.rb

README.md

Google-Spreadsheet-Image-Gallery

Experiment with an image gallery populated by a Google Spreadsheet.

Using Middleman with Haml, Sass/Compass and CoffeeScript.

View demo

Main features:

  • Loading external image data as JSON from a Google Spreadsheet, via the Google Data API. The Spreadsheet can be accessed here.
  • Lazy loading of images for fastest possible initial load time (i.e. images are only loaded once they are in the viewport).
  • Completely responsive layout using jQuery Masonry.
  • Single image view with permalink structure and fully functional browser forward/back button, using pushState via the HTML5 History API. The only server-side code needed is some mod_rewrites in .htaccess and getting the folder URL with PHP (to support having the site in a sub-folder).

Photos borrowed from @natgeo