Docs

[Karen]

Hi there,
I’m trying to get my blog in a nice shape. Some questions could be answered by searching the forum (font size meta, font size blog post headers), but now I’m stuck again.
1. The comment form is huge!, I mean the whole thing. I wanted to get font size smaller (headline and everything) and tried this:

#reply-title {
font-size: 285.7%;
}
.comment-form-author label, .comment-form-email label, .comment-form-url label, .comment-form-rating label, .comment-form-comment label {
font-size: 171.4%;
}

and played with the size, but there was now effect whatsoever.

2. The “read more” button should be smaller, so I tried this:
.more-link {
font-size: 24px;
}
and went down to 10 px. No change.

3. Is there a way of getting the Submit-button smaller?

and 4. my sidebar is worrying me, too. Every entry there is too big, “newest entries” and “archives” etc.

I would appreciate very much if you could help me with some matching code.
I do have child theme installed meanwhile – as you said, that was easy and went smoothly 🙂

Thanks, Karen

PS, 19:51 GMT: I just managed to solve #2 🙂

[Karen]

This reply has been marked as private.

[Joao]

Hi There,

Please add the following code to Appereance > Customizer > Custom > CSS

#reply-title {
    font-size: 25px;
}

.comment-form-author label, .comment-form-email label, .comment-form-url label, .comment-form-rating label, .comment-form-comment label, .widget_calendar #wp-calendar th, .p-landmark-sub strong, .widget_tag_cloud .tagcloud a:hover, .widget_tag_cloud .tagcloud a:active, .entry-footer a:hover, .entry-footer a:active, .x-breadcrumbs .current, .x-comment-author, .x-comment-author a, .h-widget {
    font-size: 17px;
}

.single-post input[type="submit"] {
    padding: 8px;
    font-size: 14px;
}

Let us know if we can help you with anything else.

Joao

[Karen]

Hi Joao,
great, thank you, it’s getting better – on the one hand 🙂
The thing is the font size in “last entries” widgets is larger than my blog post font size. Please tell me how to decrease that font size. See screenshot attached.

On the other hand there came some quite annoying changes along with the new code: now the breadcrumbs are a lot larger than before, and they are suddenly uppercase. And the navbar links are a lot smaller then they were.
What went wrong?

Thanks, Karen

# EDIT: I’ve been testing the “comment” function, which works perfectly. Nonetheless the word “reply” still is very large. I managed to fix the font size of “read more” this afternoon, so how would I get “reply” smaller, please?

[Karen]

This reply has been marked as private.

[Paul R]

Hi,

You can add this under Custom > CSS in the Customizer.

body .comment-reply-link {
   font-size:20px;
}

You may change 20px to adjust the font size.

Thanks

[Karen]

Hi Paul,

wunderful, that one worked too 🙂

Now my last issues with font sizes in blog page:
– I still can’t work out how to reduce font size of sidebar widgets
– Header size “Comment” is far too big
– and the thing with breadcrumbs size is still an issue. How come they have double size suddenly?

Maybe the screenshots explain better what I mean.

Thank you so much! And regards, Karen

[Paul R]

Hi,

You can add this under Custom > Edit Global CSS in the Customizer.

/* sidebar widget links */
.x-sidebar .widget a {
   font-size:15px;
}

/* breadcrumbs */
.x-breadcrumbs a,
.x-breadcrumbs span {
   font-size:15px;
}

/* comments title */
.h-comments-title span {
   font-size:15px;
}

Hope that helps.

[Karen]

Hi Paul,
thank you very much for the code! #3 worked out fine.
Something is weird though, as this one doesn’t achieve any visible change:
/* sidebar widget links */
.x-sidebar .widget a {
font-size:15px;
}

And this one will only affect the font size in primary level, not when going to submenus. There the font size still is as large as it was before:
/* breadcrumbs */
.x-breadcrumbs a,
.x-breadcrumbs span {
font-size:15px;
}

I would appreciate any hint, thanks!
Regards, Karen

[Christopher]

Hi there,

#1 There is no link in sidebar, see http://www.hartig-coacht.de/?page_id=1638

#2 Please update previous code to :

.x-breadcrumbs a, .x-breadcrumbs span, .x-breadcrumbs .current {
    font-size: 15px;
}

Hope it helps.

[Karen]

Hi Christopher,
#1 No links… sorry, that’s the code support suggested? I only want to decrease font size in the sidebar widget “newest posts”, that’s all. The last 5 entries are listed there and font size is larger than in the blog posts; doesn’t look good.

# 2 Breadcrumbs are align and in perfect size again, thanks you 🙂

One more thing, how would I get rid of some padding around blog posts? See screenshot. I just tried all codes found in forum search but none of them worked for me 🙁

Thank you!

[Christopher]

Hi there,

please add following code as well.

#1

.x-sidebar div#recent-posts-4 a {
    font-size: 12px;
}
.widget.widget_recent_entries li {
    padding: 0.4em;
    font-size: 61.25%;
}
.x-sidebar div#x_email_form-2 h1 {
    font-size: 17px;
}

#3

.entry-wrap {
    padding: 34px;
}
.hentry {
    margin-top: 1em;
}

To make content area wider, increase site width under Customize -> Layout and design.

Hope it helps.

[Karen]

Hi Christopher,
great great great, everything worked out with that!

Would you answer one last question for this year? 🙂 The following code you gave me was perfect to decrease headline size in my blog page:

.blog h2.entry-title a {
font-size: 25px;
text-transform: none;
}

The thing is, when I then click a post and it opens in a new page, the size of the header is back to “large” on that page. The code doesn’t affect the second level obvioulsy. So how could I decrease the size there, please?

Thanks,
Karen

[Rue Nel]

Hey Karen,

Thanks for the updates. To resolve your last question, please have the code updated and make use of this code instead:

.blog h2.entry-title a,
.archive h2.entry-title a,
.single-post .entry-title {
  font-size: 25px;
  text-transform: none;
}

Hope this helps.Please let us know if this has worked out for you.

[Karen]

Hi Rue Nel,

yes, that worked out perfectly, thanks!

Here are the last blog issues I’m trying to solve and I would appreciate any help:

#1. Main problem is what happens to my image (which I have instead of blog header) when I get to the next page level or klick onto “archives” in the sidebar. See screenshot. As you can see,
a) the 100% width formatting disappears and
b) there is a huge headline stored underneath, it says “Post Archive by Month / here you can find a list of all posts from December”

I wouldn’t mind at all if none of the second level pages show that picture at all. Would that work?

In any case that header title is a big problem, it’s in the wrong language and far too big as well. I would have to find a way of customizing size and language. What would you suggest? As it is only the archive page, I’ll take any easy solution 🙂

#2. How can I decrease font size in the sidebar widget “Archives”?

#3. You already helped me fixing the headline size of “Comment” in the second blog page level, only thing left is the size of the round button that indicates the amount of comments. Is there a way of getting that smaller, please? See screenshot.

Thank you and regards, Karen

[Author]

Posts