MichaelCurrin / artists-portfolio

:paintbrush: Website with an image gallery, built on Jekyll and the Aperture theme
https://artists-portfolio.netlify.app/
MIT License
7 stars 2 forks source link
art gallery jekyll netlify portfolio static-site

Artist's Portfolio

Website with an image gallery, built on Jekyll and the Aperture theme

Netlify Status Made with Jekyll GitHub tag MIT license

A simple elegant template for an artist to use a portfolio website - in particular this includes a responsive image gallery that uses automatically resized thumbnails and lets you click to see a larger version of the image.

[![Site link](https://img.shields.io/badge/demo_site-Artists_Portfolio-blue?style=for-the-badge)](https://artists-portfolio.netlify.app/) [![Use this template](https://img.shields.io/badge/Generate-Use_this_template-2ea44f?style=for-the-badge)](https://github.com/MichaelCurrin/artists-portfolio/generate)

If you like the demo site (which has placeholder content), then click Use this template to add a copy to your own projects.

Note: This uses Jekyll 4 and a custom gem, so will not work on GitHub Pages without GH Actions. But it will work on Netlify, like the demo does.

Credits

This project is a customized version of the Aperture template by CloudCannon. See the original repo: CloudCannon/aperture-jekyll-template.

Requirements

Remote setup

These instructions are netlify.com to host. The config can be found as netlify.toml and needs no configuration.

  1. Add this project to your own repos using Use this template button.
  2. Create a Netlify account.
  3. Add your repo to Netlify sites.
  4. Wait for it to build.
  5. Change to a URL that is more friendly than the random one.

Customize your repo. When you commit and push changes, the site will rebuild.

Installation

Install system dependencies

Install GraphicsMagick for your own OS - instructions.

Install Ruby and Bundler - instructions.

Install project packages

Install gems with this command, which is defined in Makefile.

$ make install

For more details, optionally see this gist to Install gems with Bundler.

Run

Start a local dev server

$ make serve

See the Makefile for build commands.

Customization

How to use this repo after you've added it your projects.

Update the URL in _config.yml with your own place (no trailing forward slash) - this will ensure that the sitemap.xml file uses the correct domain.

Upload images to the uploads directory. Those they will not appear in the gallery yet.

Make changes to the _data directory - choose images to show as well as order and label, change content for other pages and the update navbar.

Add or remove pages in the root of the project - update the navbar file to ensure your pages are visible in the menu.

Development

The hover effect comes from gallery style in layout.scss.

To prevent loading full size images on the gallery, we use this gem to generate thumbnails:

That is my fork an existing gem, with added support for Jekyll 4 so that I can use it on Jekyll 4 sites like this one.

The original setting of the Aperture theme uses 800x800 images - going smaller than that works for desktop but causes issues when viewing on mobile and the image fills the screen.

For SEO settings, see:

License

Released under MIT.

See the source license.

If you reuse this project (such as fork or generate from template) or copy a large portion, you must include these licenses.

Please include a link make to this repo in your site or docs.