Skip to content

Instantly share code, notes, and snippets.

@dpw1
dpw1 / newsletter.liquid
Last active October 20, 2021 02:09
Add a "name" field to Debut theme's newsletter (Shopify)
<input type="text"
name="contact[first_name]"
id="{{ formId }}-first_name"
class="input-group__field{% if form.errors %} input--error{% endif %}"
value=""
placeholder="First name"
aria-label="First name"
aria-required="true"
autocorrect="off"
autocapitalize="off"
@dpw1
dpw1 / footer.liquid
Created October 8, 2021 01:42
Add a "name" field to Debut theme's footer newsletter (Shopify)
@dpw1
dpw1 / background_image.css
Last active March 27, 2023 09:26
Add a background image to any Shopify theme
<style>
html, body,
[id*='shopify-section']:not([id*='announcement']):not([id*='header']):not([id*='footer']),
[id*='shopify-section']:not([id*='announcement']):not([id*='header']):not([id*='footer'])> [class*='background']{
background: url("replaceme.jpg") !important;
background-size: cover !important;
}
</style>
@dpw1
dpw1 / theme.css
Last active November 13, 2021 03:32
Code to make the Debut slideshow text show inside the images on mobile
@media (max-width: 767px){
.slideshow__title,
.slideshow__subtitle {
display: block !important;
}
.slideshow__text-content--mobile,
.slideshow__title--mobile,
@dpw1
dpw1 / base.css
Created November 21, 2021 03:46
Change Shopify's Dawn theme price color across all pages
.price__sale .price-item--regular{
color: #ff0000 !important;
}
.cart-item__price-wrapper *,
.price__sale .price-item--sale{
color: #2d2d2d !important;
}
@dpw1
dpw1 / main-product.liquid
Last active June 1, 2022 05:40
Dawn theme - hide sold out products' price
<style>
[id*='price-template'],.product__tax{
/* transition: opacity .25s; */
}
</style>
<script>
window.ezfyProductData = [
{% for variant in product.variants %}
@dpw1
dpw1 / main-product.liquid
Created November 22, 2021 06:38
Full width description below images on the Dawn theme
{%- if product.description != blank -%}
<div class="product__description-parent">
<h2>Description</h2>
<div class="product__description product__description--custom rte">
{{ product.description }}
</div>
</div>
<style>
@media (max-width: 749px){
.product__description-parent{
@dpw1
dpw1 / image-banner.liquid
Last active October 26, 2023 06:26
Make the Shopify Dawn's theme banner image clickable.
{% if section.settings.link != blank %}
<a class="ezfy-custom-link"
href="{{ section.settings.link }}"
{% if section.settings.new_tab %}target="_blank"{% endif %}
></a>
<style>
.image-banner-section{
position: relative;
}
@dpw1
dpw1 / theme.css
Last active January 31, 2022 04:06
Debut header's logo size
.site-header__logo-image,
.site-header__logo-image >*{
max-width: 100px !important;
margin-left: 0px;
width: 100% !important;
margin: unset;
}
@dpw1
dpw1 / main-product.liquid
Last active March 8, 2022 04:15
Dawn theme - text above images on product pages
<style>
@media (max-width: 767px){
.product__title--mobile{
display: block;
text-align: left;
font-size: 35px !important;
margin-top: 0px !important;
margin-bottom: 20px !important;
}