Skip to main content

How to Add a Timer to Collection Pages

Create urgency on collection pages to encourage faster browsing and purchasing decisions.

Two Methods​

You can add timers to collection pages using either Collection targeting (automatic) or App Block mode (manual placement).

This method automatically shows the timer on all selected collection pages.

  1. Create or edit a timer: Navigate to Timers and create a new timer or edit an existing one.
  2. Choose a layout: Select a layout that works well on collection pages:
    • Top: Places the timer above the collection products
    • Container: Allows flexible positioning within the collection layout
    • Full width: Creates a banner-style timer across the collection page
  3. Configure timer settings: Set your timer type, content, and styling as desired.
  4. Set collection targeting:
    1. Scroll to the "Targeting" section.
    2. Leave "Show on pages" unchecked (or check "Home page" if you want it there too).
    3. Find the "Selected collections" section.
    4. Click "Choose Collection" to open the resource picker.
    5. Select one or multiple collections where you want the timer to appear.
    6. Click "Add" to confirm your selection.
    7. The selected collections will appear in a box below.
  5. Exclude option (optional): Check "Exclude selected collections" if you want to show the timer on all collections except the ones you selected.
  6. Activate and save: Ensure "Active" is checked and click "Save".

Result: The timer will automatically appear on all selected collection pages, typically near the top of the collection content.

Method B: Using App Block Mode (Precise Positioning)​

For pixel-perfect control over timer position on collection pages.

  1. Get the Timer ID: In your timer settings, locate the Timer ID in the "Targeting" section and copy it.
  2. Set theme editor type: Select "Apps block" as the "Theme editor type" and save the timer.
  3. Open theme editor: Go to Online Store > Themes > Customize.
  4. Navigate to a collection page: Use the top dropdown to select a Collection page.
  5. Add the app block: Click "Add block" and find "Ultima Countdown Timer" under the "Apps" section.
  6. Position the block: Drag the block to your desired location (e.g., above the product grid, below the collection description, or in the sidebar).
  7. Enter the Timer ID: Paste the copied Timer ID into the block settings.
  8. Save the theme: Click "Save" in the theme editor.

Pro Tip: Use Method A for showing the same timer across multiple collections. Use Method B when you need precise positioning or different timers for different collections.