Media, Galleries and Effects
A Wappler learning hub for media-heavy pages, covering focused component tours for lightbox, masonry, lazy loading, slideshow, Swiper, background video, and image parallax.
Media, Galleries, and Motion
Use this hub when a page is driven by media-heavy frontend components. Start with the specific behavior you need, then continue into the focused single-component tour for that workflow.
Choose a media component
Section titled “Choose a media component”Start with the exact media behavior you need, then continue into the right focused workflow.
Start here
Lightbox
Use App Connect Lightbox to keep media browsing inline until the user asks for a larger preview, then control the overlay from one shared page-level component.
Masonry
Use App Connect Masonry to convert a Bootstrap row into an editorial wall while keeping column, gutter, and order control in Wappler.
Lazy Load Images
Use lazy loading, placeholders, and responsive image sources so media-heavy pages stay fast while still looking polished.
Slideshow
Use App Connect Slideshow for one dominant frame at a time, with simple navigation, paging, and timing controls that keep the sequence readable.
Swiper
Use App Connect Swiper for curated sequences where navigation, pagination, autoplay, and responsive slide counts all support one deliberate story.
Background Video
Use App Connect Background Video to add restrained looping motion behind readable content without complicating the section structure.
Image Parallax
Use Image Parallax as a restrained depth cue on real page imagery without letting the effect overpower the content.
Related families
HTML Editor: Front-End Learning
HTML Editor front-end hub linking the editor tours with Bootstrap, App Connect, forms, themes, media, and page/layout paths.
Front-End Components
Start here for UI building in Wappler: Bootstrap components, forms, themes, and the editor surfaces used to shape frontend behavior.
Assets Manager Overview
A quick orientation to Assets Manager so you can understand reusable assets, media handling, and the bridge between files and UI resources.
Pages and Layouts
Start here to learn how pages and layouts fit in your workflow, then move into Pages Manager, the HTML Editor, and concrete page patterns.
Go to
How-To Guides
Browse practical how-to entry points across Wappler so you can jump straight into guided task-based learning.
Front-End Components
Start here for UI building in Wappler: Bootstrap components, forms, themes, and the editor surfaces used to shape frontend behavior.
Wappler Docs Index
Structured hub for Wappler learning paths across onboarding, how-to guides, reference tours, switching guides, and product-area indexes.