Weedo | Cannabis Listing HTML5 Template

Weedo is the only cannabis marketplace HTML5 template on ThemeForest built around a full directory and multi-vendor marketplace architecture. With 38+ hand-crafted pages, 9 unique home layouts, GPS-based geo-locator, interactive vendor map, 3 vendor profile styles, 3 listing archive layouts, side-by-side product comparison, exclusive deals page, and a community reviews system, Weedo covers every surface of a modern cannabis business platform. Built on Bootstrap 5.3.8, it ships with 8 runtime colour themes, a 30-feature accessibility widget, and a full ARIA 1.2 compliance pass—making it the most complete and accessible cannabis template in its category.

Whether you are building a dispensary directory, a medical cannabis clinic finder, a recreational store locator, a grower marketplace, or a multi-vendor weed shop, Weedo provides the pages, layout systems, and interactive features to launch immediately. No other cannabis HTML template on ThemeForest offers 9 home layout variants, a geo-locator for nearest dispensary discovery, a runtime colour switcher with localStorage persistence, or a bundled accessibility widget covering WCAG 2.1 AA, ADA, Section 508, EU Accessibility Act, and AODA compliance requirements.

Key Features

• 38+ pages covering marketplace, vendor, shop, blog, and utility use cases
• 9 distinct home layout variants—the most of any cannabis template on ThemeForest
• Full cannabis marketplace architecture: listings, vendor profiles, map, geo-locator, deals, reviews
• Bootstrap 5.3.8 with Popper @popperjs/core 2.11.8 and data-bs-* attributes throughout
• 8 runtime colour themes via CSS custom properties (—mht-primary) with localStorage persistence
• 30-feature accessibility widget bundled (ADA / WCAG 2.1 AA / Section 508 / EU / AODA)
• Full ARIA 1.2 compliance pass: skip link, main landmark, focus-visible, keyboard nav, aria-expanded
• Interactive Leaflet vendor map with marker clusters
• GPS-based geo-locator for nearest dispensary / clinic finder
• 3 vendor profile styles, 3 listing archive layouts, 3 shop layouts
• Side-by-side product comparison page
• Exclusive deals and promotions page
• Community reviews page
• Add vendor submission page
• ion.rangeSlider for price and filter ranges
• nice-select for styled dropdown menus
• Swiper slider and Magnific Popup lightbox
• JSON-LD structured data and Open Graph meta on every page
• Google Fonts: Poppins (headings) + Open Sans (body)
• Well-commented, modular HTML and CSS for easy customisation

Cannabis Marketplace Architecture (UNIQUE—only marketplace-style cannabis template on ThemeForest)

• Weedo is the ONLY cannabis HTML template on ThemeForest built around a true marketplace and directory model
• Vendor-centric architecture: each vendor has a profile page, product listings, and map pin
• Listing archive pages support full-width, left-sidebar, and right-sidebar layouts
• Listing detail page includes vendor info, product specs, reviews, and location map
• List-view mode for compact directory browsing
• Add vendor page lets new businesses submit their listing
• Vendor map page shows all vendor pins on an interactive Leaflet map
• Geo-locator page uses browser GPS to find the nearest dispensary or clinic
• Exclusive deals page surfaces promotions from multiple vendors in one feed
• Community reviews page aggregates ratings across the marketplace
• E-commerce shop pages handle product browsing, detail, comparison, and checkout
• Full user transaction flow: login, register, checkout, and order details
• Covers dispensaries, medical clinics, growers, processors, coffee shops, pharmacies, and labs

30-Feature Accessibility Widget (UNIQUE IN CANNABIS NICHE)

