[Resolved] Customizing entry meta

Home Forums Support Customizing entry meta

Viewing 15 posts - 1 through 15 (of 22 total)
  • Author
    Posts
  • #1179840
    Anas

    Hi πŸ™‚

    I have two questions:

    1. Is there a way to 1) add the time (HH:HH AM/PM) to the entry meta, 2) use the abbreviation of the month (FEB instead of February for example), 3) add the comments count next to the date? so the entry meta would look like this: https://imgur.com/a/3P5Oqht

    2. How can I change the width of the entry-header so it would be the same as the width of the featured image?
    Here’s how my entry-header looks like: https://imgur.com/oZkQ7ly and here’s how I want it to look: https://imgur.com/hh54SoY

    #1180255
    Tom
    Lead Developer
    Lead Developer

    Hi there,

    1. You can change the date and time format in “Settings > General”.

    2. To add the comments count to the top entry meta, try this:

    add_filter( 'generate_header_entry_meta_items', function( $items ) {
        $items[] = 'comments-link';
    
        return $items;
    } );
    
    add_filter( 'generate_footer_entry_meta_items', function( $items ) {
        return array_diff( $items, [ 'comments-link' ] );
    } );

    3. Try checking the “Display padding around images” option in Customize > Layout > Blog.

    Let me know πŸ™‚

    #1180826
    Anas

    Hey Tom,

    It worked thanks! However, regarding your 3rd answer, I tried the “Display padding around images” option, but it didn’t perfectly work.
    Here’s how the posts look like without the padding around images: https://imgur.com/a/LkwzJHn and here’s how they look with the padding: https://imgur.com/a/2revADf

    After applying the “Display padding around images”, the image size got smaller. I want to keep the same image size but increase the entry-header’s width to fit the image width πŸ™‚

    #1181086
    Tom
    Lead Developer
    Lead Developer

    Can you possible check the padding around images option and leave it saved so I can check out the CSS?

    Have you tried decreasing “Separating space” option in Customize > Layout > Container?

    #1181220
    Anas

    Yes. I tried decreasing “separating space” option, but the image is still wider than the the entry-header even though the separating space is 0px. Here’s how the posts look like with 0px separating space: https://imgur.com/zFAcBVc

    I set the separating space back to 40px and checked the padding around images option.

    #1181912
    Tom
    Lead Developer
    Lead Developer

    Try adding this CSS:

    .generate-columns .inside-article {
        padding: 0;
    }
    #1182027
    Anas

    I appreciate it Tom! Now, it works perfectly on desktop (using your last CSS code and checking the “display padding around images” option ): https://imgur.com/p6Bi0wG
    However, here’s how it looks on mobile: https://imgur.com/XjqIhRy
    Here’s how it looks on mobile without the CSS code but “display padding around images” is checked: https://imgur.com/MJlQbmP

    #1182174
    David
    Staff
    Customer Support

    Hi there,

    not sure how you want it to look on mobile, but try this CSS instead:

    @media (min-width: 768px) {
        .generate-columns .inside-article {
            padding: 0;
        }
    }

    This will only remove the padding on desktop

    #1182350
    Anas

    Hey David,

    Thanks for the reply!
    The desktop version is working perfectly (I used Tom’s CSS code and checked the “display padding around images” option). So I don’t want to edit the desktop version.
    However, the mobile version looks strange (https://imgur.com/XjqIhRy). As you can see, the picture/title are as wide as the screen itself!
    I want the post-image/entry-header to look like this: https://imgur.com/MJlQbmP (That’s the result I get for the mobile version by just checking the “display padding around images” option )

    So using the CSS code and the padding option works just for the desktop version and using the padding option works just for the mobile version. Is there a way to apply style only for mobile device?

    #1182371
    David
    Staff
    Customer Support

    If you simply replace the code Tom provided with the code i gave you here then that will do exactly what you require.

    #1182385
    Anas

    Thanks! It finally worked!

    #1182533
    David
    Staff
    Customer Support

    Glad we could be of help

    #1241698
    Anas

    Hey Tom,

    The PHP code you provided in post #1180255, to add the comments count to the top entry meta, works perfectly. However, I couldn’t change the default ‘Leave a comment’ text.

    Here’s how it looks when a post has no comments: https://imgur.com/a/9Y8t7R8
    Here’s how it looks when a post has X comments: https://imgur.com/a/DWISpQO

    I tried the generate_leave_comment filter to get rid of the default text and show ‘0 comments’ when there aren’t any comments yet but David told me that the filter only works with the default WordPress Comments form. I hope you guys can find a solution in the future so the generate_leave_comment filter works with other comments’ plugins.

    #1242205
    Tom
    Lead Developer
    Lead Developer

    Hi there,

    Does this work?:

    add_filter( 'gettext', function( $text, $original, $domain ) {
        if ( 'Leave a comment' === $text && 'generatepress' === $domain ) {
            return '0 Comments';
        }
    
        return $text;
    }, 10, 3 );
    #1243409
    Anas

    Hi Tom,

    After I addeed this code my website crashed completely! I can’t even access the WP admin dashboard

Viewing 15 posts - 1 through 15 (of 22 total)
  • You must be logged in to reply to this topic.