[Resolved] Title Moving With Meta

[Sourabh]

Hi,

Seems the meta title of my post moving with my post Title, However, I want to set the Featured image just below the title and wants meta to display below the featured image, (However Meta moves with Title) how to make it ???

[Elvin]

Hi,

To clarify: You want the Featured image to be inbetween the Post Title and the entry meta?

If so, set the featured image’s Location to “Below title” on Appearance > Customize > Layout > Blog and then add this PHP snippet:

add_action( 'wp', function() {
    remove_action( 'generate_after_entry_title', 'generate_post_meta' );
    add_action( 'generate_after_entry_header', 'generate_post_meta', 15 );
} );

The order of things should look something like this:
https://share.getcloudapp.com/yAuZ9Xzj

[Sourabh]

It’s breaking my Meta Style (Lines, styles etc), So how to manage it ???

Refer private section for sample –

[Elvin]

Can you link us to the site/page where this is issue is occurring? So we could check how it is laid out.

You can provide the site details on the private information text field. Thank you.

[Sourabh]

Okay, Find the same..

at present, I have deleted the code from function.php because it was destroying the formatting of my meta…

so you can add code again for checking purposes, you are allowed to do it…

Regds:

[Elvin]

so you can add code again for checking purposes, you are allowed to do it…

I’m afraid it’s against our policy to directly apply any changes to the user’s site.

at present, I have deleted the code from function.php because it was destroying the formatting of my meta…

We can fix the styling you applied to be applicable to the changes made by the PHP filter.

That said, can you re-apply the PHP snippet keep it temporarily until we take a second look? So we could check for the appropriate selectors to use for styling it.

Let us know.

[Sourabh]

Fine, its done..check now

However, also refer to before and after snapshot in the P-section…

Regds:

[Elvin]

Thank you.

Add this CSS to revert the styling to the preferred layout.

.inside-article .entry-meta {
    display: flex;
    border-top: 1px solid black;
    border-bottom: 1px solid black;
    padding: 10px 0;
}

.inside-article .entry-meta > *:first-child {
    margin-left: auto;
}

.inside-article .entry-meta > *:last-child {
    border: unset;
    margin-right: auto;
}

.inside-article .entry-meta > * {
    border-right: 2px solid #ccc;
    padding: 0 10px;
}

.inside-article footer.entry-meta {
    border: unset;
}

[Sourabh]

Lol, it’s reflecting even on the home page now???

I just needed it for post only ??

[David]

For the single post only, in Elvins CSS replace each instance of: .inside-article with .single-post .inside-article

[Sourabh]

did it but could not help, its just removed border of meta nothing else..

[David]

Your CSS should look like this:

.single-post .inside-article .entry-meta {
    display: flex;
    border-top: 1px solid black;
    border-bottom: 1px solid black;
    padding: 10px 0;
}

.single-post .inside-article .entry-meta > *:first-child {
    margin-left: auto;
}

.single-post .inside-article .entry-meta > *:last-child {
    border: unset;
    margin-right: auto;
}

.single-post .inside-article .entry-meta > * {
    border-right: 2px solid #ccc;
    padding: 0 10px;
}

.single-post .inside-article footer.entry-meta {
    border: unset;
}

[Sourabh]

Just to detach a meta from the title, so much has to do ??

dont we have any simple process David ??

[Sourabh]

after applying css, the problem is still the same..

[Elvin]

Let’s we clarify a few things:

What pages do you want this applied?

The modification on the CSS David suggested only applies to single post pages.

And I’ve checked the site and it’s actually applied. Here’s what I see on my end:
https://share.getcloudapp.com/JruqQDeZ

Now the issue seems to be that you want this applied to archive pages to BUT NOT static pages?

If that’s the case then you can re-modify the CSS David provided into this:

body:not(.page) .inside-article .entry-meta {
    display: flex;
    border-top: 1px solid black;
    border-bottom: 1px solid black;
    padding: 10px 0;
}

body:not(.page) .inside-article .entry-meta > *:first-child {
    margin-left: auto;
}

body:not(.page) .inside-article .entry-meta > *:last-child {
    border: unset;
    margin-right: auto;
}

body:not(.page) .inside-article .entry-meta > * {
    border-right: 2px solid #ccc;
    padding: 0 10px;
}

body:not(.page) .inside-article footer.entry-meta {
    border: unset;
}

We basically just changed .single-post to body:not(.page) so it applies on all pages except static pages like the home page, about page and contact me page.

[Author]

Posts