> For the complete documentation index, see [llms.txt](https://jdocs.themeparrot.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://jdocs.themeparrot.com/joomla-templates/business/layout-customization/home-style-1/build-your-finanical-tab.md).

# Build your finanical tab

### Build your financial tab

> Module position: home-4
>
> Module class suffix: Not used

![](/files/bYgOOM6Nk8bK3nISRgZ5)

If you want to display your information like this you have to create a custom module and publish the cutom module like below

#### Step-1:

![](/files/DqHWUJNABcArN3MACQDR)

#### Step-2:

![](/files/CDUjIBqkvBCO52eD2gyX)

#### Step-3:

![](/files/R4hyIyFRPZ2k1cFFTjrw)

#### Step-4:

Add the following code in your custom module

```html
<div class="h-block-4 h-block black">
    <div class="h-block-content">
        <div class="intro-block">
            <h2>Build your financial stability with us.</h2>
            <p>Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu. In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo. Nullam dictum felis eu pede mollis pretium. Integer tincidunt.</p>
        </div>
        <div class="row">
            <div class="col-md-4">
                <ul class="nav nav-stacked">
                  <li class="active">
                    <a href="#design-tab-1" data-toggle="tab">
                      <h4>Product Customization</h4>
                      <p>Aliquam lorem ante, dapibus in, viverra quis, feugiat a, tellus.</p>
                    </a>
                  </li>
                  <li>
                    <a href="#design-tab-2" data-toggle="tab">
                      <h4>Support services</h4>
                      <p>Aliquam lorem ante, dapibus in, viverra quis, feugiat a, tellus.</p>
                    </a>
                  </li>
                  <li>
                    <a href="#design-tab-3" data-toggle="tab">
                      <h4>User interface design</h4>
                      <p>Aliquam lorem ante, dapibus in, viverra quis, feugiat a, tellus.</p>
                    </a>
                  </li>
                </ul>
            </div>
            <div class="col-md-8">
                <div class="tab-content">
                  <div id="design-tab-1" class="tab-pane fade in active">
                    <img src="images/themeparrot/tab_images/shopping_image.png" alt="shopping_image" />
                   <h3>
                      Curabitur ullamcorper ultricies nisi
                    </h3>
                    <p>
                      Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem.Sed fringilla mauris sit amet nibh. Donec sodales sagittis magna.
                    </p>
                  </div>
                  <div id="design-tab-2" class="tab-pane fade in">
                    <img src="images/themeparrot/tab_images/support_image.png" alt="building a store for your client" />
                   <h3>
                      Curabitur ullamcorper ultricies nisi
                    </h3>
                    <p>
                      Nullam quis ante. Etiam sit amet orci eget eros faucibus tincidunt.Sed fringilla mauris sit amet nibh. Donec sodales sagittis magna.
                    </p>
                  </div>
                  <div id="design-tab-3" class="tab-pane fade in">
                    <img src="images/themeparrot/tab_images/template_image.png" alt="pricing table 01 min" />
                   <h3>
                      Curabitur ullamcorper ultricies nisi
                    </h3>
                    <p>
                      Aenean leo ligula, porttitor eu, consequat vitae, eleifend ac, enim.Sed fringilla mauris sit amet nibh. Donec sodales sagittis magna.
                    </p>
                  </div>
                </div>
            </div>
        </div>
        <span class="bg-span corner-top-left-bg"></span>
        <span class="bg-span corner-top-right-bg"></span>
    </div>
</div>
```


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter, and the optional `goal` query parameter:

```
GET https://jdocs.themeparrot.com/joomla-templates/business/layout-customization/home-style-1/build-your-finanical-tab.md?ask=<question>&goal=<endgoal>
```

`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is optional and describes the broader end goal you are ultimately trying to accomplish on behalf of the user. GitBook uses it to tailor the answer towards what is most useful for that goal.

The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.