Broadcast v6.2 has been released - Learn more about
What's new
Broadcast Documentation
NewSupport
Broadcast v5
Broadcast v5
  • About Broadcast
    • Broadcast theme documentation
    • Feature requests
  • Updates
    • What's new in Broadcast
      • Release Notes
      • About v5.8 release
      • About v5.7 release
      • About v5.6 release
      • About v5.5 release
      • About v5.4 release
      • About v5.3 release
      • About v5.2 release
      • About v5.1 release
      • About v5.0 release
      • About v4.0 release
  • Sections
    • Broadcast sections
      • Demo store sections
      • Accordion
      • Accordion group
      • Before and After
      • Blog posts
      • Collection list
      • Collection list hover
      • Countdown
      • Contact form
      • Custom code
      • Custom content
      • Divider
      • Featured blog posts
      • Featured collection
      • Featured product
      • Highlights
      • Image banner
      • Image with text
      • Image with text slider
      • Map
      • Multicolumn
      • Newsletter
      • Press logos
      • Products with image
      • Rich text
      • Rich text with columns
      • Scrolling text
      • Shop the look
      • Sidebar
      • Slideshow
      • Tab collections
      • Testimonials
      • Text columns with icons
      • Text columns with images
      • Text promo
      • Text with products
      • Timeline
      • Video
  • Theme settings
    • Theme settings
      • Colors
      • Typography
      • Buttons
      • Layout
      • Search
      • Social media
      • Product Grid
      • Product Form
      • Cart
  • Header
    • Header
      • Demo store header settings
      • Header section
      • Navigation images
      • Quantity indicators
      • Transparent header
      • Header icons
      • Social icons
      • Sticky header
      • Target settings
    • Toolbar
      • Header toolbar
      • Video walkthrough
    • Announcement bar
      • Announcement bar settings
      • Free shipping message
      • Countdown timer
      • Text announcement
      • Custom code
      • Target settings
  • Footer
    • Footer settings
    • Footer blocks
      • Link list
      • Newsletter
      • Social
      • Text
      • Page
  • Products
    • Product pages
      • Accordion section
      • Custom form field
      • FAQ Accordions
      • Final Sale
      • Free products
      • Low inventory message
      • Out-of-stock notification
      • Pre-order using metafields
      • Pre-order products using tags
      • Product Theme Blocks
        • Title
        • Price
        • Variant picker
        • Buy buttons
        • Siblings
        • Description
        • Upsell
        • Inventory countdown
        • Sharing
        • Local pickup
        • Text
        • Custom code
        • Icon
        • Divider
        • Line item property
        • Feature
        • Complementary products
        • Popup
      • Related products
      • Sale items
      • Settings and layout
      • Siblings
      • Size charts
      • Swatches (Updated)
      • Swatch collection styles
      • Tabs and accordions
      • Tab content using metafields
      • Unique image banners
      • Upselling
      • Variant images
  • Collections
    • Collection pages
      • Collection page settings
      • Swatch collection styles
      • Product badges
      • Product badges with metafields
      • Product filtering
      • Quick add
      • Sub-collections
      • Cutline second line
      • Featured image
  • Overlay
    • Popups
      • Popups Theme Blocks
      • Large newsletter
      • Text promo
      • Small newsletter
      • Cookie consent
      • Coupon codes
      • Popup Behavior and Target
  • Promotions
    • Upselling
      • Upselling with metafields
      • Upselling with tags
  • Siblings
    • Product siblings
      • About product siblings
      • How to setup siblings
      • Siblings metafields
      • Siblings color
      • Siblings collection
      • Siblings product setup
      • Siblings block
      • Customizations
  • Pages
    • Page templates
      • Demo store about page
      • Creating page templates
      • Page section
      • About page templates
  • Blogs
    • Blogs and articles
      • About blogs and articles
      • Featured posts
      • Article page
      • Product links in blog posts
      • Article theme blocks
  • FAQ
    • Frequently asked questions
      • How to update Broadcast
      • Default theme content
      • Share preview link
      • Hiding prices
      • How to use sections
      • Section blocks
      • How to remove Powered by Shopify
      • Improving the speed of your site
      • How to prevent your images from getting cropped
      • Check your theme version
      • CSS customizations
  • License
    • Theme license
  • Support
    • Contacting support
    • Missing Cart Drawer after Updating
Powered by GitBook
On this page
  • Flexible
  • Customize
  • Video Overview
Export as PDF
  1. Sections
  2. Broadcast sections

Before and After

Showcase results with Broadcast's 'Before and After' section

PreviousAccordion groupNextBlog posts

Display any two images with our interactive slider to present the before state and after state. A powerful sales tool to showcase your services.

Flexible

When you add text and button content, use it as a two-column section. Optionally, display it as a full-width single column without blocks.

Customize

  • In the section settings, add two similar sized images for best results.

  • Adjust the image aspect ratio for taller or wider images.

  • Use a Rich Text section above for a large single-column heading, or add the heading, text and button blocks to build a two-column version.

  • Adjust the section colors and padding for the perfect look.

Video Overview

Discover how to customize and set up the 'Before and After' section in this video walkthrough:

Video: How to use the Before and After section
Before and after interactive slider