• No other cannabis HTML template on ThemeForest includes any accessibility widget—Weedo bundles a full 30-feature panel
• Self-bootstrapping: a single script tag is all that is required; JS auto-injects its own CSS
• Settings persisted in localStorage—user preferences survive page reloads
• Fixed trigger tab at bottom-left, slides in from the left—never blocks page content
• Compliance targets: ADA (Americans with Disabilities Act), WCAG 2.1 AA, Section 508, EU Accessibility Act, AODA
• Accessibility profiles: Motor Impaired, Blind Users, Colour Blind, Dyslexia, Cognitive Disability, ADHD, Seizure Safe, Low Vision
• Content adjustments: increase/decrease text size, line height, letter spacing, font switch to readable alternatives
• Colour adjustments: high contrast, dark contrast, light contrast, monochrome, low saturation, desaturate
• UX adjustments: highlight links, highlight headings, readable font, pause animations, hide images, mute sounds
• Cursor enhancements: large cursor, reading guide, reading mask, focus indicator
• Navigation aids: keyboard navigation hints, skip-to-main shortcut
• Reset button restores all settings to default in one click

ARIA and Keyboard Compliance

• Full ARIA 1.2 audit and remediation pass completed 03/10/2026
• Skip-to-main-content link at the top of every page for keyboard and screen reader users
• Semantic main landmark on every page
• focus-visible CSS: 3px solid outline on all interactive elements—no outline suppression
• All social icon links have descriptive aria-label attributes
• Swiper and other sliders have keyboard navigation and ARIA roles
• Mobile navigation toggle uses aria-expanded to communicate open/closed state
• Back-to-top button has aria-label=”Back to top”
• All form inputs have associated label elements
• Colour contrast ratios meet WCAG 2.1 AA minimums across all 8 colour themes

9 Unique Home Layouts (most in cannabis niche)

• No competitor cannabis template on ThemeForest offers more than 3 home layouts—Weedo ships with 9
• Default Home—flagship marketplace layout with hero search and featured vendors
• Home Layout 1—bold full-screen hero with category grid
• Home Layout 2—split hero with map preview panel
• Home Layout 3—card-heavy layout for dispensary directories
• Home Layout 4—medical clinic style with appointment-focused CTA
• Home Layout 5—e-commerce style with featured products above the fold
• Home Layout 6—grower and processor marketplace variant
• Home Layout 7—deals-first layout highlighting promotions and offers
• Home Layout 8—minimal dark-accent layout for premium brands
• Every home layout shares the same component library, colour system, and page shell—mix and match sections freely

8 Colour Theme System

• No other cannabis HTML template on ThemeForest offers a runtime multi-colour switcher—Weedo ships with 8 themes
• All colours are driven by a single CSS custom property (-mht-primary) - no duplicate stylesheets
• Theme 1: Teal #268968 (default cannabis-industry green)
• Theme 2: Red #E53935
• Theme 3: Forest Green #2E7D32
• Theme 4: Purple #6A1B9A
• Theme 5: Orange #E65100
• Theme 6: Dark Teal #00695C
• Theme 7: Blue #1565C0
• Theme 8: Slate #37474F
• Colour switcher panel (mht-switcher) is accessible and keyboard navigable
• Selected theme is saved to localStorage—choice persists across pages and sessions
• Switch the entire site colour in seconds without touching a single line of CSS

Geo-Locator and Vendor Map

• Two location-intelligence pages no competitor cannabis template offers: geo-locator and interactive vendor map
• Geo-Locator page—uses browser Geolocation API to detect user position and surface the nearest dispensaries, clinics, or stores
• Nearest results are sorted by distance and displayed in a list alongside a live map
• Ideal for “find weed near me” and “nearest dispensary” search intent landing pages
• Vendor Map page—interactive Leaflet.js map with all vendor locations pinned
• Map supports marker clustering for areas with high vendor density
• Each map pin opens a vendor info card with name, category, rating, and profile link
• Fully responsive—map reflows correctly on mobile and tablet viewports
• Leaflet is open-source and does not require a paid API key

3 Vendor Profile Styles

• Vendor Default—classic profile with cover image, info panel, product grid, and reviews
• Vendor Style 1—sidebar layout with compact info and wide product area
• Vendor Style 2—card-style header with tabbed sections (Products, About, Reviews, Map)
• All vendor profile styles include: business name, logo, address, hours, phone, website, and social links
• Star rating display with review count on all vendor profiles
• Inline product listings with filtering on every vendor page
• Location mini-map embedded on each vendor profile

