Hugoplate is a free starter template built with Hugo, and TailwindCSS, providing everything you need to jumpstart your Hugo project and save valuable time.
Made with β₯ by Zeon Studio
If you find this project useful, please give it a β to show your support.
We have included almost everything you need to start your Hugo project. Let's see what's included in this template:
- π₯ Multi-Authors
- π― Similar Posts Suggestion
- π Search Functionality
- π Dark Mode
- π·οΈ Tags & Categories
- π Netlify setting pre-configured
- π Support contact form
- π± Fully responsive
- π Write and update content in Markdown
- π¬ Disqus Comment
- π³ Syntax Highlighting
- π Homepage
- π€ About
- π Contact
- π₯ Authors
- π€ Author Single
- π Blog
- π Blog Single
- π« Custom 404
- π‘ Elements
- π Privacy Policy
- π·οΈ Tags
- π·οΈ Tag Single
- ποΈ Categories
- ποΈ Category Single
- π Search
- Hugo
- Tailwind CSS
- PostCSS
- PurgeCSS
- AutoPrefixer
- Hugo Modules by Gethugothemes
- Markdown
- Prettier
- Jshint
- Netlify
- Vercel
- Github Actions
- Gitlab Ci
- AWS Amplify
First you need to clone or download the template repository, and then let's get started with the following process:
To start using this template, you need to have some prerequisites installed on your machine.
We build this custom script to make your project setup easier. It will create a new Hugo theme folder, and clone the Hugoplate theme into it. Then move the exampleSite folder into the root directory. So that you can start your Hugo server without going into the exampleSite folder. Use the following command to setup your project.
npm run project-setup
Install all the dependencies using the following command.
npm install
Start the development server using the following command.
npm run dev
hugoplate-quick-setup.mp4
This template has been designed with a lot of customization options in mind. You can customize almost anything you want, including:
You can change the site title, base URL, language, theme, plugins, and more from the hugo.toml
file.
You can customize all the parameters from the config/_default/params.toml
file. This includes the logo, favicon, search, SEO metadata, and more.
You can change the colors and fonts from the data/theme.json
file. This includes the primary color, secondary color, font family, and font size.
You can change the social links from the data/social.json
file. Add your social links here, and they will automatically be displayed on the site.
We have added some custom scripts to make your life easier. You can use these scripts to help you with your development.
If you want to update the theme, then you can use the following command. It will update the theme to the latest version.
npm run update-theme
Note: This command will work after running
project-setup
script.
We have added a lot of modules to this template. You can update all the modules using the following command.
npm run update-modules
If you want to remove dark mode from your project, then you have to do it manually from everywhere. So we build a custom script to do it for you. you can use the following command to remove dark mode from your project.
npm run remove-darkmode
Note: This command will work before running
project-setup
script. If you already run theproject-setup
command, then you have to runnpm run theme-setup
first, and then you can run this command. afterward, you can runnpm run project-setup
again.
After you finish your development, you can build or deploy your project almost everywhere. Let's see the process:
To build your project locally, you can use the following command. It will purge all the unused CSS and minify all the files.
npm run build
We have provided 5 different deploy platform configurations with this template, so you can deploy easily.
And if you want to Host some other hosting platforms. then you can build your project, and you will get a public
folder. that you can copy and paste on your hosting platform.
Note: You must change the
baseURL
in thehugo.toml
file. Otherwise, your site will not work properly.
We use GitHub Issues as the official bug tracker for this Template. Please Search existing issues. Itβs possible someone has already reported the same problem. If your problem or idea has not been addressed yet, feel free to open a new issue.
Copyright (c) 2023 - Present, Designed & Developed by Zeon Studio
Code License: Released under the MIT license.
Image license: The images are only for demonstration purposes. They have their license, we don't have permission to share those images.
List of projects people are building with Hugoplate! Have you built a project with Hugoplate? Submit it by creating a pull request and we'll feature it here!
Open Neuromorphic | AI Models | Hugobricks |
If you need a custom theme, theme customization, or complete website development services from scratch you can Hire Us.