Author (Pro?) Features

Hey Chris,

Thanks for considering the upgrade!

Author Pro’s font feature integrates seamlessly with Author, but I think if it’s the only feature you want, I would recommend checking the Easy Google Fonts plugin. I recently published a tutorial on using EGF you can follow along with.

Thanks Ben!
I installed the plugin, and read your tutorial. Thanks for the links, btw.
Sadly, I enter a name for a new Font Control, and it sits there spinning… never to finish creation. BUT, I’m guessing that this is an issue with their plugin, not with Author. So I’ll take it up with them.

Darn, okay it sounds like maybe a Javascript error with that plugin or conflicting with another one. I know WordPress 4.7 just came out, so that could be related as well.

Out of interest, I logged a fault on the EGF forum. EGF version 1.4.2 was released less than 8 hours later as a result (for latest WordPress compat). Sweet!

Now that’s impressive!

Nice! I’m glad to hear they’re so responsive.

ACTUALLY (Sorry Ben) there does seem to be something amiss, now that it’s working.

I’ve been able to successfully change the font for the paragraph and post titles (which, through trial and error I figured out were ‘Heading 2’), BUT I can’t seem to change the font SIZE for the post titles. Dragging the slider doesn’t do anything (it works fine for the Paragraph font, but not the H2).

There doesn’t seem to be anything in my custom CSS (which is probably a bit muddled as it has undergone various additions).
Here’s the custom CSS:

.blog .post-content,
.archive .post-content,
.search .post-content {
text-align: left;
border-radius: 35px;
}

body {
-webkit-hyphens: none;
-moz-hyphens: none;
hyphens: none;
}
.max-width {
max-width: none;
}

.featured-image img {
border-radius: 15px 15px 0 0;
overflow: visible;
padding-bottom: 0;
height: auto;
line-height: 0;
text-align: center;

> img,
> a > img {
position: static;
height: auto;
width: auto;
object-fit: contain;
}
> a {
position: static;
}
}

.entry article {
border-radius: 15px;
}

.entry.has-post-thumbnail article {
border-radius: 0 0 15px 15px;
}

So, there doesn’t seem to be anything preventing me from changing the font size of the post main headings, but I can’t seem to do it.

I know there’s a lot here. Sorry again!

No worries, I see what’s happening.

The post title size is styled with a class, “.post-title”, which an h2 selector won’t override. In the EGF settings, there’s an option to force override the theme styles. If you haven’t turned this on already, give that a shot.

Otherwise, you can use the following CSS instead:

.post-title {
  font-size: 37px;
}
@media all and (min-width: 700px) {

  .post-title {
    font-size: 51px;
  }
}

Change the first value (37px) to adjust the size on all screens under 700px wide, and the second value (51px) to adjust the size on all screens over 700px wide.

Looking good man. Thanks to you!
I think (I hope) I’ve nearly got the typography the way I want it.

One last thing.

Flick me some code to modify the Heading styles? Specifically, I’d like to reduce the line spacing underneath (h3, for example) so that the paragraph text sits more snuggly underneath, and not 6 or 12 points lower. Know what I mean?

Got it, try modifying the line height, like this:

h2 {
  line-height: 1;
}
h3 {
  line-height: 1;
}

Some of the spacing is also due to the margins on the paragraphs, so you may want to experiment with that as well:

p {
  margin: 18px 0;
}