Shopify themes, liquid, logos, and UX
Hi,
I am using Supply theme. Can anyone advise how I can limit the length of the product name so that the 'Add to cart' button can be align on the same level?
Please help.
KK
Solved! Go to the solution
This is an accepted solution.
Hi @KKWAN
Open snippet->product-grid-item.liquid and fine {{ product.title }}
now change this code with below:
{{ product.title | truncate: 30}}
Note: you can change 30 with any number that mean they show 30 character of title.
Give me your page URL, so I can give you a custom code to fix.
Please let me know if it works by giving it a Like or marking it as a solution!
PageFly - #1 Page Builder for Shopify merchants.
All features are available from Free plan. Live Chat Support is available 24/7.
Hey Richard, can you please help me. I'd like to limit the product titles to 2 lines for uniformity. Like if the title would take up more than 2 lines, it just shows ellipses at the end of the second line.
My site url is https://gadzone.co
This is an accepted solution.
Hi @KKWAN
Open snippet->product-grid-item.liquid and fine {{ product.title }}
now change this code with below:
{{ product.title | truncate: 30}}
Note: you can change 30 with any number that mean they show 30 character of title.
Thanks for your help.
Hi Jasoliya
Please help us to solve the product title issue on the collection page here is a screenshot https://www.screencast.com/t/TfybUg5C82G
here is the website collection page https://ihighlands.myshopify.com/collections/african-blackwood-bagpipes
1. Go to Online Store->Theme->Edit code
2. Asset->theme.scss->paste bellow code in bottom of file
@media only screen and (min-width: 767px) {
.product-grid .product .name{ max-width: 265px;}
}
@media only screen and (max-width: 767px) {
.product-grid .product .name{ max-width: 165px;}
}
Thank you so much for your quick reply. But there is no theme.scss file under ASSETS
Then you can add in any cs file you have.
Yes, it's work. You are super
Many thanks.
Hi Jasoliya
We are facing issue with mega menu
Sometime mega menu show like this
and sometime show correct with space
here is url https://ihighlands.myshopify.com/
CAN YOU PLEASE HELP US TO SOLVE ISSUE?
Thank you
Try to add this css:
1. Go to Online Store->Theme->Edit code
2. Asset->theme.scss->paste bellow code in bottom of file
@media only screen and (min-width: 767px) {
#megamenu-main-menu .col-sm-2.static-menu{ padding-right: 20px;}
}
Hi Jasoliya,
Thanks for your reply. Yes, problem solved but the other menu problem does not solve here is the screenshot. Highly appriciate if you send another codes which solve whole mega menu
Thanks again
Remove previous code and add this new:
@media only screen and (min-width: 767px) { #megamenu-main-menu .static-menu{padding-right: 20px;} }
@Jasoliya Hope you are fine and in good health. below you can check the image view on mobile you can see the product title on the collection page
can you please help me to solve the issue?
thank you
I can see itts fine now.
Hello
We have a store https://ihighlands.myshopify.com/ we want to replace add to the cart button text to VIEW text button when customer click on VIEW page should be redirected to a product page
like this example https://themes.shopify.com/themes/venture/styles/outdoors/preview here is more clear example https://www.screencast.com/t/vPUipiC1wip
As i can see you have paid theme so must need custom code for that.
Hello @Jasoliya
Hope you are fine and good health. I am facing issue with vertical menu width here is screenshot https://www.screencast.com/t/fLpvMQU0ygl
backend width is 100% but its not show 100% can you please help me with code please here is link https://biznimart.myshopify.com/
Thanks always your great support and help
Add this css in assets/bootstrap-purged.css
ul.megamenu li .sub-menu .content { width: 800px; }
ul.megamenu li .sub-menu .content .col-sm-2.static-menu { width: 20%; padding: 0 10px 0 0; }
It will help bit.
Hi @Jasoliya
I paste code custom_code.scss now low better it is possible more width and rest collection show right like below screenshot
with text space
Hi
As this is paid theme there are many possibility to manage code, so we cant manage it easily if you want to do we have to change code structure for that and for that you have to hire someone.
hi @Jasoliya
I want Shorten TITLES automatically to 130 character count because when import product from suplier .they have more than 130 characters .i want product title will not exceed the 130 chracterr every time when i import new products .
please , it's possible ?
thank you
Hi @korabic
You can use this code to truncate collection title till 130
{{ product.title | truncate: 130 }}
You have to find "product.title" in section->product-template file and replace with my given code
Many Thanks & You are Awesome
How can I do this on mobile only?
if you want only for mobile than you have to hide show title for desktop and mobile by code and then for mobile only try my above code,
Hi Jasoliya.
How Can I Limit The Length Of The Product Name with Studio theme.
I can find snippet->product-grid-item.liquid and fine {{ product.title }}
Hi! Can I also edit anything here to make the title left aligned?
Thank you!
Portrait of Stephen positioned next to an image of planet Earth, with the Stephen's World ...
By JasonH Mar 18, 2024Digital marketers and app developers have tracked activity in apps and websites for yea...
By Ollie Mar 13, 2024February was an exciting month with Shopify Editions, informative webinars, and more! F...
By JasonH Mar 7, 2024