Change separating delimiter in blog post to comma

Hi all,

I'm laying out a client site and am using the blog as a Portfolio.  On the top right of each blog page, I'm using the categories as a way to display the location of the projects listed inside this portfolio. 

The problem I'm having is that, on the root blog page, the separating delimiter is a comma, which is great.  For example, I am listing the locations as something like, "Bucktown, Chicago", so I have two categories listed here: "Bucktown" and "Chicago" and it displays it perfectly.

In the actual blog page, though, you don't have the option of a comma as a separating delimiter and you can only pick from a bullet, space, etc. So, it's now displaying as "Bucktown • Chicago"

Does anyone know some easy code to have this display the comma as it does on the root blog page instead of a bullet or a space?  

As always, any help would be appreciated.  I've tried to edit other code I've found on the Forum to no avail and am a little frustrated that Squarespace doesn't have this as a natural option.

Website: https://pumpkin-orange-3ld6.squarespace.com/portfolio/blog-post-title-one-2g2bd-5723b-4hfd4
Password: Real2023

Thank you!

Worked like a charm @creedon - thank you!!   Much appreciated!

Hi @creedon, I tried to use this fix as well but it didn't work - is there an updated version if it would've been influenced by any squarespace updates in the last few months?

Many thanks,

Daniel

2 hours ago, DoppyG said:

I tried to use this fix as well but it didn't work

Please post the URL for a page on your site where we can see your issue. For us to see the URL you need to include the link in the content of your post. The URL field the forum software provides is not shown to us.

A link to the backend of the your site won’t work for us, i.e. a URL that contains /config/.

Please set up a site-wide password, if your site is not public and you've not already done so.

Post the password here.

Adding a site-wide password does not allow anyone to alter your site. It only allows those with the password to see your site.

Please read the site-wide password and how to share a link documentation to understand how they work.

You may find How to post a forum question post useful.

We can then take a look at your issue.

Thanks @creedon this is the page: https://www.opportunitygreen.org/blog

The other problem I have is that the secondary metadata (here author name) doesn't have the same transition time as the rest of the items. Do you have a suggestion for adjusting that?

Many thanks!

On 6/12/2024 at 8:47 AM, DoppyG said:

I tried to use this fix as well but it didn't work

It didn't work as you have different settings for your Blog page so we need different CSS.

<style>

  .tweak-blog-basic-grid-text-alignment-left .blog-basic-grid .blog-basic-grid--container .blog-meta-section span > *::after {
  
    content : ',';
    
    }
    
  .tweak-blog-basic-grid-text-alignment-left .blog-basic-grid .blog-basic-grid--container .blog-meta-section span:last-child > *::after {
  
    content : unset;
    
    }
    
  .tweak-blog-basic-grid-delimiter-bullet .blog-basic-grid .blog-meta-delimiter::after {
  
    display : none;
    
    }
    
  </style>

This is for v7.1.

Let us know how it goes.

On 6/12/2024 at 11:03 PM, DoppyG said:

the secondary metadata (here author name) doesn't have the same transition time as the rest of the items. Do you have a suggestion for adjusting that?

What is happening here is that Squarespace hasn't added a data-animation-role attribute to the author element and so it doesn't get animated like the date element.

Because SS is driving the animations in part with some JavaScript that reads the attribute and then does stuff, some CSS isn't going to do the job. We need some JavaScript to add the attribute to the author element so SS can do it's animation thing.

Please see Element Animate.

Let me know how it goes.