💡 Web projects can be hard. Our solutions specialists can help!

Editor-friendly templates

Vonge

A great portfolio/blog template with page builder

portfolio

Choose your SSG:

Deploy to CloudCannon Deploy to CloudCannon
View on Github Preview site View on Github Preview site

Vonge is a Personal portfolio/blog site template for Jekyll. Browse through a live demo. Increase the web presence of your brand with this configurable theme.

Vonge was made by CloudCannon, the JAMStack Cloud CMS. The component library is built and maintained for use with Bookshop

Find more templates, themes and step-by-step Jekyll tutorials at CloudCannon Community.

Features

  • Component library for website building
  • Fully configurable Website
  • Pre-built pages
  • Pre-styled components
  • Blog
  • Category pages
  • Testimonials
  • Portfolio
  • Live editing with CloudCannon
  • Optimised for editing in CloudCannon
  • Search engine optimisation

Develop

Vonge was built with Jekyll version 4.2.1, but should support newer versions as well.

Install the dependencies for Bookshop:

$ npm install

Install the Jekyll dependencies with Bundler:

$ npm run jekyll:install

Run the website:

$ npm start

[!IMPORTANT] When running locally, the pagination will not work. Deploy to CloudCannon to see successful pagination.

Vonge is a Personal portfolio/blog site template for Hugo. Browse through a live demo. Increase the web presence of your brand with this configurable theme.

Vonge was made by CloudCannon, the JAMStack Cloud CMS. The component library is built and maintained for use with Bookshop

Find more templates, themes and step-by-step Hugo tutorials at CloudCannon Tutorials.

Features

  • Component library for website building
  • Fully configurable Website
  • Pre-built pages
  • Pre-styled components
  • Blog
  • Category pages
  • Testimonials
  • Portfolio
  • Portfolio tags
  • Live editing with CloudCannon
  • Optimised for editing in CloudCannon
  • Search engine optimisation

Develop

To run locally:

hugo serve

To generate the component browser:

npm run bookshop-browser

This will create browser files in the site's static directory. Running a Hugo build after this will show a live component browser at /components

If there is a bookshop error when running locally, try updating bookshop:

npx @bookshop/up@latest

Structure

The bookshop components live in component-library, which is loaded as a Hugo module in site/config.toml.

The site also pulls in the main dependency of github.com/cloudcannon/bookshop/hugo/v3.

For further help with Bookshop, see the Bookshop Guides.