Font Size Changes to Nav Bar / Body Text & Custom Adobe Fonts
-
A few questions about font sizes, custom Adobe fonts
1) In the Pique theme, when I adjust the size of the text in the Nav Bar menu (from, say, Small to Normal), the size of the font in the body of all Posts / Pages also changes. Ideally I’d like to be able to change these each separately, can that be done?
2) Can I add Adobe Toolkit fonts that aren’t available via the premium upgrade of Pique? (I don’t love any of the available fonts for the body text in Posts)
3) Possible to lose drop shadow on body text in Posts and add opacity?
4) Can I manipulate orientation of Page titles on their permalink pages (i.e. center the titles, if wanted?)
I was really surprised the Premium upgrade didn’t allow access to these tweaks and I’ve been hitting a brick wall with most of the CSS I’ve already tried.
Thanks!
The blog I need help with is: (visible only to logged in users)
-
Hi there,
1) In the Pique theme, when I adjust the size of the text in the Nav Bar menu (from, say, Small to Normal), the size of the font in the body of all Posts / Pages also changes. Ideally I’d like to be able to change these each separately, can that be done?
To change the navigation font size with CSS, add the following and adjust the size as desired.
.main-navigation a { font-size: 0.8rem; }The main font setting for content and such would be this.
body, button, .archive .read-more a, .blog .read-more a, .search-results .read-more a, input, select, textarea { font-size: 1.125rem; }2) Can I add Adobe Toolkit fonts that aren’t available via the premium upgrade of Pique? (I don’t love any of the available fonts for the body text in Posts)
No, the only custom fonts are those at Customize > Fonts. We cannot add additional fonts from outside.
3) Possible to lose drop shadow on body text in Posts and add opacity?
I’m not seeing a text shadow on body text on your site, and there isn’t an opacity on the body text. It is a lighter grey, are you wanting to change that color to something with more contrast? If so, add the following and adjust the color code as desired.
body, button, .archive .read-more a, .blog .read-more a, .search-results .read-more a, input, select, textarea { color: #726b60; }4) Can I manipulate orientation of Page titles on their permalink pages (i.e. center the titles, if wanted?)
To center the titles on static pages, add the following CSS.
.page .entry-title { text-align: center; } -
Thanks so much!
Do you know if there’s also a way to make it so the nav bar doesn’t collapse on mobile? Have tried a lot of CSS edits but none of them have worked.
On mobile, the site currently shows the first Page in the nav bar but collapses the rest, and I’m working with a client who would like all the pages to be visible on mobile. Thanks in advance for any help you can lend.
-
Thanks so much!
Do you know if there’s also a way to make it so the nav bar doesn’t collapse on mobile? Have tried a lot of CSS edits but none of them have worked.
On mobile, the site currently shows the first Page in the nav bar but collapses the rest, and I’m working with a client who would like all the pages to be visible on mobile. Thanks in advance for any help you can lend.
-
The behavior of the menu is handled with Javascript, so it is something we cannot change with CSS.
Typically the menu changes to the toggled menu that is designed to work with touch devices (tablets and phones). We, and theme designers in general, are always experimenting and honing and changing menu system designs and operations to improve how they work on all devices (desktop, laptop, tablet, phone).
-
Many thanks—so it sounds like there’s no way around the dropdown? Problem in this case is that everything in the nav bar is relative and needs to be seen, so the desktop-to-mobile translation of the nav bar doesn’t quite fit the needs of the content.
-
- The topic ‘Font Size Changes to Nav Bar / Body Text & Custom Adobe Fonts’ is closed to new replies.
WordPress.com Forums 