Change font-size of footer widget for Business Identity theme

kcgoh1988 · Member · Jan 18, 2018 at 6:19 am
Copy link

Add topic to favorites
Hi,

I am using the Business Identity theme and it works great.

I have been searching on the forum if someone had posted this but I can’t find it. I would like to change the font size of footer widget on my website as the description text is now currently larger than the title.

Thanks,
KC

The blog I need help with is: (visible only to logged in users)
shubhamgmath · Member · Jan 18, 2018 at 6:34 am
Copy link
Hi kcgoh1988

This is the basic code that can help you out to change your footer widgets font size.
```
.footer .widget {
    font-size: 10px;
}
```
Hope this will help you out, if not then it will be really helpful if you can make your blog public or accept the invite so that i can have look on it and then i can suggest you the best solution.
justjennifer · Member · Jan 18, 2018 at 6:38 am
Copy link
Hey there, @shubhamgmath, Thanks for your help here. However, please do not ask users of Private sites to make their site public or invite you to their Private sites in order to assist them. Instead, please tag the thread with the MODLOOK tag for Staff. Staff can see every site on WordPressdotcom, including Private sites.

In case you haven’t seen it yet, https://en.support.wordpress.com/wordpress-com-volunteers/ Thanks again
shubhamgmath · Member · Jan 18, 2018 at 6:41 am
Copy link
@justjennifer sorry for that i will take care of this from now onwards

Thanks for updating me on this.
justjennifer · Member · Jan 18, 2018 at 6:43 am
Copy link
@kcgoh1988 I’ve also tagged your thread for Staff assistance. Thanks for your patience while they get back to you.
justjennifer · Member · Jan 18, 2018 at 6:44 am
Copy link
@shubhamgmath you’re welcome. And thanks for helping out here in our forums. :)
kcgoh1988 · Member · Jan 18, 2018 at 6:47 am
Copy link
@justjennifer @shubhamgmath thanks, it hasn’t worked for me yet, so I shall wait for staff assistance.
gemmacevans · Member · Jan 18, 2018 at 9:19 am
Copy link
Hi kcgoh1988,

There are several widgets in the footer of your site. Which widget would you like to change?

Just so you know, your Premium plan includes email and Live Chat support which is available through this page in your account:

https://wordpress.com/help/contact.

However, I’m happy to help here if you would prefer :)
kcgoh1988 · Member · Jan 18, 2018 at 9:24 am
Copy link
Hi gemmacevans,

OK thanks for informing, I will use the live chat support in the future.

For now, I would need a CSS to change to a smaller font size for all the footer widgets. Is that possible?

Thanks,
KC
gemmacevans · Member · Jan 18, 2018 at 2:59 pm
Copy link
Hi KC,

The following CSS will help adjust the font size in your footer widgets:
```
#tertiary p {
	font-size: 12px;
}
```
Paste this code into My Sites > Customise > CSS and change the 12px until you find a size that works best for you.

I also recommend removing the following CSS as it isn’t changing the size of your text:
```
.footer .widget {
	font-size: 5px;
}

.footer-widgets .widget-title {
	font-size: 11px;
}
```
Once you’ve chosen a suitable size, we can look making the text in the Menu widget match.

Let me know how you get on.
kcgoh1988 · Member · Jan 19, 2018 at 2:37 am
Copy link
Yes it works, however, like you said the Menu widget needs to match the font size of other widgets. I have changed the menu widget to text widget and hyperlink each individual page. That works fine for me anyway.

I would like to know if we can space out the widgets across the page to look more balanced?

Thanks,
KC
gemmacevans · Member · Jan 19, 2018 at 2:35 pm
Copy link
Hi KC,

I’m glad that CSS worked :)

I would like to know if we can space out the widgets across the page to look more balanced?

Do you mean you would like the widgets to expand across more of the grey bar at the bottom of your site?
kcgoh1988 · Member · Jan 19, 2018 at 2:46 pm
Copy link
Yes that’s right. Basically increasing the horizontal distance between widgets.

Thanks,
KC
gemmacevans · Member · Jan 22, 2018 at 9:48 am
Copy link
Hi KC,

This CSS will spread the widgets out over the width of the grey background:
```
#tertiary .grid {
	max-width:100%;
}
```
Each widget occupies the same amount of space but the menu widget looks narrower because the text is shorter.
kcgoh1988 · Member · Jan 23, 2018 at 2:19 am
Copy link
Hi gemmacevans,

Thanks, it works fine but maybe I will leave it out for now.

Thanks,
KC
gemmacevans · Member · Jan 23, 2018 at 9:19 am
Copy link
Sure, no problem :)

No items found.