---
title: Steps Module
description: Navigate AGILE's Steps Module guide. Implement intuitive step-by-step functionalities for a streamlined user experience on your site.
---

## Steps

With easy customization options and intuitive layouts, the Steps Module allows you to present instructions, guidelines, or procedures in a visually engaging format on your HubSpot website.

## FAQs

### How many steps can I display using the Steps Module in AGILE?

The Steps Module supports showcasing a flexible number of sequential steps or processes, allowing you to present various instructions or procedures based on your needs.

### Is it possible to include descriptions or details for each step?

Absolutely. You can add descriptions, explanations, or specific details for each step, providing additional context or instructions as needed.

### Is the Steps Module responsive for different devices?

Yes, the module is designed to be fully responsive and compatible across various devices, ensuring a seamless viewing experience on desktops, tablets, and mobile devices.

## Getting Started

Inside the editing interface, utilize the Finder or search bar, inputting 'Steps' to locate the Steps Module, then seamlessly integrate it into your page for customization.

![Screenshot 2024-01-02 at 12.52.21 AM](https://agiletheme.atakinteractive.com/hs-fs/hubfs/Screenshot%202024-01-02%20at%2012.52.21%20AM.webp?width=506&height=446&name=Screenshot%202024-01-02%20at%2012.52.21%20AM.webp)

##### a. Finder → Steps

![Screenshot 2024-01-02 at 12.52.39 AM-1](https://agiletheme.atakinteractive.com/hs-fs/hubfs/Screenshot%202024-01-02%20at%2012.52.39%20AM-1.webp?width=506&height=446&name=Screenshot%202024-01-02%20at%2012.52.39%20AM-1.webp)

##### b. Choose a size

![Screenshot 2024-01-02 at 12.52.53 AM](https://agiletheme.atakinteractive.com/hs-fs/hubfs/Screenshot%202024-01-02%20at%2012.52.53%20AM.webp?width=506&height=446&name=Screenshot%202024-01-02%20at%2012.52.53%20AM.webp)

##### c. Add a Title and Sub Title

## Adding Steps

To add steps using the Steps Module in AGILE:

**- Access List Items and Click 'Add': **Access the list items or steps section and click on 'Add' to create a new step.

**- Choose Connection Type: **Determine whether you want the steps connected by a line to illustrate sequence or prefer them as standalone items without a connector.

**- Edit Title and Description for Each Step: **For each step, enter the title and a descriptive text to outline the instruction, task, or process associated with that step.

![Screenshot 2024-01-02 at 12.55.46 AM](https://agiletheme.atakinteractive.com/hs-fs/hubfs/Screenshot%202024-01-02%20at%2012.55.46%20AM.webp?width=506&height=458&name=Screenshot%202024-01-02%20at%2012.55.46%20AM.webp)

![Screenshot 2024-01-02 at 12.55.59 AM](https://agiletheme.atakinteractive.com/hs-fs/hubfs/Screenshot%202024-01-02%20at%2012.55.59%20AM.webp?width=506&height=458&name=Screenshot%202024-01-02%20at%2012.55.59%20AM.webp)

## Module Customization

Within the Styles tab of the Steps Module in AGILE, you'll find a myriad of customization options to refine its appearance. Adjust spacing to ensure a balanced layout, personalize the background with colors or images, and fine-tune the styles of steps' titles and content—customizing fonts, colors, and alignment. This level of customization allows you to create a visually engaging and harmonious Steps Module that seamlessly integrates with your website's design.

![Screenshot 2024-01-02 at 1.04.44 AM](https://agiletheme.atakinteractive.com/hs-fs/hubfs/Screenshot%202024-01-02%20at%201.04.44%20AM.webp?width=506&height=818&name=Screenshot%202024-01-02%20at%201.04.44%20AM.webp)

##### SUPPORT & CONSULTING

## Can’t Find an Answer?

Get live HubSpot CMS technical support from our customer service team, who can help you with any technical issues or questions you may have.

 Submit A Support Ticket  FAQ’s

## Install this theme

Click the button below to start using this wonderful theme

Install Now

![cta_image_38](https://agiletheme.atakinteractive.com/hs-fs/hubfs/Agile_Theme_2023/images/cta-features/cta_image_38.png?width=827&height=516&name=cta_image_38.png)