Skip to content

Instantly share code, notes, and snippets.

View mikenewbuild's full-sized avatar
☂️
Under cover

Mike Fallows mikenewbuild

☂️
Under cover
View GitHub Profile
@mikenewbuild
mikenewbuild / shopify-checkout-gtm-datalayer.liquid
Last active July 27, 2023 10:19
Shopify Checkout GTM dataLayer
<!-- Start GTM dataLayer -->
{% if order_id != blank %}
<script>
const Nativve = window.Nativve || {};
// Assign the data for ecommerce dataLayer
Nativve.ecommerce = {
transaction_id: {{ order_number | json }},
value: "{{ total_price | times: 0.01 | json }}",
@mikenewbuild
mikenewbuild / google-tag-manager.liquid
Last active January 30, 2023 14:48
Shopify GA4 ecom events
<!-- 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','{{ id }}');</script>
<!-- End Google Tag Manager -->
<script>
(() => {
@mikenewbuild
mikenewbuild / esbuild.config.js
Created February 15, 2022 14:45
Esbuild config for Shopify Themes
import esbuild from "esbuild";
import { sassPlugin } from "esbuild-sass-plugin";
import postcss from "postcss";
import autoprefixer from "autoprefixer";
import postcssPresetEnv from "postcss-preset-env";
esbuild
.build({
entryPoints: {
theme: "src/scripts/theme.js",
@mikenewbuild
mikenewbuild / custom-upsell-products.liquid
Last active November 25, 2023 04:01
Shopify CustomUpsellProduct Element
<style>
.custom-upsell-products {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(100px, 1fr));
gap: 1rem;
}
custom-upsell-product {
overflow-x: hidden;
}
@mikenewbuild
mikenewbuild / shopify-theme-utils.js
Last active October 26, 2021 16:27
Helper methods to use in Shopify themes
export function _$(selector, scope = document) {
return scope.querySelector(selector);
}
export function _$$(selector, scope = document) {
return Array.from(scope.querySelectorAll(selector));
}
export function wrap(el, wrapper) {
el.parentNode.insertBefore(wrapper, el);