Vendor Name Above Product title: Impulse Theme

Store Design
1

Hi,

I’m looking to make the vendor name appear above the product title for my collection page & product page. I would like to also make it in bold if not to much work. I’m using Impulse then. I’m pretty decent with adding codes just don’t know where or what to add. Any help is appreciated. I’ve attached pictures my site is https://luxurymrkt.com

F0984717-F772-4713-BA15-5AC781A603CD.png
F0984717-F772-4713-BA15-5AC781A603CD.png1170×2532 222 KB

1A5E424F-1077-4449-A5A6-F61D6866AED8.png
1A5E424F-1077-4449-A5A6-F61D6866AED8.png1170×2532 252 KB

1 Like
2

@Luxurymrkt

add this code

  1. Go to Online Store → Theme → Edit code
  2. Asset → /theme.css → paste below code at the bottom of the file.
.grid-product__meta {
    display: flex;
    flex-direction: column;
}

.grid-product__vendor {
    order: -1;
    font-weight: bold;
    margin-bottom: 4px;
    font-size: 11px;
}

.product-single__vendor a {
    font-size: 14px;
    font-weight: bold;
}
1 Like
3

This worked perfect, only thing is on my product page the product title font is still bold because it’s part of all my header titles etc. Is there a code to just make the product title normal weight?

4

Also on the homepage, featured collection and on my collection pages the Vendor font doesn’t seem to be black. Is there a way to fix this? I tried changing all the colors in the theme regular way but didn’t adjust maybe some code. Picture attached it seems to be a grey color

232174E0-B997-4E63-9BAE-1BC634E97C95.png
232174E0-B997-4E63-9BAE-1BC634E97C95.png1170×2532 270 KB

1 Like
5

@Luxurymrkt

yes, please try this code

  1. Go to Online Store->Theme->Edit code
  2. Asset->/theme.css ->paste below code at the bottom of the file.
.product-single__title {font-weight: normal;}
1 Like
6

Yes that worked! Just need to change the color of vendor name font to black. Only my homepage and collection pages. If it’s easy thank you and won’t bother you again :slightly_smiling_face: it seems to be a dark grey.

B43C73DD-5AD4-47C6-B5A3-4B05B147DA66.png
B43C73DD-5AD4-47C6-B5A3-4B05B147DA66.png1170×2532 151 KB

1 Like
7

@Luxurymrkt

no rush its my pleasure to help us can you try this code

  1. Go to Online Store->Theme->Edit code
  2. Asset->/theme.css ->paste below code at the bottom of the file.
.grid-product__vendor {opacity: 1;}
1 Like
8

Thank you you’re the best

1 Like
9

@Luxurymrkt

its my pleasure to help us best of luck for your all products

1 Like