Skip to content

Instantly share code, notes, and snippets.

@odessy
odessy / gist:bc61b8c6e0ab41b7296bebb2b79cb93f
Created October 18, 2024 16:52
Collection canonical canonical_url
{% if template contains 'collection' %}
<link rel="canonical" href="{{ shop.url }}{{ collection.url }}" />
{% elsif canonical_url != blank %}
<link rel="canonical" href="{{ canonical_url }}">
{% endif %}
@odessy
odessy / gist:2b8d0003dc73a22007df21c4287ee352
Created October 18, 2024 15:29
store/camille-jewelry button colors
/* CSS - change Add to Cart button color */
.product-clip__btn,
.product__submit__buttons .btn--add-to-cart {
background-color: var(--COLOR-PRIMARY);
border: 1px solid var(--COLOR-PRIMARY);
color: var(--COLOR-PRIMARY-OPPOSITE);
}
.product-clip__btn:hover, .product-clip__btn:focus,
.product__submit__buttons .btn--add-to-cart:hover, .product__submit__buttons .btn--add-to-cart:focus {
background-color: var(--COLOR-PRIMARY-HOVER);
@odessy
odessy / gist:46647fc7435919a757598f1e114bbc57
Created September 19, 2024 17:10
Hide Inventory with span tag
Low inventory <span class=hidden>{{ inventory }}</span>
@odessy
odessy / gist:8b1e41b948f68c773a2cba440da05e8c
Created September 18, 2024 16:32
Password page layout on mobile
@media only screen and (max-width: 768px) {
.template-password .input-group--inner-button {
display: flex;
flex-direction: column;
}
.template-password .input-group-button{
width: 100%;
}
.template-password .input-group .btn,
.template-password .input-group .input-group-field{
@odessy
odessy / gist:405f5a052281d11de7552a23a8012e38
Created September 18, 2024 15:11
Swatch border outer circle
.swatch__button input:checked~label:after, .swatch__label[aria-selected=true]:after{
--swatch-offset: 3px;
top: calc(var(--swatch-offset) * -1);
left: calc(var(--swatch-offset) * -1);
width: calc(var(--swatch-size) + var(--swatch-offset) * 2);
height: calc(var(--swatch-size) + var(--swatch-offset) * 2);
border-color: var(--secondary);
}
.product__grid__info .grid__swatch__hover,
.grid__swatch__container{
@odessy
odessy / swatches.json
Created September 17, 2024 15:38
Swatches with english and Nederlands
{"colors":[
{"Demo Image": "blank.svg"},
{"stripe": "stripe.svg"},
{"ink": "#696969"},
{"ash": "#a3a3a3"},
{"sky": "#9bbaed"},
{"pop": "#e43e23"},
{"red": "#d13b38"},
{"jet": "#000000"},
{"gum": "#eb5799"},
@odessy
odessy / gist:0af4f13548aadcf333de434de0f8a7c2
Created August 28, 2024 15:43
Klaviyo backinstock javascript code
<script src="https://a.klaviyo.com/media/js/onsite/onsite.js"></script>
<script>
var klaviyo = klaviyo || [];
klaviyo.init({
account: "UU6Fvf",
list: "UGSQKU",
platform: "shopify"
});
klaviyo.enable("backinstock",{
trigger: {
@odessy
odessy / gist:54ff5f8edd3b3e239d4ee5c093ca42b1
Last active August 10, 2024 18:29
Product title with link
{% assign product = all_products[section.settings.home_product] %}
<div class="product__block__title" style="--PB: 20px;">
<div class="product__headline">
<div class="product__title__wrapper">
<h1 class="product__title heading-size-9">
<a href="{{ product.url }}">{{ product.title }}</a>
</h1>
</div>
</div>
</div>
@odessy
odessy / gist:3e95e25b1cc7bf350744c504f8bfb9eb
Created July 31, 2024 16:45
Product photoswipe zoom icons fix
.pswp__button{
height: auto;
}
.pswp__button .icon-theme {
pointer-events: none;
}
<div class="product__block__title" style="--PB: 16px;">
<div class="product__headline">
<div class="product__title__wrapper">
<h1 class="product__title heading-size-4">
{% assign title = product.title | split: "|" %}
{{ title.first }}
<br>
{% if title.size == 2 %}
{{ title.last }}