如何在原始单列中显示第一个帖子，在两列中显示所有其他帖子？ WordPress的

What I need is a bit like this guy, but a bit more complicated I guess: how can I display the first post in a single column and others in 2 columns? wordpress

So currently my posts are displayed this way:

A (newer post)

B

C

D (older post)

etc.

I'd like them to show up like that:

A

B C

D E

F G

etc.

Problem is, starting at post B, the titles and excerpts will keep the same font size as post A - which is two big to look great in the two columns section. I could correct that by reducing the font size, but that would reduce the font size of the A post title and excerpt too, and the title and text content as well in the post page.

So is there any way, on the home page, to reduce the font size of B-G posts titles and excerpts on the home page without affecting the A post ones AND the post pages' title and text content?

Or, doing it differently, customizing the font size of the title and text content in the post page without affecting the posts' title and excerpt on the home page?

Any help or other ways of doing much appreciated!

A pure CSS solution would be to set a style for the posts as a whole. That style would be the 2-column style. Then set a style for the first post using the css pseudo-selector :first-of-type

CSS Example

.post {
    display: block;
    width: 50%;
}
.post p {
    //style your heart out
}
.post:first-of-type {
    width: 100%;
}
.post:first-of-type p {
    //larger font style
}

The 'first of type' selector will not introduce any extra classes to maintain or extra PHP code. It is also currently usable by 97% of internet users.

The other option would be to introduce an extra css class, eg first-post with it's own style. Then, in your loop that presents the posts, you could add a counter, and when that counter is 1, do one style, otherwise do the 2 column style.

PHP Example Pseudo code

for ($i = 0; $i<count($posts); $i++) {
    if ($i == 0) {
        // do single column
    } else {
        // do double column
    }
}