Skip to content

Instantly share code, notes, and snippets.

HTML CODING STANDARD:
======================
- Always indent you code with 4 spacing tab.
Example:
========
<!DOCTYPE html>
<html>
<head>
</head>
{{ 'meet-the-experts.css' | asset_url | stylesheet_tag }}
{{ 'meet-the-experts.js' | asset_url | script_tag }}
<div class="meet-the-experts">
<div class="container">
<h1 class="meet-the-title">{{ section.settings.main_title }}</h1>
<p class="meet-the-subtitle">{{ section.settings.sub_title }}</p>
<div class="meet-the-experts-inner">
{% if section.blocks.size > 0 %}
{% for block in section.blocks %}
{% if request.path contains 'contact' %}
<style>
html, body,
[id*='shopify-section']:not([id*='announcement']):not([id*='header']):not([id*='footer']) > [class*='background'] {
background: url('replace-url') !important;
background-size: cover !important;
background-repeat: no-repeat !important;
}
</style>
{% endif %}
<style>
html, body,
[id*='shopify-section']:not([id*='announcement']):not([id*='header']):not([id*='footer']) > [class*='background'],
[id*='shopify-section']:not([id*='announcement']):not([id*='header']):not([id*='footer']) {
background: url('replace-url') !important;
background-size: cover !important;
background-repeat: no-repeat !important;
}
</style>
<style>
.announcement-bar-parent a {
text-decoration: none;
}
.announcement-bar-message {
font-size: 14px;
margin: 0px;
text-align: center;
padding: 10px 0px;
background-color: {{ section.settings.announcement_bar_background_color }};
<style>
.announcement-bar-parent a {
text-decoration: none;
}
.announcement-bar-message {
font-size: 14px;
margin: 0px;
text-align: center;
padding: 10px 0px;
{
"type": "color",
"id": "announcement_bar_background_color",
"label": "Background Color",
"default": "#000000"
},
{
"type": "color",
"id": "announcement_bar_text_color",
"label": "Text Color",
"settings": [
{
"type": "checkbox",
"id": "show_announcement",
"label": "Show announcement",
"default": false
},
{
"type": "checkbox",
"id": "home_page_only",
{%- if section.settings.show_announcement -%}
{%- if section.settings.home_page_only == false or template.name == 'index' -%}
<div class="announcement-bar-parent">
{%- if section.settings.announcement_link != blank -%}
<a href="{{ section.settings.announcement_link }}" >
{%- endif -%}
<p class="announcement-bar-message">{{ section.settings.announcement_text }}</p>
{%- if section.settings.show_announcement -%}
{%- if section.settings.home_page_only == false or template.name == 'index' -%}
<div class="announcement-bar-parent">
<p class="announcement-bar-message"></p>
</div>
{%- endif -%}
{%- endif -%}