hugo-profile

Hugo Profile

Twitter GitHub forks GitHub stars

Netlify Status Latest Release Last Commit Open Issues Open Pull Requests License

Hugo Profile: a high-performance, mobile-first Hugo theme for personal portfolios and blogs.

Features:

Requirements

Quick Start

  1. Create a new Hugo site:

     hugo new site my-site --format="yaml"

    This uses a hugo.yaml configuration file instead of the default TOML format.

  2. Add a theme.

    Option A: Clone this repository inside your themes folder.
    This allows you to make lots of custom changes.

     cd my-site/themes
 git clone https://github.com/gurusabarish/hugo-profile.git

    Option B: Add as a Git submodule.
    This allows you to get automatic or structured updates from the original repository.

     cd my-site
 git init
 git submodule add https://github.com/gurusabarish/hugo-profile.git themes/hugo-profile
  3. Copy the example configuration file to your site root: 
     cp -f themes/hugo-profile/exampleSite/hugo.yaml ./hugo.yaml
  4. Start the Hugo development server: 
     hugo server

  5. Recommended: Copy example content and assets.

    When you first run hugo server, the site may look incomplete — images may be missing and the Blog or Gallery sections might not appear.

    This is because their content currently resides in themes/hugo-profile/exampleSite/, whereas Hugo expects them in the root-level static/ (for images) and content/ (for pages) directories.

    To have a complete view of the example site, run:

     rsync -av themes/hugo-profile/exampleSite/static/ ./static/
 rsync -av themes/hugo-profile/exampleSite/content/ ./content/

    You can customize or replace this content to match your own site.

Content Management

You can now start customizing your site.

To change the site title or homepage content, edit the hugo.yaml file in the root directory. This file also controls settings for showing or hiding sections of the site (e.g., About, Education).

To create a new page, for example, in the Blog section, run:

hugo new content content/blogs/my-post.md

This creates a new file in the content/blogs/ folder with front matter that includes metadata like the date.

Here are some useful resources for your reference:

Deployment

If you do not require extensive customization, the easiest way to deploy is:

  1. Click the Use this template button to create your own repository.
  2. Connect the repository to Netlify.

Whenever you make changes to the files inside the exampleSite folder, Netlify will automatically detect and deploy your changes.

If you followed the steps in the Quick Start section above, you can still deploy your site to Netlify, but you’ll need a few additional configurations.

See the Host on Netlify guide for further information.

For manual deployment, run hugo to generate the final, ready-to-deploy static site in the public/ folder, which you can upload to any hosting platform.

It is recommended to delete the public/ folder before each build to ensure it only contains the latest output:

rm -rf public/ && hugo

Trouble-Shooting

ERROR error calling resources.GetRemote: Get "https://publish.twitter.com/oembed?dnt=false&url=https%3A%2F%2Ftwitter.com%2FGoHugoIO%2Fstatus%2F1315233626070503424": net/http: TLS handshake timeout
Built in 10266 ms
Error: error building site: logged 1 error(s)

The TLS handshake timeout error can happen due to network issues. If this error persists, you can delete the shortcode example `` in the “content/blogs/rich-content.md” file.

Issues

If you have a question, please open an issue for help and to help those who come after you. The more information you can provide, the better!

Contributing

Contributions, issues, and feature requests are welcome! For major changes, please open an issue first to discuss what you would like to change.

License

Licensed under MIT

🤝 Support

Give a ⭐️ or buy me a ~coffee~ tea if you like this project!

Buy Me A Coffee

This site is open source. Improve this page.