pablogiralt

// handlelize in liquid: https://github.com/Shopify/liquid/blob/63eb1aac69a31d97e343822b973b3a51941c8ac2/performance/shopify/shop_filter.rb#L100
// how to handlelize in js: https://ricardometring.com/javascript-replace-special-characters

function handlelize (str) {

  str = str.normalize('NFD').replace(/[\u0300-\u036f]/g, '') // Remove accents
    .replace(/([^\w]+|\s+)/g, '-') // Replace space and other characters by hyphen
    .replace(/\-\-+/g, '-')	// Replaces multiple hyphens by one hyphen
    .replace(/(^-+|-+$)/g, '') // Remove extra hyphens from beginning or end of the string
    .toLowerCase(); // To lowercase

pablogiralt

@font-face {
  font-family: 'Proxima Nova';
  src: url('https://cdn.shopify.com/s/files/1/0581/6814/8141/t/4/assets/ecef0faef83874e9f6bb9b5e9fa05a0e.woff2') format('woff2'),
      url('https://cdn.shopify.com/s/files/1/0581/6814/8141/t/4/assets/a8ea564afc114e1a061cb9ef27a0560b.woff') format('woff');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {

pablogiralt

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>

{% if customer %}
  <div 
      id="swell-customer-identification"
      data-authenticated="true"
      data-email="{{ customer.email }}"
      data-id="{{ customer.id }}"
      data-tags='{{ customer.tags | json }}'
      style="display:none;"

pablogiralt

Add social media icons (Spotify and TikTok) to Brooklyn Shopify theme

What you will get:

You will be adding new social media icons (not available in default theme) to your footer:

Step by Step Guide

1. Add the fields for Spotify and TikTok links in theme settings

Open the Config/settings_schema.json file and just after the field for Fancy, which ends around line 1947, add the following:

pablogiralt

Add Size Guide to Shopify Brooklyn Theme

This is what you get:

1- A link to below the variant selector which will open the size guide:

2- The size selector modal:

pablogiralt

/*
 * 1. Create the filter by price Facet:  
 *      - Set "Facet type" to "Checkboxes"
 *      - Set "Data source" to "Price"
 *      - Set "Sort by" to "Raw Value"
 * 2. Set $price_facet_name to the name of the crewated facet
 */

function index_custom_price_range( $params, $class ) {