Javascript

Nuxt Ecommerce (Snipcart/Stripe)

All you need to set up a product with custom fields with Snipcart and Nuxtjs

Sass-loader headache in Nuxt

A fix for “TypeError: this.getOptions is not a function”

Getting fast core web vitals with WordPress

In the course of my daily rounds I was interested to see how svelte I could make the core web vitals on my own site. What are core web vitals? These are three tests for a webpage: how quickly page content loads, how quickly a browser loading a webpage can respond to a user’s input, […]

Gatsby build : files not found / Failed to load resource

When you’re in development, everything is great. But after running gatsby build, your js plugins and fonts are all broken or missing So to fix this, first run Then, go to your gatsby-config.js file, and add the location of a server where you will be accessing the site. You can edit it later, but for […]

Make things same height | Javascript | JQuery

It’s not your fault, but it is your problem – how to match element heights with jQuery

Equal heights of elements with Vanilla js in Shopify

This function (original from CSS-tricks) helps to equalise the heights of anything, especially useful in a loop. So in Shopify (or anywhere really) I might have titles that sometimes are pretty long, and on a mobile, they are wrapping and causing heights to be uneven. Here, we add a class to the html (in this case […]

Double Marvellous Functions Timestamp XCode debugging

Timestamp on your CSS and JS in Functions file in WordPress

I’ve been trying to debug on XCode and the caching is very persistent….here’s a quick function to add to your functions file to timestamp your js or css files, so you don’t have to go crazy trying to refresh the cache when you’re working locally.

Collection dropdown filter for Shopify

Heyo, I found this wasn’t too easy to find any help on so I just built my own function and thought I would put it up here. I needed a filter for the collections in Shopify. Here’s the filter dropdown from the collection-filters.liquid file:

VueJS Simple Quickstart

So I’m building a stupid webpage that looks like a trashy magazine. The idea is you can change the headlines and images and get an image of it. But rather than vanilla JS which I was all about last week, I have grown bored of typing document.getElementById and now I want to cut corners again. […]

How do I fade things in on scroll JQuery

Okay, first off, everyone has wanted this effect forever. So it’s worth learning it! I have done this the hard way plenty of times and it’s one thing or effect that I don’t mind using a plugin for. Why? Well it’s just done well, it’s fast and I can just get on with building once […]

JQuery id starts with selector

This is a handy way to target any element with a common string in the id. an element with id=”yourstring-whatever” would be targeted this way. It does seem a little intensive on the DOM so maybe whittle down the elements to target it inside a container, thereby letting the browser know that it doesn’t have […]

Make element square with Jquery

“Hell-o”. Here’s a simple and useful Jquery each function that takes the width of something and makes it’s height out of it. It also re-runs when the browser window is resized. I use it alot, it’s dead handy. You’re basically getting the width and making the height out of it. See js snippet below. Give […]