Association Themes
Layout & image-size guide · homepage & interior pages · Sunrise
DEV / CONTENT SPEC
The homepage structure is shared across every pre-made look. Only the skin, accent color, and hero style change; the image slots below stay the same. Feature cards use built-in SVG icons, so they need no images. Sizes are the display size; supply 2× assets for retina where noted.
Logo 240×60
Hero (Split/Overlay) 1600×900
News image 800×450
Ad leaderboard 728×90
Ad rectangle 300×250
Ad skyscraper 160×600
Ad square 250×250
Sponsor logo 200×64
Homepage layout options
Five ready-made homepage structures built from the same modules. Only the order and emphasis change. Read each top-to-bottom to see what it leads with. Set the site default in Customizer → MemberFront Association → Homepage layout.
Live1ClassicBalanced & complete
Hero bannerQuick linksFeature cardsSpotlight storyJoin / Member CTANews gridEvents & newsSocial feedAd banner
Leads with Quick links
Live2EditorialNews-forward
Hero bannerNews gridFeature cardsEvents & newsSocial feedSpotlight storyJoin / Member CTAAd banner
Leads with News grid
Live3ConversionJoin-focused
Hero bannerJoin / Member CTAQuick linksFeature cardsOpen contentSpotlight storyEvents & newsSocial feedAd banner
Leads with Join / Member CTA
Live4SpotlightStory-forward
Hero bannerSpotlight storyFeature cardsJoin / Member CTANews gridEvents & newsSocial feedAd banner
Leads with Spotlight story
Live5CommunityEvents-forward
Hero bannerQuick linksEvents & newsSocial feedFeature cardsOpen contentJoin / Member CTANews gridAd banner
Leads with Quick links
Annotated layout
JOIN · DONATE · CONTACT · SEARCH · [ username ] [ password ] [ Sign in ]
Logo · 240 × 60Membership Education Events Advocacy Resources About [ Become a member ]
Hero · Split shown (Overlay = full-bleed bg; Bold = no image)
Hero image1600 × 900 (shows ~700×450)
EYEBROW
Headline goes here
Sub-text · [ Join today ] [ Explore benefits ]
Quick links row · text only
Job Board →
Find a Provider →
Upcoming Events →
Renew Dues →
Feature cards · SVG icons (no images)
Spotlight (two-column) + sidebar ad
KICKER
Spotlight heading
Body copy · [ Read more ]
Join card (text)
AD300 × 250
Member value strip · text tasks, no images
Renew →
CE transcript →
Your chapter →
Member deals →
News grid · post featured images
News image800 × 450
TAG · Title
News image800 × 450
TAG · Title
News image800 × 450
TAG · Title
Events + news feeds · text only | then leaderboard ad
Social feed · curated cards (icons only, no images / no external scripts)
in · @handle
Post text preview…
2d · View post →
▶ · Channel
Post text preview…
1w · View post →
◉ · @handle
Post text preview…
3d · View post →
Sponsors / partners · logos
Logo200 × 64
Logo200 × 64
Logo200 × 64
Logo200 × 64
Hero style options
Each preset uses one of three hero styles (Customizer → Hero). The rest of the page is identical across all three. Only the hero changes.
Text panel
+ buttons
Image
Split · image 1600×900 (right panel)
Caption card + buttons
Float
Overlay · image 1600×900 (full-bleed)
Oversized headline
Bold · no image
Interior page layout
Pages (About Us, etc.) use a contextual left sidebar built from your page hierarchy, with no menu needed. Set each page’s Parent under Page Attributes and the nested, expandable section nav builds itself. The current branch auto-opens and the current page is highlighted.
JOIN · DONATE · CONTACT · SEARCH · [ Log in popup ]
Logo · 240 × 60Membership Education Events Advocacy About ▾ Contact
About Us
Sub Page One ▾
Third Level One ›
Third Level Two
Sub Page Two ›
Sub Page Three ›
Become a member
AD250 × 250
Widgets (search, etc.)
Home / About Us / Sub Page One / Third Level One
Page Title
Image specifications
| Slot | Display size | Supply | Where it is set |
|---|
| Site logo | 240 × 60 | 480 × 120 (2×), transparent PNG/SVG | Customizer → Site Identity → Logo |
| Hero image: Split / Overlay | ~700 × 450 / full-bleed | 1600 × 900 (cover-cropped) | Customizer → Hero → Hero image (Bold uses none) |
| News grid image | ~370 × 170 | 800 × 450 (16:9) | Post → Featured image |
| Ad: Leaderboard | 728 × 90 | 728 × 90 | Appearance → Widgets → Ad: Leaderboard |
| Ad: Sidebar rectangle | 300 × 250 | 300 × 250 | Appearance → Widgets → Ad: Sidebar |
| Ad: Skyscraper | 160 × 600 | 160 × 600 | Appearance → Widgets → Ad: Skyscraper |
| Ad: Square | 250 × 250 | 250 × 250 | Appearance → Widgets → Ad: Square (interior sidebar) |
| Sponsor logo | ~200 × 64 | 400 × 128 (2×), transparent PNG | Sponsors row |
| Post / page featured | ~712 wide | 1200 × 675 (16:9) | Post/Page → Featured image |
Feature cards, quick-links, member strip, events/news feeds, the social feed, and the footer are text/icon only, with no images required. The social feed is curated in the Customizer (handles, post text, follow links) and pulls no external scripts.