Return to previous page

CSS definitions within the product page - by shayb

This topic has 12 replies, 5 voices, and was last updated 9 years, 8 months ago ago by Robert Hall

shayb

Participant

February 28, 2015 at 15:18

Hello,

Some of the CSS definitions i onfigured in the theme options are not displayed, and seems they are overwritten by other css definitions.

when i looked under the page “View Source” i saw a huge chunk of CSS code which is defined in the page header itself, and d=thus override whatever i put in style.css or custom.css.

where this code comes from, and how can i remove it or override it?

Please, contact administrator
for this information.

#46377 Copied Theme version: 1.2 WooCommerce version: 2.33

11 Answers

Eva Kemp

Support staff

February 28, 2015 at 16:08

Hello,

Sorry, but your question is a bit unclear.
What changes are you trying to make?
You must modify only custom.css, not the original style.css file as the changes will be lost in there when you update theme. Or you can create child theme and make changes in its style.css.
https://www.8theme.com/demo/docs/woopress/#!/2_child_theme

Thank you.
Regards,
Eva Kemp.

#46384 Copied

shayb

Participant

February 28, 2015 at 18:57

Hi Eva,

yes, i am changing the custom css only.

i created the following css tag for the breadcrumbs:
.page-heading .title {
font-size: 24px;
font-weight: 700;
}

but the problem is there is an auto-generated css code under the page <header> tag that override this one. how can i mitigate it?

Please, contact administrator
for this information.

#46401 Copied Theme version: 1.2 WooCommerce version: 2.33
Brian Johnson

Member

February 28, 2015 at 19:10
Hello.
If i understood you well the text you would like to change can be modified with this code in custom.css:
```
.woocommerce-breadcrumb {
font-size: 24px;
font-weight: 700;
}
```
With best regards
Brian johnson
#46405 Copied
shayb

Participant

March 1, 2015 at 10:59

Hi Brian,
thanks – this indeed change the breadcrumbs itself, but i need to modify the font size of the product name which appears in the breadcrumb area, above the breadcrumb itself

thanks!

#46463 Copied
Eva Kemp

Support staff

March 2, 2015 at 11:37
Hello,

Sorry for misunderstanding.
Please try to use this code:
```
.page-heading .title {
font-size: 24px !important;
font-weight: 700 !important;
}
```
Thank you.
Regards,
Eva Kemp.
#46545 Copied
mercy20

Participant

March 30, 2015 at 17:41

Hi,

How can I change the font-family, size and color of Featured and New Products on the Homepage?
What would be required to put into the custom.css.

Many Thanks!

#53288 Copied Theme version: 2.6.3 WooCommerce version: 2.3.7
Eva Kemp

Support staff

March 30, 2015 at 17:49
Hello @mercy20,

Please add this code in custom.css file:
//For active opened tab:
```
.products-tabs .tab-title.opened {
    color: #E5534C;
    font-family: opensans;
    font-size: 15px;
}
```
//For non-active tab
```
.products-tabs .tab-title {
    font-size: 16px;
    color: #252525;
    font-family: opensans;   
}
```
Change values to yours.

Regards,
Eva Kemp.
#53292 Copied
mercy20

Participant

March 30, 2015 at 18:29

Hi Eva,

Thanks for your prompt response.

The code isn’t working. I’m referring to the font of the product names of the LATEST and FEATURED products like the one here (https://www.8theme.com/demo/legenda/) i.e. FASHION JACKET.

Many Thanks.

#53327 Copied Theme version: 2.6.3 WooCommerce version: 2.3.7

Brian Johnson

Member

March 30, 2015 at 18:44

Please try to put this code into the custom.css:
.slider-container .product-name a{font-family: 'Dancing Script';color:pink;font-weight:bold;}

With best regards
Brian Johnson

#53334 Copied

mercy20

Participant

March 30, 2015 at 18:52

It Worked! Thank You Very Much.

#53341 Copied Theme version: 2.6.3 WooCommerce version: 2.3.7

Robert Hall

Support staff

March 30, 2015 at 19:10

Hello,

You’re welcome!

Regards,
Robert Hall.

#53347 Copied
Viewing 12 results - 1 through 12 (of 12 total)