Editor-friendly templates
Vonge
A great portfolio/blog template with page builder
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
Requirements
This template is built with Hugo Extended v0.143.1 (see hugoVersion in .cloudcannon/initial-site-settings.json). It requires the extended edition of Hugo (for Sass compilation) and a minimum version of v0.128.0 (declared in component-library/config.toml).
Make sure you have installed:
- Hugo Extended — v0.143.1 recommended (minimum v0.128.0)
- Node.js and npm (for Bookshop tooling)
Check your Hugo version and confirm it's the extended edition:
hugo version
Running locally
Install the Node dependencies (Bookshop components are pulled in as Hugo modules, but the Bookshop tooling is installed via npm):
npm i
Then start the local development server:
hugo serve
The site will be available at http://localhost:1313/.
Component browser
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.
Troubleshooting
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.