How to make alignment for product name/ vendor/ and price in the collection page

Hi Shopify Community,

Is there any way to make Product Name in the same line between products in the Collection Page. Same to Vendor and Price between products. Here is an example for my store: https://dfsouth.com.au/collections/party-style

As you can see, i want to make the brand name in the same line between these Gucci products. Same to the vendor name, Gucci and the price too.

Thanks

I would not recommend you to make all information fit into a single line as it can cause problems on mobile. It will be better to use default design though vendor value can be added next to product title’s

Hi @DFSouth ,

You can try this code by following these steps:

Step 1: Go to Online Store->Theme->Edit code.

Step 2: Search file theme.liquid

Step 3: Paste the below code at the bottom of the file → Save


Hope my solution works perfectly for you!

Best regards,

Oliver | PageFly

Hi @PageFly-Oliver ,

Your solution does work. I do appreciate that tbh. But there is one thing I wanna ask for the collection page**.** Is there any code that I can make the PRICE SIZE smaller on the collection page & only on mobile version but not affecting product page & desktop version.

I have put one code to modify but it changes the price size of both collection and product pages. Again, thanks for your support.

You can try


Hi @PageFly-Oliver

I put them in the theme.liquid as shown below but it doesn’t work on mobile version.

@PageFly-Oliver , would you mind to gimme an update for this code? Thanks a lot.

you can go to the theme.liquid and remove one character