3 Listing Archive Layouts

• Listing Archive Full Width—maximum content area, filters in a top bar
• Listing Archive Left Sidebar—filter panel on the left, results on the right
• Listing Archive Right Sidebar—results on the left, filter panel on the right
• List View—compact horizontal card layout for fast directory scanning
• Listing Detail—single listing page with gallery, specs, vendor info, map, and reviews
• All archive layouts include: category filter, location filter, price range slider (ion.rangeSlider), sort dropdown (nice-select), and grid/list toggle
• Result cards show: image, name, category badge, rating stars, address, and distance

Product Comparison System

• Comparison page—side-by-side product comparison unique in the cannabis template category
• Compare up to 4 products simultaneously across a full specification table
• Compared attributes include: strain type, THC/CBD content, weight, price, vendor, and rating
• Highlight rows where products differ for fast decision-making
• Add-to-cart and view-detail actions available directly from the comparison table
• Responsive table collapses gracefully on smaller screens with horizontal scroll

Exclusive Deals and Promotions

• Exclusive Deals page—a dedicated promotions feed aggregating offers from multiple vendors
• Deal cards show: vendor name, deal title, discount percentage, expiry date, and redemption CTA
• Filter deals by category, vendor, or deal type (flash sale, daily deal, bundle)
• Countdown timers on time-limited flash sale deals
• Perfect for email campaign landing pages and seasonal promotion pushes
• Supports affiliate-link and coupon-code deal formats

Community Reviews System

• Community Reviews page—aggregated review feed across the marketplace
• Review cards include: reviewer name, avatar, star rating, date, product/vendor reviewed, and review text
• Filter reviews by rating (1-5 stars), category, and date range
• Summary statistics panel shows overall marketplace average rating and rating distribution bar chart
• Verified purchase badge on reviews from confirmed buyers
• Helpful vote count on each review
• Supports moderation workflow via CSS state classes (approved, pending, flagged)

E-Commerce Shop (3 layouts + product detail + comparison)

• Shop Full Width—maximum product grid with inline filter bar
• Shop Left Sidebar—category tree and filter panel on the left
• Shop Right Sidebar—filter panel on the right side
• Product Details—image gallery (Magnific Popup), price, strain info, add-to-cart, and related products
• Product Comparison—side-by-side spec table for up to 4 products
• Product cards: image, name, category badge, price, weight options, rating, and quick-add button
• Price range filter via ion.rangeSlider on all shop layouts
• Sort by price, popularity, rating, and newest via nice-select dropdown
• Grid and list view toggle on all shop archive pages

User and Transaction Pages (login, register, checkout, order)

• Login page—email/password form with social sign-in placeholders and forgot password link
• Register page—new user registration with age-verification gate (cannabis compliance)
• Checkout page—multi-step: cart review, delivery details, payment method, and order summary
• Order Details page—order confirmation with line items, totals, vendor info, and estimated delivery
• All forms use proper label/input associations for accessibility
• Inline field validation with accessible error messaging
• Register page includes date-of-birth field and age confirmation checkbox to meet cannabis legal requirements

Add Vendor System

• Add Vendor page—multi-section form for businesses to submit their listing
• Form sections: Business Info, Location, Contact Details, Business Hours, Categories, Media Upload
• Business hours picker with open/closed toggle for each day of the week
• Category and sub-category multi-select (dispensary, medical clinic, grower, processor, lab, pharmacy, coffee shop)
• Map pin placement UI—vendor sets their own location by clicking on an embedded map
• Logo and cover image upload fields with preview
• All form fields are fully accessible with associated labels and ARIA descriptions

Blog System (3 layouts)

• Blog Default—standard grid layout with featured image, excerpt, and meta
• Blog Style 2—alternate card arrangement for editorial or magazine feel
• Blog Details—single post layout with full typography, author bio, comments section, and related posts
• Blog card elements: featured image, category tag, date, author, read-time, title, and excerpt
• Sidebar on blog detail page: search, categories, popular posts, and tag cloud widgets
• Comments section includes nested replies and comment form with proper label associations
• Article JSON-LD schema markup on blog detail page for SEO

