Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search


Circle Member
  • Posts

  • Joined

  • Last visited

Everything posted by ThisJustin

  1. I forgot to say I am talking about the Menu blocks in 7.0 and am currently working on Brine. Ok here's what I figured out using JavaScript and jQuery. This won't work if you have multiple Menu blocks on the same page. I decided to use the anchor link URL syntax rather than variables for tidiness. This should take a URL in the format: https://example.com/menu-page#menu-name <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> <!-- SMART URLs FOR MENU BLOCK --> <script> $(document).ready(function(){ var anchor = getUrlAnchor(); if (anchor) { $(".menu-select-labels").each(function(){ var name = $(this).text(); var slug = slugify(name); if (anchor == slug){ $(this).attr("tabindex", "0"); $(this).attr("aria-selected", "true"); $(this).addClass("menu-select-labels--active"); } else { $(this).attr("tabindex", "-1"); $(this).attr("aria-selected", "false"); $(this).removeClass("menu-select-labels--active"); } }); $(".menus--has-multiple .menu").each(function(){ var name = $(this).attr("aria-label"); var slug = slugify(name); if (anchor == slug){ $(this).css("display", "block"); } else { $(this).css("display", "none"); } }); } else { var name = $(".menu-select-labels--active").text(); var slug = slugify(name); updateUrl(slug); } $(".menu-select-labels").click(function(){ var name = $(this).text(); var slug = slugify(name); updateUrl(slug); }); }); </script> Here's a function to retrieve the anchor link from the URL (the part after the #): <script> var getUrlAnchor = function getUrlAnchor() { var url = window.location.href; if (url.indexOf('#') > 0){ return url.substring(url.indexOf('#') + 1); } return false; }; </script> And another one to update the URL with the current menu: <script> var updateUrl = function updateUrl(slug) { const state = { 'menu_id': slug }; const title = document.title; const url = window.location.href; const baseUrl = url.substring(0, url.indexOf('&')); const newUrl = baseUrl + "#" + slug; history.pushState(state, title, newUrl); return newUrl; } </script> And finally a helper function to slugify the menu names since Squarepsace doesn't do this anywhere (this one I borrowed from the internet): <script> // Slugify a string var slugify = function slugify(str) { str = str.replace(/^\s+|\s+$/g, ''); // Make the string lowercase str = str.toLowerCase(); // Remove accents, swap ñ for n, etc var from = "ÁÄÂÀÃÅČÇĆĎÉĚËÈÊẼĔȆÍÌÎÏŇÑÓÖÒÔÕØŘŔŠŤÚŮÜÙÛÝŸŽáäâàãåčçćďéěëèêẽĕȇíìîïňñóöòôõøðřŕšťúůüùûýÿžþÞĐđßÆa·/_,:;"; var to = "AAAAAACCCDEEEEEEEEIIIINNOOOOOORRSTUUUUUYYZaaaaaacccdeeeeeeeeiiiinnooooooorrstuuuuuyyzbBDdBAa------"; for (var i=0, l=from.length ; i<l ; i++) { str = str.replace(new RegExp(from.charAt(i), 'g'), to.charAt(i)); } // Remove invalid chars str = str.replace(/[^a-z0-9 -]/g, '') // Collapse whitespace and replace by - .replace(/\s+/g, '-') // Collapse dashes .replace(/-+/g, '-'); return str; } </script>
  2. Site URL: https://www.savourycity.com/events/plated Hello, I have a page that uses the built-in Menu block feature with multiple menus. I'm wondering if there is a way to navigate to this page but indicate which menu to display? Is there anything that can be added to the URL to make this happen? Or perhaps adding a variable that some javascript could handle? I'm just not really sure how the Menu block is implemented, but it's frustrating that Squarespace hasn't exposed some easy way to do this. Thanks in advance!
  3. Hello, I'm wondering if anyone has had success installing the local development server on a Apple M1 (ARM64) device? I keep running into an error, and I'm not sure what the issue is. Error log is below. Thanks in advance! justineverett@MacBook-Air template % sudo npm install @squarespace/server npm WARN deprecated har-validator@5.1.5: this library is no longer supported npm WARN deprecated uuid@3.4.0: Please upgrade to version 7 or higher. Older versions may use Math.random() in certain circumstances, which is known to be problematic. See https://v8.dev/blog/math-random for details. npm WARN deprecated request@2.88.2: request has been deprecated, see https://github.com/request/request/issues/3142 npm ERR! code 1 npm ERR! path /Users/justineverett/Alimentaria/template/node_modules/@squarespace/server npm ERR! command failed npm ERR! command sh -c node scripts/execif.js --exists=build npm run bundle && npm run cleanupscript npm ERR! Executing: npm run bundle npm ERR! npm ERR! > @squarespace/server@1.8.2 bundle npm ERR! > node scripts/bundlejre.js --accept --clear -tz -j 8u131 -o build/distributions/runtimes/jre npm ERR! npm ERR! Bundling compatible JRE (This may take a while) npm ERR! /Users/justineverett/Alimentaria/template/node_modules/@squarespace/server/scripts/utils/jreurl.js:36 npm ERR! var sortedVersions = versions.sort().reverse(); npm ERR! ^ npm ERR! npm ERR! TypeError: Cannot read property 'sort' of undefined npm ERR! at getVersion (/Users/justineverett/Alimentaria/template/node_modules/@squarespace/server/scripts/utils/jreurl.js:36:33) npm ERR! at module.exports (/Users/justineverett/Alimentaria/template/node_modules/@squarespace/server/scripts/utils/jreurl.js:51:13) npm ERR! at main (/Users/justineverett/Alimentaria/template/node_modules/@squarespace/server/scripts/bundlejre.js:53:13) npm ERR! at Object.<anonymous> (/Users/justineverett/Alimentaria/template/node_modules/@squarespace/server/scripts/bundlejre.js:79:1) npm ERR! at Module._compile (node:internal/modules/cjs/loader:1109:14) npm ERR! at Object.Module._extensions..js (node:internal/modules/cjs/loader:1138:10) npm ERR! at Module.load (node:internal/modules/cjs/loader:989:32) npm ERR! at Function.Module._load (node:internal/modules/cjs/loader:829:14) npm ERR! at Function.executeUserEntryPoint [as runMain] (node:internal/modules/run_main:76:12) npm ERR! at node:internal/main/run_main_module:17:47 npm ERR! Command failed: npm run bundle npm ERR! A complete log of this run can be found in: npm ERR! /Users/justineverett/.npm/_logs/2021-06-29T19_05_01_492Z-debug.log
  4. Hi, I think I found a better solution: .ProductItem-gallery-slides-item-image { object-fit:contain!important; } It's insane to me that Squarespace doesn't just have an "Original Aspect Ratio" option for product details pages. Kind of a dealbreaker for photographers.
  5. Hello @MJakaJaX You can solve this problem by enabling developer mode in Tremont and making the changes through git. ( I won't cover this here but just tell you the changes I made.) In site.region remove the conditionals around the footer block: {.equal? collection.typeName "index"}{.or} <footer class="site-footer"> <squarespace:block-field id="footer-blocks" columns="12" label="Footer Content" /> </footer> {.end} so that it looks like: <footer class="site-footer"> <squarespace:block-field id="footer-blocks" columns="12" label="Footer Content" /> </footer> Then in styles/index.less remove or comment out the following: .site-footer { display: none; } You can then use some css to add a solid background to the footer if you would like.
  6. Site URL: https://chancho-yvr.squarespace.com/ Hello, I'm wondering if anyone has ever had experience enabling the Footer on the Tremont index page? It displays on all other pages but I would like it on the index as well. I have developer mode enabled but I can't quite figure out to modify the template for this behaviour. Site is: https://chancho-yvr.squarespace.com/ Password: Tacos!
  • Create New...