Skip to content

Instantly share code, notes, and snippets.

View nocodesupplyco's full-sized avatar

No-Code Supply Co nocodesupplyco

17 followers · 0 following
View GitHub Profile
@nocodesupplyco
nocodesupplyco / hide-section-with-empty-collection.css
Created April 2, 2024 16:31
Hide Static Section if Child Webflow Collection is Empty
/* Give section an attribute of "data-cms-section" */
[data-cms-section]:not(:has(.w-dyn-item)) {
display: none;
}
@nocodesupplyco
nocodesupplyco / set-canonical-if-pagination.js
Created January 9, 2024 19:52
Set canonical to match pagination if using Webflow pagination
// Original code source and use agreement here: https://gist.github.com/rileyrichter/b2e5b5d9fe8952372ce49fafc75dea8b
const canonical = document.querySelector('link[rel="canonical"]');
const urlParams = new URLSearchParams(window.location.search);
const paginationParam = Array.from(urlParams.entries()).find(([key]) =>
/^[a-z0-9]{8}_page$/.test(key)
);
if (paginationParam) {
const canonical = document.querySelector('link[rel="canonical"]');
@nocodesupplyco
nocodesupplyco / show-preloader-once.js
Last active January 3, 2024 20:17
Show a Preloader Once Per Day
// Target the preloader element
const preloaderElement = document.getElementById('preloader');
// Set the amount of time to wait in milliseconds
// Test by changing to 1 * 60 * 1000 for 1 min
const waitTime = 24 * 60 * 60 * 1000; // 24 hours
// Check if the local storage item is present and valid
if (!localStorage.getItem('preloaderShown') || Date.now() - localStorage.getItem('preloaderShown') >
waitTime) {
@nocodesupplyco
nocodesupplyco / email-input-validation.js
Created December 15, 2023 21:43
Email Input Validation
// Validate email field for only business emails
document.addEventListener("DOMContentLoaded", function () {
// UPDATE THIS - ID on the <form>
let form = document.getElementById("pardot-form");
// UPDATE THIS - ID on text element to display errors
let errorElement = document.getElementById("email-domain-error");
form.addEventListener("submit", function (event) {
// UPDATE THIS - ID on the email <input>
let emailInput = document.getElementById("email");
@nocodesupplyco
nocodesupplyco / dark-light-mode-favicon.html
Created September 12, 2023 16:45
Dark/Light Mode Favicon
<!-- Place this in the <head> and update the href to your images for each color mode -->
<link href="favicon-light.png" rel="icon" media="(prefers-color-scheme: light)" />
<link href="favicon-dark.png" rel="icon" media="(prefers-color-scheme: dark)" />
@nocodesupplyco
nocodesupplyco / remove-http.js
Last active November 4, 2023 01:29
Remove https:// from text link
// See test example of this here: https://codepen.io/cmoen89/pen/Baxdwxe?editors=1010
$(function () {
$( "a[data-clean='remove-http']" ).each(function() {
var clean = $(this).text().replace(/^\/\/|^.*?:(\/\/)?/, '');
$(this).text(clean);
});
});
@nocodesupplyco
nocodesupplyco / responsive-script.js
Created July 26, 2023 01:29
Only run some javascript when the browser is 767px or smaller.
function responsiveScript() {
// only run script below 767 px screen width
if (window.innerWidth <= 767) {
// do something awesome on mobile only here
}
}
// run script on page load
responsiveScript();
// run script on window resize
window.addEventListener("resize", responsiveScript);
@nocodesupplyco
nocodesupplyco / skip-nav.js
Created June 14, 2023 13:55
Skip Nav to Main Function
window.addEventListener("DOMContentLoaded", (event) => {
let skipLinkEle = document.getElementById("skip-link");
if (!skipLinkEle) {
return;
}
skipLinkEle.addEventListener("click keydown", function (e) {
if (e.type === "keydown" && e.which !== 13) {
return;
}
@nocodesupplyco
nocodesupplyco / airtable-script-webflow-sync.js
Created May 23, 2023 19:05
Airtable Script to Webflow Create/Update Example
const config = input.config ({
title: 'Airtable <> Webflow sync',
description: 'An example script that could be used to send or update records from Airtable to Webflow',
items: [
input.config.text ('apiKey', {
label: 'Webflow API Key',
description: 'note: anyone with access to this base can see your API key'
}),
input.config.text('webflowSiteID',{
label:'Webflow Site ID',
@nocodesupplyco
nocodesupplyco / clamp.css
Created December 16, 2022 18:39
CSS Clamp
/* Static values */
font-size: clamp(1rem, 2.5vw, 2rem);
width: clamp(20rem, 30vw, 70rem);
/* Calculated values */
width: clamp(100px, calc(30% / 2rem + 10px), 900px);