Building a Custom Section

Before you begin

This Codelab teaches you how to create a section for an existing Shopify theme. For this Codelab we will be building a countdown section. This is an often used feature that is provided by many apps on our store, but can actually be implemented as a section as well.

Timer running in editor


Basic experience in HTML, CSS and Javascript are required for this Codelab. Some experience with Liquid (the language in which Shopify templates are written in) is helpful but certainly not mandatory.

Learning objectives

  • Use your local development environment for working on themes
  • Add a custom section to existing themes
  • Make section configurable via settings in the theme editor

What you'll need (Shopify Account Requirements)

What you'll need (Libraries and Tools)