Hi everybody !
To give you some context, I would like to have a simple landing page to collect email address with the names but without the header and footer while having them for the other pages. I've tried to add codes that I've seen here but without any result, like this one :
{% if page.handle == '...' %}
<style>
.header-wrapper.color-background-1.gradient, footer.footer.color-accent-1 {display: none;}
</style>
{% endif %}I'm using the theme Impact and here's the theme.liquid code :
{%- comment -%}
------------------------------------------------------------------------------------------------------------------------
NOTE TO DEVELOPERS: welcome to Impact theme! We hope that you will enjoy editing this theme as much as we did for
developing it. We have put a lot of work to make this theme as developer friendly as possible by offering you
hooks to integrate into critical parts of the theme. You will find the complete technical documentation (including
all events, dependencies...) in the "documentation.txt" file, located in the Assets folder.
------------------------------------------------------------------------------------------------------------------------
{%- endcomment -%}
<!doctype html>
<html class="no-js" lang="{{ request.locale.iso_code }}" dir="{% render 'direction' %}">
<head>{% render 'pagefly-head' %}
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, height=device-height, minimum-scale=1.0, maximum-scale=1.0">
<meta name="theme-color" content="{{ settings.header_background }}">
<!-- Google Tag Manager -->
<script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src='https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
})(window,document,'script','dataLayer','GTM-MCLGF4N');</script>
<!-- End Google Tag Manager -->
<title>{% if page_title == blank %}{{ shop.name }}{% else %}{{ page_title }}{% if current_page != 1 %} – {{ 'general.page' | t: page: current_page }}{% endif %}{% endif %}</title>
{%- if page_description -%}
<meta name="description" content="{{ page_description | escape }}">
{%- endif -%}
<link rel="canonical" href="{{ canonical_url }}">
{%- if settings.favicon -%}
<link rel="shortcut icon" href="{{ settings.favicon | image_url: width: 96 }}">
<link rel="apple-touch-icon" href="{{ settings.favicon | image_url: width: 180 }}">
{%- endif -%}
{%- comment -%}Few prefetch to increase performance on commonly used third-parties{%- endcomment -%}
<link rel="preconnect" href="https://cdn.shopify.com">
<link rel="preconnect" href="https://fonts.shopifycdn.com" crossorigin>
<link rel="dns-prefetch" href="https://productreviews.shopifycdn.com">
{%- unless settings.heading_font.system? -%}
<link rel="preload" href="{{ settings.heading_font | font_url }}" as="font" type="font/woff2" crossorigin>
{%- endunless -%}
{%- unless settings.text_font.system? -%}
<link rel="preload" href="{{ settings.text_font | font_url }}" as="font" type="font/woff2" crossorigin>
{%- endunless -%}
{%- render 'social-meta-tags' -%}
{%- render 'microdata-schema' -%}
{%- render 'css-variables' -%}
{%- render 'js-variables' -%}
<script type="module" src="{{ 'vendor.min.js' | asset_url }}"></script>
<script type="module" src="{{ 'theme.js' | asset_url }}"></script>
<script type="module" src="{{ 'sections.js' | asset_url }}"></script>
{{ content_for_header }}
{{- 'theme.css' | asset_url | stylesheet_tag: preload: true -}}
</head>
<body class="{% if settings.show_page_transition %}page-transition{% endif %} {% if settings.zoom_image_on_hover %}zoom-image--enabled{% endif %}">
<!-- Google Tag Manager (noscript) -->
<noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-MCLGF4N"
height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
<!-- End Google Tag Manager (noscript) -->
{%- render 'shadow-dom-templates' -%}
<a href="#main" class="skip-to-content sr-only">{{ 'general.accessibility.skip_to_content' | t }}</a>
{%- if request.page_type != 'password' -%}
{%- sections 'header-group' -%}
{%- sections 'overlay-group' -%}
{%- if settings.cart_type == 'popover' -%}
<cart-notification-drawer open-from="bottom" class="quick-buy-drawer drawer"></cart-notification-drawer>
{%- endif -%}
{%- endif -%}
{%- if request.page_type == 'customers/account' or request.page_type == 'customers/order' or request.page_type == 'customers/addresses' -%}
{%- section 'account-banner' -%}
{%- endif -%}
<main role="main" id="main" class="anchor">
{{ content_for_layout }}
{%- comment -%}
IMPLEMENTATION NOTE: due to the very complex logic of margin/padding collapsing in Impact, the footer group is
added into the main element to ensure that dynamic sections added into the footer group are properly laid out.
{%- endcomment -%}
{%- if request.page_type != 'password' -%}
{%- sections 'footer-group' -%}
{%- endif -%}
</main>
{% include 'smile-initializer' %}
</body>
</html>Thanks in advance for everyone's help !
