Features Icons Section
The Features Icons section displays features in a grid layout with icon support. Each feature can include an icon, title, description, and optional call-to-action button.
Creating a Features Icons Section
- Log in to Ghost admin
- Go to Pages, click New page
- Set the Page title (e.g., “What We Offer”)
- Optionally add an Excerpt for a section description
- Add features with icons to the content (see structure below)
- Open the Page settings sidebar
- Add these internal tags:
#landing,#landing-features-icons - Click Publish
Required Tags
| Internal Tag | Description |
|---|---|
#landing | Required for all landing sections |
#landing-features-icons | Enables features grid with icon support |
Column Options
Control the grid layout:
| Internal Tag | Columns | Best For |
|---|---|---|
#landing-columns-2 | 2 columns | Large icons with detailed descriptions |
#landing-columns-3 | 3 columns | Balanced layout |
#landing-columns-4 | 4 columns | Standard feature grid |
#landing-columns-5 | 5 columns | Many features, icon-focused |
Adding Features with Icons
Add features using Product Cards:
- Click the
+button in the editor - Select Product
- Upload your icon image (SVG recommended)
- Add a Title for the feature name
- Add a Description for the feature details
- Optionally add a Button with a link for call-to-action
- Repeat for each feature
Icon Recommendations
| Library | License |
|---|---|
| Lucide | ISC License |
| FontAwesome | Free: CC BY 4.0 (icons), MIT (code) |
| Bootstrap | MIT License |
| Hero Icons | MIT License |
| Tabler Icons | MIT License |
| Phosphor Icons | MIT License |
| Iconoir | MIT License |
| Remix Icon | Apache License 2.0 |
| Untitled | Custom license (free for commercial projects up to 5 users) |
| Hugeicons | Commercial, Free for personal & open source projects |
Optional Settings
Combine with other settings:
| Internal Tag | Effect |
|---|---|
#landing-hide-title | Hide the section heading |
#landing-container-wide | Wider grid layout |