Navigation and Search Filters

• Sticky header with logo, main navigation, search bar, and account/cart icons
• Mega-menu support for category-rich cannabis marketplaces
• Mobile navigation with aria-expanded toggle and slide-down panel
• Hero search bars on home layouts: search by product name, category, and location
• ion.rangeSlider for price and distance range filters on listing and shop pages
• nice-select for clean, styled dropdowns on all filter bars
• Grid / list view toggle on all archive and shop pages
• Active filter tags display applied filters with individual remove buttons
• Breadcrumb navigation on all inner pages for orientation and SEO

SEO and Structured Data

• JSON-LD structured data on every page: WebSite, LocalBusiness, Product, Article, BreadcrumbList schema types
• Open Graph meta tags (og:title, og:description, og:image, og:type) on all pages
• Twitter Card meta tags on all pages
• Canonical URL meta tags to prevent duplicate content issues
• Semantic HTML5 elements throughout: header, nav, main, section, article, aside, footer
• Proper heading hierarchy (h1 through h6) on every page
• Alt attributes on all images
• robots meta and viewport meta on every page
• Breadcrumb JSON-LD on all inner pages
• Blog detail page includes Article schema with datePublished, author, and image

Typography and Design

• Poppins (Google Fonts) for all headings—modern, geometric, highly legible
• Open Sans (Google Fonts) for body text—the most widely used body font on the web
• Default primary colour: Teal-Green #268968—natural, cannabis-industry appropriate
• 8 runtime colour themes cover every brand personality from medical-professional (slate) to bold-retail (red/orange)
• Consistent 8px spacing grid across all components
• Card components use subtle shadows and rounded corners for a modern marketplace feel
• Badge and tag system for categories, strain types, and deal labels
• Star rating component reused consistently across listing cards, vendor profiles, product pages, and reviews
• All icon usage via Font Awesome 6—no custom SVG sprite required
• Swiper slider used for testimonials, featured products, and home hero sections

Performance and Code Quality

• Clean, well-commented HTML5 with logical section structure on every page
• CSS organised by component—easy to locate and override any style
• JavaScript follows IIFE module pattern with strict mode—no global namespace pollution
• Bootstrap 5.3.8 (latest stable)—modern CSS variables, no jQuery dependency in BS components
• Colour theming via CSS custom properties—one variable change affects the entire template
• Accessibility widget is self-bootstrapping—zero configuration required
• Leaflet loaded only on map pages—no unnecessary library weight on non-map pages
• Google Fonts loaded with font-display: swap to prevent render blocking
• Images use width and height attributes to prevent layout shift (CLS)
• All third-party libraries are version-pinned for reproducible builds

Cross-Browser and Device Compatibility

• Tested in Chrome, Firefox, Safari, Edge (latest stable versions)
• Fully responsive across mobile (320px), tablet (768px), and desktop (1200px+) breakpoints
• Bootstrap 5.3.8 responsive grid used for all layouts
• Touch-friendly: all interactive elements meet the 44×44px minimum touch target size
• Swiper slider is touch and swipe enabled on mobile
• Leaflet map is touch-pannable and pinch-zoomable on mobile
• Sticky header collapses to mobile hamburger nav at tablet breakpoint
• All tables (comparison, order details) use horizontal scroll on small screens
• Magnific Popup lightbox is touch-swipeable on mobile

Use Cases (7 industry types)

• Dispensary directory and locator portal—list, map, and geo-locate dispensaries in a city or region
• Medical cannabis clinic finder—help patients find licensed medical practitioners and clinics
• Recreational store locator—consumer-facing store finder for legal recreational markets
• Multi-vendor cannabis marketplace—growers, processors, and retailers all on one platform
• Cannabis coffee shop directory—coffee shop and social consumption venue listings
• Cannabis pharmacy and lab directory—licensed pharmacy and testing lab finder
• Cannabis grower and processor B2B marketplace—wholesale supply-chain connections between growers and processors

Pages Included (full list with live links)

