Jump to content

Captalize first letter of a word inside of an accordion after every period

Go to solution Solved by bycrawford,

Recommended Posts

Hey guys, I was wondering if it is possible to captalize every first letter of a word inside of an accordion.

I'm already using a custom CSS for my font,weight, and captalize the first letter inside of the accordion, but it only captalize the first letter of a word after a paragraph.

div.accordion-item__dropdown p {
    font-family: Adobe Garamond Pro Regular !important;
  font-weight: 500; 
  text-transform:lowercase;
  text-transform: capitalize first letter;
  letter-spacing: 0.5px
}

p::first-letter {
text-transform: capitalize;
}

div.accordion-item__dropdown * {
    font-size: 18px !important;
}

I attach a file that illustrate what is happening.

I tried to put this code into the code injection, inside of the footer:

<script>
  document.addEventListener("DOMContentLoaded", function() {
    var accordionDescriptions = document.querySelectorAll(".sqs-block-accordion .sqs-block-content");
    accordionDescriptions.forEach(function(description) {
      description.innerHTML = capitalizeAfterPeriods(description.innerHTML);
    });
  });

  function capitalizeAfterPeriods(text) {
    return text.replace(/\. [a-z]/g, function(match) {
      return match.toUpperCase();
    });
  }
</script>

If someone can help me! Thank you!!

 

website.png

Link to comment
  • Replies 3
  • Views 1.4k
  • Created
  • Last Reply

Top Posters In This Topic

Please post the URL for a page on your site where we can see your issue.

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.

We can then take a look at your issue.

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

Find my contributions useful? Please like, upvote, mark my answer as the best ( solution ), and see my profile. Thanks for your support! I am a Squarespace ( and other technological things ) consultant open for new projects.

Link to comment
  • Solution

Hey Elisa,

Could you not take out all the code and just capitalise the letters manually as you would normally?

Sam Crawford | by Crawford.
 
Multi-award-winning Squarespace expert
 
💸 How I make $500k/year designing Squarespace websites: Watch the video
📱 Hire me to build your Squarespace website: calendly.com/bycrawford/call
 
Did my comment help? To help others benefit, leave a like and mark my answer as 'best'. This lets users scroll straight to the solution they need.
Link to comment
  • 3 weeks later...

Create an account or sign in to comment

You need to be a member in order to leave a comment

×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.