[Resolved] customize author archive page.

Home Forums Support customize author archive page.

Viewing 12 posts - 1 through 12 (of 12 total)
  • Author
    Posts
  • #982505
    An Nguyen

    Hi Tom,

    1/ In mobile mode, I want search icon disable outside, and display it inside “off cavas panel”, don’t I?

    2/ I want avatar in author archive page is round image, and there have some space between name and avatar. Now it is too ugly.

    Thanks.

    #983147
    Leo
    Staff
    Customer Support

    Hi there,

    1. It’s actually quite common to have the navigation search within the mobile header.

    We can’t actually add the navigation search function inside the off canvas panel but we can add a WordPress default search box if you wish?

    2. Try this CSS:

    .inside-page-hero img.avatar {
        border-radius: 50%;
    }
    .inside-page-hero span.vcard {
        padding-left: 10px;
    }

    Adding CSS: https://docs.generatepress.com/article/adding-css/

    Let me know 🙂

    #984550
    An Nguyen

    Thanks Leo,

    1/ After adjusting some layouts and headers in Appearance–> elements. Now, it looks good.

    2/ After adding css, Avatar image is better but, the name text is not good, Can I adjust it center with avatar image following horizontal alignment and have some spaces?

    #984660
    David
    Staff
    Customer Support

    Hi there,

    try adding this CSS to vertically align the elements:

    .author .page-title-headline {
        display: flex;
        justify-content: center;
    }
    #984776
    An Nguyen

    Hi David,

    2/ I added css and it displayed name & image pretty well however, the background is not fullscreen anymore.

    3/Another issue is metadata that displays inconsistently.

    In other pages metadata is: “Posted by NTA | August 3, 2019 | Leave a comment
    But in author archive page is: “Last Updated August 3, 2019 by Posted by NTA

    In other pages, I have used WP show post and in author archive page, it displayed by default.

    Could you help me by displaying the same format please? “Posted by NTA | August 3, 2019 | Leave a comment“.

    #985267
    Tom
    Lead Developer
    Lead Developer

    Hi there,

    1. Instead of this CSS:

    .author, .page-hero-gravatar {
        display: inline-block;
    }

    Can you try this?:

    .page-hero-gravatar {
        display: inline-block;
    }

    2. I think this is happening because you’ve added this CSS: https://docs.generatepress.com/article/show-the-updated-post-date/

    #986467
    An Nguyen

    Hi Tom and David,

    1/ I found reason why it wasn’t full screen. I saw a duplicated code below in my CSS. After removing the code, both David’s and Tom’s CSS code worked.

    .page-hero-gravatar {
        display: inline-block;
    }

    2/ I tried to resolve this issue, but I don’t know why! Can I make a space line between title and metadata info?

    #986645
    David
    Staff
    Customer Support

    So edit the Header Element for your posts, between the title html and your meta html add this:

    <hr class="hero-rule">

    #986882
    An Nguyen

    Sorry David for unclear question! I mean in the title and metadata in container -> wp-show-post area. I want a space line between them. I need you help me to fix it.

    However, after adding your css, title and metadata in header-elements look better now.

    #987043
    David
    Staff
    Customer Support

    Try this CSS:

    .wp-show-posts-entry-meta {
        border-top: 2px solid #ccc;
        margin-top: 6px;
        padding-top: 3px;
    }
    #987419
    An Nguyen

    Thanks David. It’s ok now.

    #987489
    David
    Staff
    Customer Support
Viewing 12 posts - 1 through 12 (of 12 total)
  • You must be logged in to reply to this topic.