Osprey Delight is the free-minded artist's choice for a clutter-free and blazingly fast single-page portfolio.
It's perfectly suited to show off your awesome work!
It tastes a bit different than the original great Osprey theme and adds awesome new functionality to your delight.
Check out how Osprey Delight performs in the real-world:
- Protonaut Music - Musician and top contributor whose highly individualized site got kickstarted by Osprey Delight.
- KDEVO - The maintainer's site. It wouldn't be me if I would not run this theme personally. It's basically in the vanilla version.
- Single page made out of extensible section building blocks
- About: Introduce yourself
- Gallery: Show your work using a grid-based gallery with interactive modal boxes
- Blog: Lightweight blog features
- Contact: Contact form with Basin support and built-in spambot protection
- Images are asset-driven. Use your high-quality images without the hassle of manually resizing them!
- Image lazy-loading via lazySizes
- Blur-up technique using automatic low-quality image placeholders (LQIP)
- Score 100 at PageSpeed Insights. Every bit is fine-tuned for performance
- Auto-generated structured ensures that everyone finds you
- Delightful UX
- Smooth scrolling plus scroll-spy
- Awesome social icons in footer
- Automatically fetches GitHub repo data for you
- Sane fallbacks for No-Script/No-JS users
- Intelli-404: Automatically searches for suitable matches - never loose the link to your content
- Heavily customizable - no need to maintain a fork!
In general, many open issues of the original theme have been resolved.
There are multiple ways to show your support if you like this project:
- Start contributing
- Become a sponsor or donate anything to my non-profit organization via various options
- Push the button - a small gesture with huge effect
The recommended way to setup this theme is to use a git submodule so that further upgrades can be received without any hassle. Invoke the following from your Hugo site directory:
git submodule add https://github.com/kdevo/osprey-delight.git themes/osprey-delight
Now, simply copy the exampleSite directory's content to your project's root, it's a great starting point.
Visit the Hugo docs for more info and general setup of a Hugo site.
Receive the latest features of the theme by pulling the latest changes from
cd themes/osprey-delight git pull
It is good practice to check the release notes before upgrading (especially before using new major versions).
Configuration and Usage
It's best if you simply check out the fully commented config file. This theme follows a learning-by-doing approach.
This theme is asset-driven! It "knows" how to handle your precious assets, and there usually is no need for manual resizing.
Therefore, the recommended approach for images is to provide high-res images in the
The following table shows some guidelines regarding the assets:
|Image Type||Config Key||Minimum Width||Note|
||200px||Transparent, minimum margin top/bottom|
||96px||Transparent, small margin top/bottom, prefer square format|
||400px||Transparent, medium margin top/bottom/left/right, prefer square format|
||1200px||Optional, use a high-quality JPG|
To create an about section that renders on the home page, run:
$ hugo new about.md
To create a new gallery item, run:
$ hugo new gallery/item-name.md
This is very helpful for the first time since you will get a fully documented file.
⚠️Please make sure that
item-nameis unique on the whole page because it will be used as an anchor/identifier!
Basin is a free AJAX contact form service that is used by this theme. To use set it up, sign up for a free account and create a form. Copy and paste your form's URL endpoint to the
ajaxBasin config.yaml parameter. Select the
Submit this form via AJAX option on your Basin dashboard.
Under Setup/"Set a Custom Honeypot Field", enter
Basin will ignore all messages that contain this specific field. This should work since there is a hidden field that users normally do not use, but spambots will blindly input their data.
This README probably needs some documentation improvements for the latest features. Any PR regarding this is welcome and please also check out how to contribute!
Want to have full control over appearance? Check out how to customize the theme more granularly.