# Adding the HTML
### ✍️ Objective - To display categories in homepage
Open the layout.html file
This is how a bare minimum layout.html file would look like, it has some code which is required for a theme to function properly, avoid removing any of this code.
```html
{% include './../../dukaan/common/theme-fonts.html' %}
{{ 'splide.min.css' | css | static }}
{{ 'layout.css' | css | static }}
{{ 'styles.css' | css | static }}
{% include './../../dukaan/common/seo_tags/commonSeoTags.html' %}
{% include './../../dukaan/common/theme-colors.html' %}
{% block head %}
{% endblock head %}
{{ 'head' | DukaanBlocks }}
{% include './../../dukaan/common/spinner-loader.html' %}
{% include './../../dukaan/common/hellobar.html' %}
{% block content %}
{% endblock content %}
{% include '../../dukaan/common/bxgy-sticky-footer.html' %}
{% include '../../dukaan/common/store-open-sticky.html' %}
{% block postfooter %}
{% endblock postfooter %}
{{ 'footer' | DukaanBlocks }}
{% include './product-variant-templates.html' %}
{{ 'variant-utils.js' | js | static }}
{{ 'dukaan-utils.js' | js | static }}
{{ 'layout.js' | js | static }}
{{ 'dukaan-coupons.js' | js | static({ defer: true }) }}
{{ 'dukaan-offers.js' | js | static({ defer: true }) }}
{{ 'axios.min.js' | js | static({ defer: true }) }}
{{ 'splide.min.js' | js | static }}
{{ 'common-components.css' | css | static }}
{% include './../../dukaan/common/auth.html' %}
{% include '../../dukaan/common/multilanguage.html' %}
{% include './../../dukaan/common/common-scripts.html' %}
{% include '../../dukaan/common/snackbar.html' %}
{% block script %}
{% endblock script %}
```
If we check now, our site would be completely blank. Now, we will try to display a dummy category.
We will display a category image and category name, go ahead and paste this code inside the body tag.
```html
```
This code snippet creates a simple HTML structure to display a category card within a container. The category card includes an image and the category name, for now we have hardcoded a dummy image and category name, both wrapped within a hyperlink element for navigation purposes.
\
If you save & preview the changes, you'd see something like this
Let's try to add some more dummy categories, the updated code would be
```html
```
This is how our site looks now
Now that we can display dummy data with HTML its time to flare up the tags by spicing it up with some CSS in the next chapter.
For reference - The contents of layout.html file after the above changes
```html
{% include './../../dukaan/common/theme-fonts.html' %}
{{ 'splide.min.css' | css | static }}
{{ 'layout.css' | css | static }}
{{ 'styles.css' | css | static }}
{% include './../../dukaan/common/seo_tags/commonSeoTags.html' %}
{% include './../../dukaan/common/theme-colors.html' %}
{% block head %}
{% endblock head %}
{{ 'head' | DukaanBlocks }}
{% include './../../dukaan/common/spinner-loader.html' %}
{% include './../../dukaan/common/hellobar.html' %}
