BlateCo

On 4/6/2024 at 10:51 PM, ChristianK said:

I want to publish my blog as podcast to Spotify and I get the error message that it requires an email address in the rss feed for validation reasons. The podcast is published to Apple for quite some time and works well there.

Anybody an idea on this and how to solve it?

Help would be greatly appreciated. Thank you

Hi @ChristianK

It's asking you to add your email to the contact details of the podcasting feed. To do this, click your blog (which is your podcast) and hit settings.

Then go to "Feeds"

Then choose "Podcasting"

Then scroll down to "Contact Details" 

Select and enter your detail such as below, then click save.

Does anyone have a good way of opening a URL automatically with the post submit html code.. without using "window.location.replace," "window.location.assign" or "<meta http equiv..."?

Hi,

We're looking to model our lead magnet after www.thewoobles.com. They use Klayviyo, which Squarespace doesn't integegrate with. Our website is www.blatepapes.com

What we really llke is that the pop up first asks the user a question, the user clicks yes or no, then it brings them to the next step which is inputting an email, then offers an SMS input, then it finally shows an "add your free product to your cart!" button.

We want to get as close to this as possible. We have the authjinmg lightbox plugin with the promo add on, but the problem is that we can't get it to be able to access multiple pages in the same lightbox. Once you click a button the whole website refreshes, instead of just revealing the next page within the lightbox.

So, we thought maybe we just use the squarespace marketing pop up, but it doesn't look nearly as good. Additionally, we cannot get the newsletter Post Submit HTML to initiate a lightbox automatically once the email is put in, which is what we'd need to do to call the free product lightbox with an add to cart button.

So my question is either:

1. Does anyone know how we can get the lightbox plugin to perform multi-step journeys?

OR

2. Does anyone know how we can get the lightbox plugin to automatically initiate upon submitting an email address into the newsletter sign up form? (via the post-submit html code) 

4 minutes ago, melody495 said:

You might have added to the post, but SquareSpace forum is not showing it to us 🙃

I can't see the issue that you are describing. I have Chrome. I tried it on a different browser and also can't  see the issue.

Can you try it in incognito mode and see if you are still seeing the issue? Or a different browser/device?

Interesting! No, it only happens on Safari it seems, and only in desktop view...

Hi everyone,

I got some custom code from @paul2009 which allows us to put an image underneath the add to cart button wrapper. That's been great. This is that code here:

.tag-INSERT-PRODUCT-TAG .ProductItem-details-excerpt:after {
  display: block;
  content: "";
  height: 145px;
  margin-top: 34px;
  background: url(‘INSERT PRODUCT LINK);
  background-size: contain;
  background-repeat: no-repeat;
}

