2.5 KiB
2.5 KiB
Netlify Photo Gallery
This is a photo gallery demo project for Netlify Large Media made with the photos from Unsplash and built with Hugo.
This project has two branches:
-
master: A photo gallery that doesn't use Netlify Large Media feature. You can go to README to see how you can deploy this with your Netlify account and start using Large Media feature.
-
large-media-sample: A photo gallery that uses Netlify Large Media feature. You can go to a static/images folder to see how large media assets are managed with Git. This branch is deployed as https://netlify-photo-gallery.netlify.com/ demo page.
How to play with this
- Deploy to Netlify with
button. This will create a new Netlify site and copy the repo to your GitHub account.
- Clone a newly created repo to your local computer with
git clone
. netlify link
to link the local repo and the Netlify site.- Make sure to install Netlify CLI if you haven't:
npm install netlify-cli -g
.
- Make sure to install Netlify CLI if you haven't:
- Check if the Large Media local setup has finished already.
- You can check it with
netlify lm:info
command. - Make sure to install netlify-lm-plugin plugin if you haven't:
netlify plugins:install netlify-lm-plugin
.
- You can check it with
- Run
netlify lm:setup
to setup the Large Media for this repository/site.- It will create a
.lfsconfig
file, make sure you track this file.
- It will create a
- Tweak the LFS settings with the
git lfs
commands. The follow example containsjpg
andpng
files, and expects that both of them are tracked by LFS:- To track jpg files:
git lfs track *.jpg
. - To track png files:
git lfs track *.png
. - To track all files under
static/images
:git lfs track static/images/**
.
- To track jpg files:
- Run
git push origin master
to push your changes to GitHub. It'll be automatically deployed to Netlify utlizing Large Media. - Try transformations with image files. For example, you can tweak the layout file with
layouts/photos_s/list.html
.