Return to previous page

Woocommerce categories font - by Mike1986

This topic has 10 replies, 4 voices, and was last updated 7 years, 6 months ago ago by Robert Hall

Mike1986

Participant

October 7, 2016 at 09:51

Hi!

I would like to change the Woocommerce categories font to match the same I have on the site. How could I do this?

I tried this code that I found on another topic but it didn’t work:

.widget-container select {
font-family: Open Sans;
font-size: 12px;
color: #4a4a4a;
}

From where I should change the fonts? From the Appearance or from the Theme options? Bit confusing that there are two places to change the fonts 🙂

I would also like to change the menu font to normal (Vinkkejä Jalkojen Hyvinvointiin -> Vinkkejä jalkojen hyvinvointiin). And other change I would like to make is the product headlines, they are now in caps locked.

Please, contact administrator
for this information.

#141908 Copied

9 Answers
Jack Richardson

Support staff

October 7, 2016 at 11:26
Hello,

1. Go to Theme Options > Typography and set needed font for your site.

2, 3. Try to add this css code in child theme style.css:
```
.menu > ul > li > a, .product-name a {
   text-transform: none !important;
}
```
Best regards,
Jack Richardson.
#141928 Copied
Mike1986

Participant

October 7, 2016 at 18:59

Thanks for the code!

I would like to use Google font named Titillium Web. I selected it from the Appearance->Default typography but it’s not to be found in the Theme options->Typography section. What should I do to get the Titillium Web font?

I installed Easy Google Fonts plugin but it says my Google API key is invalid. The same API key works fine with Google Maps.

#142008 Copied
Robert Hall

Support staff

October 8, 2016 at 07:51
Hello,

I’ve imported the font into style.css of the Child Theme.
@import 'https://fonts.googleapis.com/css?family=Titillium+Web';
```
body{
font-family: 'Titillium Web', sans-serif !important;
}
```
Now you can applied it to your site.
For example, if you want to change the font of menu items use this code in style.css
```
.menu > ul > li > a{
font-family: 'Titillium Web', sans-serif !important;
}
```
Regards,
Robert Hall
#142023 Copied
Mike1986

Participant

October 9, 2016 at 09:24

Thanks!

I don’t see the Titillium Web font in the Theme options -> Typography. I would like to make the Woocommerce categories font bigger so what should I do? Is it H2,H3 or what? 🙂

#142044 Copied
Jack Richardson

Support staff

October 10, 2016 at 08:18
Hello,

Use this code in child style.css file:
```
ul.product-categories a {
    font-size: 18px;
}
```
Best regards,
Jack Richardson.
#142063 Copied
Mike1986

Participant

October 11, 2016 at 08:41

Thanks! The Woocommerce categories font is now okay.

If I may use this same topic to ask quick question about the footer copyright text. It goes into two rows and I would like it to be only on one row. How can I do that?

I inserted this code to the custom.css file but it didn’t work:
.copyright .footer-copyright{
width:500px;
}
.copyright .span6 {
width: 300px;
float: right;
}

#142248 Copied
Rose Tyler

Support staff

October 11, 2016 at 09:00
Hello,

You can add this code in Custom CSS:
```
.footer-black-bg #after_footer_menu {
   width: 100% !important;
}
.span6.footer-copyright {
   width: 100%;
   margin-top: 12px;
   margin-bottom: 5px;
}
.copyright {
   width: 100%;
}
```
Regards,
Rose Tyler.
#142250 Copied
Mike1986

Participant

October 12, 2016 at 11:22

Thanks!

#142399 Copied

Robert Hall

Support staff

October 12, 2016 at 14:12

Hello,

You’re welcome!

Regards,
Robert Hall

#142444 Copied
Viewing 10 results - 1 through 10 (of 10 total)