Agile - Premium Shopify Theme
Shopify GuidesContact Us
  • Agile - Greeting
  • THEME INSTALLATION
    • Recommended Apps
    • Create Required Metafields
  • Theme Setting
    • Favicon
    • Layout
    • Badges
    • Colors
    • Typography
    • Product
    • Color swatches
    • Social media
    • Search behavior
    • Animation
    • Currency format
    • Cart
    • Checkout
    • Cookies
    • Custom CSS
  • Sections
    • Announcement bar
    • Header
    • Featured product
    • Collection list
    • Rich text
    • Image with text
    • Slideshow
    • Newsletter
    • Contact form
    • Video
    • Custom liquid
    • Blog posts
    • Countdown timer
    • Divider
    • FAQ
    • Google map
    • Icons with text
    • Image with text overlay
    • Logo list
    • Promotion banner
    • Recently viewed products
    • Scrolling text
    • Shopable image
    • Spacing
    • Testimonials
    • Tiktok video
    • Video with text overlay
    • Featured collection
    • Search
    • Quick shop
    • Newsletter popup
    • Age verifier popup
    • Footer
    • Mobile navigation bar
    • Cart drawer
    • Page heading
    • Product testimonials
    • Shopable video
    • Image tabs
    • Image testimonials
    • Image comparison slide
    • Bundle products
  • Collections & Products Pages
    • Products
      • Page template sections
        • Product information
        • App
        • Related products
    • Collections
      • Page template sections
        • Product grid
        • Collection banner
    • Collections list
      • Page template sections
        • Collection list page
  • Other pages
    • Cart
    • Checkout
    • Search
    • Blogs
      • Page template sections
        • Blog carousel
        • Blog posts
    • Blog posts
    • 404 page
    • Password
    • Our store
    • About us
      • Page template sections
    • Contact us
      • Page template sections
    • Faqs
  • FREQUENTLY ASKED QUESTIONS
    • How to change Elements of page?
      • Home Page
        • Gorde
        • Obik
        • Glamor
        • Serums
        • Rustic
    • How to translate a theme after adding a new default language?
    • Theme translation
    • Change currency
    • The desktop screen look more like on a tablet
    • Change free shipping message
    • How to setup pre-order products?
    • Staff account
Powered by GitBook
On this page
  • Section settings
  • General setting
  • Content settings
  • Vertical content setting
  • Background image
  • Mobile layout
  • Section padding
  1. Sections

Countdown timer

Last updated 1 year ago

A Countdown timer on a website creates urgency, promotes offers, engages users, enhances visuals, boosts conversions, and supports data collection, contributing to an enriched user experience and website success.

Section settings

General setting

Setting
Description

Section width

3 options for container

  • Stretch width: span the section width regardless of screen size.

  • Fix width: depends on your page content width in Theme settings -> Layout.

  • Expand full width: takes up the entire space on the page and it usually resizes itself to fit the size of the screen.

Color scheme

Select colors from Theme settings -> Colors

Layout

The position of the content

  • Horizontal: Horizontal layout positions elements side by side

  • Vertical: Vertical layout stacks elements from top to bottom,

Content settings

Setting
Description

Subheading

Subheading content

Heading

Heading content

Description

Description content

Button label

The title of button

Button link

The link URL you want to add

Button style

The style of the button

  • Fill

  • Outline

End time

Set the countdown timer in the format month-day-year

Size

Size: Customize the font size of the content with 3 options

  • Small

  • Medium

  • Large

Vertical content setting

This setting only works when you choose the vertical layout

Setting
Description

Desktop content position

9 options for the desktop content position

  • Top left

  • Top center

  • Top right

  • Middle left

  • Middle center

  • Middle right

  • Bottom left

  • Bottom center

  • Bottom right

-> Position is automatically optimized for mobile.

Content alignment

3 options for the content alignment

  • Left

  • Center

  • Right

Background image

Setting
Description

Image

Upload desktop background image, and it will be displayed for mobile if no mobile image is uploaded

Mobile image

Upload mobile background image

Image overlay opacity

Customize the image overlay opacity

Image height

Image height: Adjust the height of the background images

  • Adapt to image

  • Small

  • Medium

  • Large

Mobile layout

  • Show text bellow on mobile: Content beneath the image

  • Reset color scheme setting on mobile: When enabled, the content color will be displayed in the default color scheme

Section padding

  • Top padding: Customize the top margin of the section

  • Bottom padding: Customize the bottom margin of the section