🌱 Farmers Bounty Homepage Shortcode – Quick Start

What We Built

A completely theme-independent homepage for Farmers Bounty that renders as a shortcode. No theme can interfere with it!

Files Created

1. PHP Class: farmers-bounty-plugin/includes/class-homepage-shortcode.php
2. CSS Styles: farmers-bounty-plugin/assets/css/homepage.css
3. Documentation: farmers-bounty-plugin/HOMEPAGE-SHORTCODE.md

How to Use

Step 1: Upload Plugin Update

Upload the updated plugin to your WordPress site (the plugin version is still 6.6.0, so you can just replace the files).

Step 2: Create a New Page

In WordPress admin:

1. Go to Pages → Add New
2. Title it “Home” (or whatever you want)
3. Switch to “Code Editor” or “Text” view (not Visual Editor)

Step 3: Add the Shortcode

Simply paste this:

[fb_homepage]

Step 4: Publish

Click Publish

Step 5: (Optional) Set as Homepage

1. Go to Settings → Reading
2. Select “A static page” for homepage
3. Choose the page you just created

That’s It!

The homepage will render with:

• ✅ Beautiful green gradient hero section
• ✅ 6 benefit cards
• ✅ 12 feature tiles
• ✅ 8 persona cards
• ✅ Comparison table
• ✅ Final CTA
• ✅ 100% theme-independent styling

Customization

Change CTA URL

If you want the buttons to link somewhere other than /farmers-bounty/get-started/:

[fb_homepage cta_url="/your-custom-page/"]

Change Colors

Edit assets/css/homepage.css and search/replace:

• #2d5a27 (dark green)
• #4a8c3f (light green)

Change Content

Edit includes/class-homepage-shortcode.php and modify the arrays:

• $benefits (line ~90)
• $features (line ~130)
• $personas (line ~170)

Why This Works

Unlike the previous HTML approach, this shortcode:

1. Uses all: initial CSS reset (nuclear option)
2. Has unique class prefixes (fb-hp-*) that no theme uses
3. Loads its own CSS file independently
4. Doesn’t rely on theme containers or layouts
5. Is completely self-contained

Preview

The homepage looks like this:

┌─────────────────────────────────┐
│ 🌱 FARMERS BOUNTY (hero)       │
│ Green gradient background       │
│ ┌─────────┐ ┌─────────┐       │
│ │ Badge   │ │ Badge   │       │
│ └─────────┘ └─────────┘       │
│ [Get Started Free Button]      │
└─────────────────────────────────┘

┌─────────────────────────────────┐
│ Why Choose Farmers Bounty?      │
│ ┌───┐ ┌───┐ ┌───┐              │
│ │ 1 │ │ 2 │ │ 3 │ (6 cards)   │
│ └───┘ └───┘ └───┘              │
└─────────────────────────────────┘

┌─────────────────────────────────┐
│ Everything You Need...          │
│ ┌─┐ ┌─┐ ┌─┐ ┌─┐                │
│ │1│ │2│ │3│ │4│ (12 tiles)     │
│ └─┘ └─┘ └─┘ └─┘                │
└─────────────────────────────────┘

┌─────────────────────────────────┐
│ Find Your Perfect Experience    │
│ ┌─────┐ ┌─────┐ ┌─────┐        │
│ │  🌱 │ │  🏡 │ │  🥗 │        │
│ └─────┘ └─────┘ └─────┘        │
└─────────────────────────────────┘

┌─────────────────────────────────┐
│ Comparison Table                │
│ Farmers Bounty vs Others        │
│ ✓ Our features | ✗ Their limits│
└─────────────────────────────────┘

┌─────────────────────────────────┐
│ Ready to Transform Your Garden? │
│ [Start Growing Today Button]    │
└─────────────────────────────────┘

Troubleshooting

Shortcode appears as text?

• Make sure plugin is activated
• Refresh permalinks (Settings → Permalinks → Save)

Styles not loading?

• Clear browser cache
• Clear WordPress cache
• Check that assets/css/homepage.css exists

Still having theme issues?

• Check browser DevTools (F12) to see which styles apply
• If needed, we can add more !important flags

Support

Full documentation in: farmers-bounty-plugin/HOMEPAGE-SHORTCODE.md