gaiety/gaiety-art
1
0
Fork 0
Code Activity

Small content and nav changes

Browse source
This commit is contained in:
Jessica Parsons 2019-02-28 22:18:01 -08:00
parent 0b023a044b
commit 104023f2c9
3 changed files with 45 additions and 35 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

50
README.md
View file

@ -2,24 +2,46 @@
[![Netlify Status](https://api.netlify.com/api/v1/badges/4d853017-7159-4520-b9ee-cc9951715434/deploy-status)](https://app.netlify.com/sites/netlify-photo-gallery/deploys)
This is a photo gallery demo project for Netlify Large Media made with the photos from [Unsplash](https://unsplash.com/) and built with [Hugo](https://gohugo.io/).
This is a photo gallery demo project for Netlify Large Media made with photos from [Unsplash](https://unsplash.com/) and built with [Hugo](https://gohugo.io/).
This project has two branches:
* **master:** A photo gallery that _doesn't use_ Netlify Large Media feature. You can go to [README](https://github.com/netlify/netlify-photo-gallery/blob/master/README.md) to see how you can deploy this with your Netlify account and start using Large Media feature.
* **master:** A photo gallery that does _not_ have Netlify Large Media enabled yet. You can follow the [README instructions](https://github.com/netlify/netlify-photo-gallery/blob/master/README.md/#how-to-deploy-your-own-photo-gallery-with-large-media) to deploy this with your Netlify account and start using Large Media yourself.
* **large-media-sample:** A copy of the photo gallery, with Netlify Large Media enabled. You can go to the files in the [static/images](https://github.com/netlify/netlify-photo-gallery/tree/large-media-sample/static/images) folder to see how large media assets are managed with Git. This branch is used to deploy the demo site, [https://netlify-photo-gallery.netlify.com/](https://netlify-photo-gallery.netlify.com/).
* **large-media-sample:** A photo gallery that uses Netlify Large Media feature. You can go to a [static/images](https://github.com/netlify/netlify-photo-gallery/tree/large-media-sample/static/images) folder to see how large media assets are managed with Git. This branch is deployed as [https://netlify-photo-gallery.netlify.com/](https://netlify-photo-gallery.netlify.com/) demo page.
## How to deploy your own photo gallery with Netlify Large Media
## How to deploy your own photo gallery to play with it
1. Deploy to Netlify with "Deploy to Netlify" button. This will create a new Netlify site and copy the repo to your GitHub account.
1. Deploy to Netlify with "Deploy to Netlify" button. This will create a new Netlify site and copy the repository to your GitHub account.
[![Deploy to Netlify](https://www.netlify.com/img/deploy/button.svg)](https://app.netlify.com/start/deploy?repository=https://github.com/netlify/netlify-photo-gallery)
2. Clone a newly created repo to your local computer with `git clone`.
3. Follow the step of [Enabling Netlify Large Media](https://www.netlify.com/docs/large-media/#enabling-netlify-large-media) to enable Large Media for the newly deployed site.
4. Tweak the LFS settings with the `git lfs` commands. The following example tracks `jpg` and `png` files. Tracking them is required for this photo gallery, so you can start tracking them:
* To track jpg files: `git lfs track *.jpg`.
* To track png files: `git lfs track *.png`.
5. Explore more for how to configure the tracking in [the documentation](https://www.netlify.com/docs/large-media/#large-media-file-tracking-configuration).
7. After making sure you `git add` changes, run `git push origin master` to push your changes to GitHub. It'll be automatically deployed to Netlify utlizing Large Media.
8. Try transformations with image files. For example, you can tweak the layout file with `layouts/photos_s/list.html`.
2. Find your newly created repository on GitHub and clone it to your local computer with `git clone`.
3. Follow the instructions for [Enabling Netlify Large Media](https://www.netlify.com/docs/large-media/#enabling-netlify-large-media) to enable Large Media for the newly deployed site.
4. Specify which files to track using the `git lfs track` command. The following example tracks `jpg` and `png` files. Tracking them is required for this photo gallery, so you can start tracking them:
* To track jpg files: `git lfs track "*.jpg"`.
* To track png files: `git lfs track "*.png"`.
5. Find out more about how to configure file tracking in [the documentation](https://www.netlify.com/docs/large-media/#large-media-file-tracking-configuration).
7. After making sure you `git add` and `git commit` your changes, run `git push origin master` to push your changes to GitHub. It'll be automatically deployed to Netlify using Large Media.
8. When your deploy is done, try running transformations with the image files. For example, you can tweak the layout file at `layouts/photos_s/list.html`.
## Running the site locally
This site is built with Hugo, and works with Hugo version 0.42 and above. Run `hugo version` in your teminal to see if you have Hugo installed. If it's not installed, or you have a version below 0.42, follow the [Hugo documentation](https://gohugo.io/getting-started/installing) to install the current version.
When Hugo is installed, `cd` into this repository and run:
```
hugo server
```
After building the site, the terminal will output the URL for the local server. It will hot reload when you save changes.
## To add photos to the gallery:
1. Add some images in `static/images` folder, and the info to `data/photos.json`.
* You can check which files/suffix are currently tracked by checking `.gitattributes` file.
2. Once it's done, you can `git add`, `git commit`, then `git push` to push them to Netlify Large Media!
3. By running `git lfs ls-files`, you can double check which files are managed by Large Media.
## Get fancy
With Netlify Large Media, you can do cool things like image transformation. You can visit the [documentation](https://www.netlify.com/docs/image-transformation/) for more detail.

6
config.toml
View file

@ -5,13 +5,13 @@ title = "Netlify photo gallery"
[menu]
[[menu.main]]
identifier = "top"
name = "top"
name = "Home"
url = "/"
[[menu.main]]
identifier = "photos_m"
name = "photo gallery (masonry)"
name = "Photo gallery (masonry)"
url = "/photos_m/"
[[menu.main]]
identifier = "photos_s"
name = "photo gallery (square)"
name = "Photo gallery (square)"
url = "/photos_s/"

24
content/_index.md
View file

@ -3,25 +3,13 @@ title: "All the cool photos live here"
date: 2019-02-11T18:25:55-08:00
---
This is a photo gallery demo project for Netlify Large Media made with the photos from [Unsplash](https://unsplash.com/) and [Hugo](https://gohugo.io/).
This is a photo gallery demo project for Netlify Large Media made with photos from [Unsplash](https://unsplash.com/) and built with [Hugo](https://gohugo.io/).
You can browse the code for this site on [GitHub](https://github.com/netlify/netlify-photo-gallery/). This project has two branches:
This project has two branches:
**[master](https://github.com/netlify/netlify-photo-gallery/)**: A photo gallery that _doesn't use_ Netlify Large Media feature. You can go to [README](https://github.com/netlify/netlify-photo-gallery/blob/master/README.md) to see how you can deploy this with your Netlify account and start using Large Media feature.
- **master:** A photo gallery that does _not_ have Netlify Large Media enabled yet. You can follow the [README instructions](https://github.com/netlify/netlify-photo-gallery/blob/master/README.md/#how-to-deploy-your-own-photo-gallery-with-large-media) to deploy this with your Netlify account and start using Large Media yourself.
- **large-media-sample:** A copy of the photo gallery, with Netlify Large Media enabled. You can go to the files in the [static/images](https://github.com/netlify/netlify-photo-gallery/tree/large-media-sample/static/images) folder to see how large media assets are managed with Git. This branch is used to deploy the demo site, [https://netlify-photo-gallery.netlify.com/](https://netlify-photo-gallery.netlify.com/).
**[large-media-sample](https://github.com/netlify/netlify-photo-gallery/tree/large-media-sample)**: A photo gallery that uses Netlify Large Media feature. You can go to a [static/images](https://github.com/netlify/netlify-photo-gallery/tree/large-media-sample/static/images) folder to see how large media assets are managed with Git. This branch is deployed as [https://netlify-photo-gallery.netlify.com/](https://netlify-photo-gallery.netlify.com/) demo page.
### What can I do with this?
### How to start using this?
If you want to try deploying your photo gallery, please go to the [README](https://github.com/netlify/netlify-photo-gallery/blob/master/README.md) for how to do it.
If you want to contribute to the existing photo gallery site _that you have an access to (note: you don't have an access to https://netlify-photo-gallery.netlify.com/ unless you work for Netlify!)_, you can check out [Contributing to a repository with Large Media enabled](https://www.netlify.com/docs/large-media/#contributing-to-a-repository-with-large-media-enabled) documentation for how to prepare.
Here is how to add some photos to the gallery:
1. Add some images in `static/images` folder, and the info to `data/photos.json`
* You can check which files/suffix are currently tracked by checking `.gitattributes` file
2. Once it's done, you can `git add`, `git commit`, then `git push` to push them to Netlify/Large Media!
3. By running `git lfs ls-files`, you can double check which files are managed by Large Media.
With Netlify Large Media, you can do a cool thing like image transformation. You can see the [documentation](https://www.netlify.com/docs/image-transformation/) for more detail.
If you want to try deploying your own photo gallery with Netlify Large Media, please go to the [README](https://github.com/netlify/netlify-photo-gallery/blob/master/README.md) for how to do it.