Then, my designer wanted to put the add to cart button side by side with the quantity box. Unfortunately, we cannot use any PDP designs other than "simple" because we want to use buttons instead of drop down boxes for the variant displays. (because they're better for conversions).

So, we found this other code on this forum from @Rebecca_Grace_Designs that can do this with a little pixel tweaking. This is that code here: 

.ProductItem-details .ProductItem-details-checkout {
display: flex;
flex-wrap: wrap;
flex-direction: row;
}
.ProductItem-product-price, .ProductItem-details-excerpt {
flex-basis:100%;
}
.sqs-add-to-cart-button-wrapper {
margin-bottom: 0 !important;
position: relative;
bottom: -28px;
}
.product-quantity-input {
flex-basis:30%;
}
.ProductItem-details .sqs-add-to-cart-button-wrapper .sqs-add-to-cart-button {
padding-top: 1.5em;
padding-bottom: 1.5em;
}
@media screen and (min-width:767px) {
.sqs-add-to-cart-button-wrapper {
flex-basis:70%;
}
}
@media screen and (max-width:767px) {
.sqs-add-to-cart-button-wrapper {
flex-basis:60%;
margin-left: 5vw;
}
}

However, using both these codes together makes the picture underneath the add to cart button resize to the same size as the add to cart button wrapper. Which, as you can see from the picture below, looks odd. 

I've made the add to cart button next to quantity box into a custom tag code so that it's only on one of our less-frequented product pages. You can see that here: https://www.blatepapes.com/shop/p/gel-film-square-200

However, now all the add to cart buttons are slightly to the right on mobile view. (will fix itself if the code is fixed)

Can anyone provide an insight into how to fix it so that the picture underneath the add to cart goes and stays across both the quantity box and the add to cart button, while they are side by side? AND also ensure that subscription products do not get messed up since they do not have quantity boxes? 

I also posted a picture of what the code makes the subscription pages look like (that don't have quantity boxes).

19 hours ago, melody495 said:

Hi, please share a link to your website so we can check easier.

Weird, sorry I swore that I put the link to our product pages..

Here's a link to one of our products (it's happening on every product page): Capsule Filler

1 hour ago, melody495 said:

I'm not sure what "module" is, is this a third party plugin you're using? But glad it's all working for you!

No, it's java language that tells the web browser to treat inline code like an external resource so that it loads at the end of the page content rather than inline with the body. This keeps the java from blocking rendering.

Instead of using <script type="text/Javascript" .... just do <script type="module"

That's all! Just learned that today.

I'm not sure what's causing it, but probably one of our custom css codes. Any ideas? 

3 hours ago, melody495 said:

Hi, sounds like you have put the code in Site Wide code injection, so it is in every page. If you only want this on a specific page, please put the code in the code injection of that page only.

In terms of your issue, I went back to look at your post again, your console already tells you what the issue is. That 'textcontent' is null. So at the point of the code being run, there is nothing in 'textcontent'. The footer is being run at website load, so it's likely not when you want to run your code.

I suggest you wrap your code in document ready or domcontentloaded.

$(document).ready(function () {
}

 

Awesome, thank you. I have the script as inline code so wrapping it in

$(document).ready(function () {
}

shows that text on the page. However, I did change the code to "module" from "text/javascript", which has made it run like a deferred external js file.

It didn't work in each page's header, so I went ahead and put it in each individual page (underneath the code that called the script.. for some reason it didn't work until I did this). (didn't realize I could do that, thought it had to be in the footer for some reason). Now it's working perfectly. Thank you!!

1 hour ago, creedon said:

Only Squarespace can correct their own errors.

You're experiencing the same errors then? How does your mobile page speed look?

5 minutes ago, melody495 said:

Hi, can you let me know where you've placed the code? 

Yes! It's injected at the end of the footer on the code injection page. In my console there seems to be a countdown running on all pages, even though the code isn't being called.

Oh, I did have something else I'd like to ask, if you happen to know anything about this as well: We're getting Javascript loading errors from Squarespace resources. Our mobile loading speed score is really low because of Javascript loading issues, and most of them says they're coming from unused Squarespace Java resources (in the page speed report we got back). I've attached a picture from my web console showing the Squarespace errors. Do you know anyway of correcting these? I greatly appreciate any light you may be able to shed on this!

7 hours ago, melody495 said:

Hi, I haven't gone through the full code, but this here is missing the closing </br>. Try that and let me know how it goes.

Hi and thank you for pointing that out! Fixed that, however it looks like the error is actually happening on the pages that don't contain the "call" to the countdown timer script. So it seems like it's a problem with the code. 😕

On 6/3/2023 at 6:43 PM, tuanphan said:

Hi,

Can you share link to this page? We can give some code to make both same line

Hi @tuanphan!

We'd like help doing this exact same thing. However, we've also used a custom css code you made to wrap an image after our add to cart button. So we'd like to do this without ruining the image underneath.

Also, I'd like to adjust the free space in all the areas indicated by the dotted red arrows... especially the big empty space at the top of the page above the "store reviews." We want to most of the free space to make it more compressed, and remove the free space at the top completely.

Here's a link to the page: Product Page

Our mobile load speed is atrocious. Please. Webp format us, and make it so it can automatically convert ALL of our pictures for us. THAT would be SOMETHING.

Hi Everyone! We're getting a few different Java errors as indicated by our web console and our Microsoft Clarity readings. This picture shows the errors. Our website is: http://blate.co

We think it's our countdown timer. This is the script we have on our code injection page:

<script>const
  CountDownZone = document.querySelector('#count-down-Timer strong'),
  TimeTarget    = 14   // 15:00hrs is the cut-off point   
  ;
function pad(n, len) { // leading 0's
  let s = n.toString();
  return '0'.repeat(Math.max(len - s.length, 0)) + s;
};

var timerRunning = setInterval(countDown, 1000);

function countDown() {
  let
    localTime = new Date(),                // get your local time
    utcTime   = localTime.getUTCHours(),  // find UTC hours
    estTime   = new Date()               // create a new date object for the EST time
    ;
    estTime.setHours(utcTime-5);        // adjust it for EST hours.

  if (
     (estTime.getDay() > 0) && (estTime.getDay() < 6)       // Monday to Friday only
  && (estTime.getHours() < TimeTarget)
     ) 
  {                     
    let
      count_HM = [],
      hrs  = (TimeTarget - 1) - estTime.getHours(),
      mins = 59 - estTime.getMinutes(),
      secs = 59 - estTime.getSeconds()
      ;

    if (hrs > 0)             { count_HM.push(hrs + ' hr'); }
    if (hrs > 0 || mins > 0) { count_HM.push(pad(mins, 2)+ ' min'); }
    count_HM.push(pad(secs, 2)+ ' sec');

    CountDownZone.textContent = count_HM.join('    ');
  }
  else {
    document.getElementById('count-down-Timer').textContent = 'Order Before 3PM EST Mon-Fri (12PM Sat) For Same-Day Shipping!';
    clearInterval(timerRunning);
  }
}</script>

And this is the html we use to call the script on each page we want the timer to be:

<center><div id="count-down-Timer">Time Left to Order for Dispatch Today:<br><strong>0.00.00</strong> </div>
</center> 

We're looking to clean up our site before Black Friday so If anyone can help fix this, that would be greatly appreciated!

On 11/12/2023 at 3:36 AM, tuanphan said:

Use this new code

@media screen and (max-width:767px) {
.ProductItem-gallery-thumbnails {
    display: flex;
    flex-wrap: wrap;
    margin-bottom: 5px !important;
}
.ProductItem-gallery {
    flex-direction: column-reverse;
}
.ProductItem-gallery-slides {
    width: 100%;
}
.ProductItem-gallery .ProductItem-gallery-scroll {
    display: flex !important;
}
}

 

This was awesome, thanks so much. I do have one other question for you, because you seem to be very knowledgeable. We keep getting Javascript errors on our site, and I think it has to do with our countdown timer. Except I think I'm only seeing the error on pages that don't have the timer on them. The errors are in the attached picture. Our timer code we use is this:

<script>const
  CountDownZone = document.querySelector('#count-down-Timer strong'),
  TimeTarget    = 14   // 15:00hrs is the cut-off point   
  ;
function pad(n, len) { // leading 0's
  let s = n.toString();
  return '0'.repeat(Math.max(len - s.length, 0)) + s;
};

var timerRunning = setInterval(countDown, 1000);

function countDown() {
  let
    localTime = new Date(),                // get your local time
    utcTime   = localTime.getUTCHours(),  // find UTC hours
    estTime   = new Date()               // create a new date object for the EST time
    ;
    estTime.setHours(utcTime-5);        // adjust it for EST hours.

  if (
     (estTime.getDay() > 0) && (estTime.getDay() < 6)       // Monday to Friday only
  && (estTime.getHours() < TimeTarget)
     ) 
  {                     
    let
      count_HM = [],
      hrs  = (TimeTarget - 1) - estTime.getHours(),
      mins = 59 - estTime.getMinutes(),
      secs = 59 - estTime.getSeconds()
      ;

    if (hrs > 0)             { count_HM.push(hrs + ' hr'); }
    if (hrs > 0 || mins > 0) { count_HM.push(pad(mins, 2)+ ' min'); }
    count_HM.push(pad(secs, 2)+ ' sec');

    CountDownZone.textContent = count_HM.join('    ');
  }
  else {
    document.getElementById('count-down-Timer').textContent = 'Order Before 3PM EST Mon-Fri (12PM Sat) For Same-Day Shipping!';
    clearInterval(timerRunning);
  }
}</script>

And we call it on each page using this code:

 <center><div id="count-down-Timer">Time Left to Order for Dispatch Today:<br><strong>0.00.00</strong> </div>
</center> 

Do you have any idea how to solve this error? 

On 11/7/2021 at 12:07 AM, tuanphan said:

Add to Design > Custom CSS

@media screen and (max-width:767px) {
.ProductItem-gallery-thumbnails {
    display: flex;
}
.ProductItem-gallery {
    flex-direction: column-reverse;
}
.ProductItem-gallery-slides {
    width: 100%;
}
.ProductItem-gallery .ProductItem-gallery-scroll {
    display: flex !important;
}
}

 

Hi! Thanks for this code, however, there are two problems with it for us. Check our product here on mobile:

https://www.blatepapes.com/shop/p/capsule-filler-100

Problem #1: Two many pictures make the thumbnails too thin. Can it be scrollable horizontally instead of becoming thinner?

Problem #2: There is a huge space below the thumbnails until the "# of Store Reviews". This only happens after adding this css code. Do you have a fix for this?

Thanks!

I think not being answered for over a year means that's an unequivocal NO.

On 3/21/2023 at 12:06 PM, LELANDER said:

Really appreciate the explanation, but DANG.
It is just very unfortunate language for that "error" message.
If this is the case with all FREE SHIPPING discounts, which is a built-in function, it really should be more encouraging language used to assist folks to move along... something akin to "please enter your shipping details to complete the order" — or it shouldn't even ask for a discount code until after details have been entered.

Do we have opportunity to change that at all? i assume "no" since the commerce functions are sort of a separate beast from the general site editing capabilities.

This sort of seems like a fail that can be easily resolved with some better placement or language.

We should not have to wait for a customer to reach out saying it doesn't work—the reality is most people will not take that extra effort and we just lose the transaction.

 

 

THIS IS EXACTLY TRUE. IT'S RIDICULOUS THAT WE ARE WASTING OUR AD SPEND BECAUSE PEOPLE CANNOT APPLY THE FREESHIP CODE TO THEIR ORDER WHEN USING APPLE PAY OR ANYTHING FOR THAT MATTER. IF THE FREE SHIP CODE ONLY WORKS FOR A CERTAIN SHIPPING OPTION, SQUARESPACE SHOULD AUTOMATICALLY CHOOSE THAT SHIPPING OPTION.

I DON'T EVEN WANT TO KNOW HOW MANY THOUSANDS IN AD SPEND YOU'VE COSTED US WITH THIS PROBLEM SQUARESPACE. WE ARE VERY SERIOUSLY CONSIDERING MIGRATING TO SHOPIFY FOR THIS ONE SINGLE ISSUE

I DON'T ALWAYS TYPE IN ALL CAPS BUT WHEN I DO, IT'S BECAUSE YOU'RE COSTING ME MONEY.

We're also interested in this feature! Or even a workaround to get the current store reviews up there in the meantime!

On 1/22/2023 at 3:26 PM, paul2009 said:

It is not yet possible to export reviews that were collected using Squarespace's Product Reviews feature. You can make a feature request by contacting Squarespace Customer Care using a support ticket. 

Did this help? Please give feedback by clicking an icon below  ⬇️

Hi Paul, I see you literally all over this forum. So you probably know, has Squarespace offered some feature yet to export their store reviews to an XML Schema for uploading to Google Shopping?

Here's the link to Google's explanation of how to do this: https://support.google.com/merchants/answer/7045996?hl=en&ref_topic=7309501&sjid=9874356144054562499-NA

I believe it gives you three ways to get reviews on Google Shopping, yet to use the reviews submitted to Squarespace the only option would be uploading them yourself via an XML file.