• index.html—Default home layout
• homepage-1.html—Home layout 1
• homepage-2.html—Home layout 2
• homepage-3.html—Home layout 3
• homepage-4.html—Home layout 4
• homepage-5.html—Home layout 5
• homepage-6.html—Home layout 6
• homepage-7.html—Home layout 7
• homepage-8.html—Home layout 8
• listing-archive-full.html—Listing archive full width
• listing-archive-left.html—Listing archive left sidebar
• listing-archive-right.html—Listing archive right sidebar
• listing-detail.html—Listing detail page
• list-view.html—Compact list view
• vendor.html—Vendor profile default
• vendor-style-1.html—Vendor profile style 1
• vendor-style-2.html—Vendor profile style 2
• vendor-map.html—Interactive Leaflet vendor map
• add-vendor.html—Add vendor submission form
• shop-full-width.html—Shop full width
• shop-left.html—Shop left sidebar
• shop-right.html—Shop right sidebar
• product-details.html—Product detail page
• comparison.html—Side-by-side product comparison
• login.html—User login
• register.html—User registration with age gate
• checkout.html—Multi-step checkout
• order-details.html—Order confirmation and details
• blog.html—Blog archive default
• blog-style-2.html—Blog archive style 2
• blog-details.html—Single blog post
• contact.html—Contact page
• about.html—About page
• geo-locator.html—GPS-based nearest dispensary finder
• ex-deals.html—Exclusive deals and promotions
• reviews.html—Community reviews

Credits and Sources

• Bootstrap 5.3.8—https://getbootstrap.com (MIT License)
• Popper @popperjs/core 2.11.8—https://popper.js.org (MIT License)
• jQuery 3.x—https://jquery.com (MIT License)
• Swiper—https://swiperjs.com (MIT License)
• Leaflet.js—https://leafletjs.com (BSD 2-Clause License)
• Magnific Popup—https://dimsemenov.com/plugins/magnific-popup (MIT License)
• ion.rangeSlider—http://ionden.com/a/plugins/ion.rangeSlider (MIT License)
• nice-select—https://hernansartorio.com/jquery-nice-select (MIT License)
• Font Awesome 6—https://fontawesome.com (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT)
• Google Fonts: Poppins and Open Sans—https://fonts.google.com (SIL Open Font License)
• Demo images from Unsplash—https://unsplash.com (Unsplash License)
• Demo images from Pexels—https://pexels.com (Pexels License)

Changelog

• See version history below

v1.2  03/10/2026
- ARIA 1.2 full compliance pass on all 38+ pages
- Added skip-to-main-content link on every page
- Added semantic main landmark on every page
- focus-visible 3px solid outline on all interactive elements
- Added aria-label to all social icon links
- Swiper slider keyboard navigation and ARIA roles
- Mobile nav toggle aria-expanded attribute
- Back-to-top button aria-label added
- Bundled 30-feature accessibility widget (ADA / WCAG 2.1 AA / Section 508 / EU / AODA)

v1.1  02/27/2026
- Upgraded Bootstrap to 5.3.8
- Upgraded Popper to @popperjs/core 2.11.8
- Migrated all data-* attributes to data-bs-* (Bootstrap 5 standard)
- Added bootstrap-compat.css shim for legacy attribute fallback
- Added 8-colour runtime theme switcher (mht-switcher panel)
- CSS custom property system (--mht-primary) for all theme colours
- Theme selection persisted to localStorage

v1.0  Initial release
- 38+ pages: 9 home layouts, listing archive (3 layouts), listing detail, list view
- Vendor profiles (3 styles), vendor map, add vendor form
- Shop (3 layouts), product detail, product comparison
- User pages: login, register, checkout, order details
- Blog (2 archive layouts + single post)
- Utility pages: contact, about, geo-locator, exclusive deals, community reviews
- Bootstrap 5, Swiper, Leaflet, Magnific Popup, ion.rangeSlider, nice-select
- JSON-LD structured data and Open Graph meta on all pages
- Poppins + Open Sans Google Fonts
- Teal-Green #268968 primary colour