HI,
I’m using the Impulse theme, I should make a change for the product titles.
They are automatically cut and sent at the end, they are not very understandable and aesthetically horrible.
I hope someone can help me.
Thank you!
Hi Alice,
Yes, I need assistance. What information do you need to solve my problem?
Thanks
could you explain what you actually want
Hi Jack,
I wish the headlines weren’t cut. As you can see in the screens, the text goes through on its own, I’d rather that if a word was too long, it goes straight to the head as you can see in the “desktop” view.
Tell me if I explained myself well.
Thanks
add the following code in theme.js
// Wait for the document to be fully loaded
document.addEventListener(“DOMContentLoaded”, function() {
// Check if the screen width is below a certain threshold (e.g., 768px, typical for tablets)
if (window.innerWidth <= 768) {
// Get all elements with the class ‘grid-product__title–heading’
var productTitles = document.querySelectorAll(‘.grid-product__title.grid-product__title–heading’);
// Loop through each product title
productTitles.forEach(function(title) {
// Split the title into individual words
var words = title.textContent.split(’ ');
// Replace the original title with individual words wrapped in elements
title.innerHTML = words.map(function(word) {
return ‘’ + word + ‘’;
}).join(‘
’);
});
}
});