section
Renders a section.
Rendering a section with the section tag renders a section statically. To learn more about sections and how to use
them in your theme, refer to Render a section.
Syntax
{% section 'name' %}
name
The name of the section file you want to render.
{% section 'header' %}
{% section 'header' %}{
"cart": {
"item_count": 2
},
"request": {
"origin": "https://polinas-potent-potions.myshopify.com",
"page_type": "index"
},
"routes": {
"account_url": "/account",
"cart_url": "/cart",
"root_url": "/",
"search_url": "/search"
},
"settings": {
"accent_icons": "text",
"cart_type": "notification",
"inputs_shadow_vertical_offset": 4,
"predictive_search_enabled": true,
"social_facebook_link": "",
"social_instagram_link": "",
"social_pinterest_link": "",
"social_snapchat_link": "",
"social_tiktok_link": "",
"social_tumblr_link": "",
"social_twitter_link": "",
"social_vimeo_link": "",
"social_youtube_link": ""
},
"shop": {
"customer_accounts_enabled": true,
"name": "Polina's Potent Potions"
}
}Output
<div id="shopify-section-header" class="shopify-section section-header"><link rel="stylesheet" href="//polinas-potent-potions.myshopify.com/cdn/shop/t/4/assets/component-list-menu.css?v=151968516119678728991663872413" media="print" onload="this.media='all'">
<link rel="stylesheet" href="//polinas-potent-potions.myshopify.com/cdn/shop/t/4/assets/component-search.css?v=96455689198851321781663872411" media="print" onload="this.media='all'">
<link rel="stylesheet" href="//polinas-potent-potions.myshopify.com/cdn/shop/t/4/assets/component-menu-drawer.css?v=182311192829367774911663872416" media="print" onload="this.media='all'">
<link rel="stylesheet" href="//polinas-potent-potions.myshopify.com/cdn/shop/t/4/assets/component-cart-notification.css?v=183358051719344305851663872409" media="print" onload="this.media='all'">
<link rel="stylesheet" href="//polinas-potent-potions.myshopify.com/cdn/shop/t/4/assets/component-cart-items.css?v=23917223812499722491663872408" media="print" onload="this.media='all'"><link rel="stylesheet" href="//polinas-potent-potions.myshopify.com/cdn/shop/t/4/assets/component-price.css?v=65402837579211014041663872409" media="print" onload="this.media='all'">
<link rel="stylesheet" href="//polinas-potent-potions.myshopify.com/cdn/shop/t/4/assets/component-loading-overlay.css?v=167310470843593579841663872415" media="print" onload="this.media='all'"><noscript><link href="//polinas-potent-potions.myshopify.com/cdn/shop/t/4/assets/component-list-menu.css?v=151968516119678728991663872413" rel="stylesheet" type="text/css" media="all" /></noscript>
<noscript><link href="//polinas-potent-potions.myshopify.com/cdn/shop/t/4/assets/component-search.css?v=96455689198851321781663872411" rel="stylesheet" type="text/css" media="all" /></noscript>
<noscript><link href="//polinas-potent-potions.myshopify.com/cdn/shop/t/4/assets/component-menu-drawer.css?v=182311192829367774911663872416" rel="stylesheet" type="text/css" media="all" /></noscript>
<noscript><link href="//polinas-potent-potions.myshopify.com/cdn/shop/t/4/assets/component-cart-notification.css?v=183358051719344305851663872409" rel="stylesheet" type="text/css" media="all" /></noscript>
<noscript><link href="//polinas-potent-potions.myshopify.com/cdn/shop/t/4/assets/component-cart-items.css?v=23917223812499722491663872408" rel="stylesheet" type="text/css" media="all" /></noscript>
<style>
header-drawer {
justify-self: start;
margin-left: -1.2rem;
}
.header__heading-logo {
max-width: 90px;
}
@media screen and (min-width: 990px) {
header-drawer {
display: none;
}
}
.menu-drawer-container {
display: flex;
}
.list-menu {
list-style: none;
padding: 0;
margin: 0;
}
Was this page helpful?