# Section assets

> Bundle a Shoplazza Theme section's own CSS and JavaScript with the section-specific javascript and stylesheet Liquid tags, and see where that code is injected.

Sections can bundle their own JavaScript and stylesheet assets using the following section-specific Liquid tags:

* [\{% javascript %}](./section-assets#javascript)
* [\{% stylesheet %}](./section-assets#stylesheet)

## javascript

The [\{% javascript %}](/docs/theme/references/liquid/tags/theme-tags#javascript) tag can be used to include JavaScript for a section:

```liquid title="Example"
{% javascript %}
  const type = document.querySelector('.product-detail').dataset.productId;
{% endjavascript %}
```

The content from `{% javascript %}` tags injected into the before of the `</body>` tag.

The content from each `{% javascript %}` tag needs to be wrapped in a self-executing anonymous function so that any variables are defined within a closure, and runtime exceptions won't affect other sections.

## stylesheet

The [\{% stylesheet %}](/docs/theme/references/liquid/tags/theme-tags#stylesheet) tag can be used to include CSS styles for a section:

```liquid title="Example"
<div class="product-detail">
  <!-- product detail content -->
</div>

{% stylesheet %}
  .product-detail {
    margin-top: 100px;
    margin-bottom: 100px;
  }
{% endstylesheet %}
```

The content from `{% stylesheet %}` tags will be placed in the position of the element before the section.
