# Basic code editing

We shall now move into learning how to make edits into our theme to change the structure, looks and functionality.

### ✍️ Objective - To show list of categories in a carousel in layout.html page

We will divide it into 4 parts

1. [Adding the HTML](/basic-code-editing/adding-the-html.md) for the product card to display (If we were building a house, this step would be building the structure of the house using cement, wood, bricks)
2. [Adding the CSS](/basic-code-editing/adding-the-css.md) i.e. color, shadow and other visual elements to make it look appealing (painting the building, adding flooring, furniture, etc.)
3. [Adding the Javascript](/basic-code-editing/adding-the-javascript.md) i.e. functionality to the product card, like, what happens when someone clicks on a product, or hovers on it (Adding fans, lights, electric wiring, etc)
4. [Adding Nunjucks](/basic-code-editing/adding-nunjucks.md) for fetching real data and using it to display the products (Inviting people to live in the house)


---

# Agent Instructions: 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:

```
GET https://docs.mydukaan.io/basic-code-editing.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
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.
