Skip to content

Instantly share code, notes, and snippets.

View royvn's full-sized avatar
πŸ‰

Roy van Neden royvn

πŸ‰
  • Code, a Shopify Premier Agency
  • Den Haag, The Netherlands
  • 11:21 (UTC +02:00)
View GitHub Profile
@royvn
royvn / find-empty-files.txt
Last active December 31, 2024 15:21
Look for empty files
find . -type f -empty
@royvn
royvn / cookie-toggle.liquid
Last active November 25, 2024 21:31
Send consent from theme to Shopify pixel based on user consent choices. Default Shopify Cookie Banner required.
@royvn
royvn / video-observer.js
Last active November 25, 2024 21:29
Video observer for Shopify video. Plays when it's in viewport, stops when it's out of viewport.
/**
* Web component to play and stop videos that are in viewport.
* Example usage:
* <video-observer class="block">
{{ section.settings.video | video_tag: preload: "none", muted: true, autoplay: false, loop: true, playsinline: true, controls: false, image_size: '1440x', class: video_class }}
</video-observer>
*/
class VideoObserver extends HTMLElement {
/** @type {HTMLVideoElement | null} */
@royvn
royvn / klaviyo-back-in-stock.liquid
Last active February 11, 2025 15:23
Klaviyo back in stock integration, the Shopify edition.
{% if settings.klaviyo_public_api_key != blank %}
{% # theme-check-disable %}
<script src="https://a.klaviyo.com/media/js/onsite/onsite.js"></script>
{% # theme-check-enable %}
<script>
var klaviyo = klaviyo || [];
klaviyo.init({
account: "{{ settings.klaviyo_public_api_key }}",
{%- if settings.klaviyo_bis_list_id != blank %}
list: "{{ settings.klaviyo_bis_list_id }}",
@royvn
royvn / calculate-product-discount-in-percentage.liquid
Last active July 5, 2024 11:37
Calculate product discount in percentage
{%- liquid
assign discount_percentage = product.compare_at_price | minus: product.price | times: 100.0 | divided_by: product.compare_at_price | round | abs
echo discount_percentage
-%}
@royvn
royvn / cookiebot-consent.js
Last active August 12, 2024 12:55
Load Google Tag Manager inside the Shopify Web Pixel with Cookiebot as consent
@royvn
royvn / gorgias-chat-loader.js
Last active November 25, 2024 21:26
Shopify load Gorgias chat after clicking on chat icon
/**
* GorgiasChatLoader
* @description Custom element to load Gorgias chat widget when the user clicks on it.
*/
class GorgiasChatLoader extends HTMLElement {
constructor() {
super();
this.bundleLoaderId = this.dataset.id;
if (!this.bundleLoaderId) {
this.hideLoadButton();