
Small Spotlight with Component Body
Highlight a logo larger with the Mission and Vision statement. Mammoth is a great example of this component type.
Spotlight
Serve as the hero anchor of your page with high-impact visuals, dynamic multi-image slideshows, and flexible text overlays. Designed primarily for homepages and primary landing sections, the Spotlight component offers four distinct height and layout options in both full-bleed and contained formats to capture visitor attention immediately.
Component Features & Options
Check out the features that make Spotlight such a versatile component.
Hero Section & Main Announcements: Create a commanding entrance for homepages with bold imagery and high-priority messaging.
Video & Image Slideshows: Cycle through an unlimited series of high-resolution photos or video slides to showcase campus life and events.
Mission & Core Values Split: Pair rotating visuals with static text blocks to present school mission statements, vision pillars, or leadership messages.
Testimonials & Success Stories: Highlight student, parent, or alumni quotes alongside compelling portrait imagery.
Four Layout Styles: Choose between Large (700px tall), Medium (500px tall), Small (split screen with rotating image and text side-by-side), or Small with Component Body (split screen with rotating images alongside static text).
Contained vs. Uncontained: Display as a full-bleed banner stretching across the browser width or keep contained within standard page margins.
Unlimited Image Slideshow: Add as many images as needed to create a continuously auto-scrolling visual story.
Overlay Text Styling: For Large and Medium layouts, overlay text over a black gradient or within a semi-transparent dark box for maximum readability.
Flexible Text Alignment: Position your overlay messaging on the left, right, center, or bottom of the frame to align with your image's focal point.
None (Display As-Is): Show uploaded images in their original proportions without scaling or background fills.
Blur Background: Fill any surrounding container space with a soft, blurred version of your image for a modern, polished look.
Crop to Fit: Scale and crop your photos automatically so they fill the entire component frame seamlessly.
Already part of the ParentSquare community? Simply sign in to browse our complete collection of user guides, quick-start tips, and practical walk-throughs.
Hero Section & Main Announcements: Create a commanding entrance for homepages with bold imagery and high-priority messaging.
Video & Image Slideshows: Cycle through an unlimited series of high-resolution photos or video slides to showcase campus life and events.
Mission & Core Values Split: Pair rotating visuals with static text blocks to present school mission statements, vision pillars, or leadership messages.
Testimonials & Success Stories: Highlight student, parent, or alumni quotes alongside compelling portrait imagery.
Four Layout Styles: Choose between Large (700px tall), Medium (500px tall), Small (split screen with rotating image and text side-by-side), or Small with Component Body (split screen with rotating images alongside static text).
Contained vs. Uncontained: Display as a full-bleed banner stretching across the browser width or keep contained within standard page margins.
Unlimited Image Slideshow: Add as many images as needed to create a continuously auto-scrolling visual story.
Overlay Text Styling: For Large and Medium layouts, overlay text over a black gradient or within a semi-transparent dark box for maximum readability.
Flexible Text Alignment: Position your overlay messaging on the left, right, center, or bottom of the frame to align with your image's focal point.
None (Display As-Is): Show uploaded images in their original proportions without scaling or background fills.
Blur Background: Fill any surrounding container space with a soft, blurred version of your image for a modern, polished look.
Crop to Fit: Scale and crop your photos automatically so they fill the entire component frame seamlessly.
Already part of the ParentSquare community? Simply sign in to browse our complete collection of user guides, quick-start tips, and practical walk-throughs.
Examples