[Support request] How to add custom icon on blog archive?

Please login to receive premium support.

Support for the free plugin can be found here.

Home Forums Pro Support How to add custom icon on blog archive?

This topic contains 5 replies, has 2 voices, and was last updated by  Tom 1 week, 3 days ago.

Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • #6675

    Chao
    Participant

    Hi there

    I want to add date and author custom icon on blog archive?

    2018-11-27_12-03-45.png

    How to do this?

    Thanks

    #6687

    Tom
    Keymaster

    Hi there,

    You’d need to have that icon font uploaded to your child theme.

    Then you could do this:

    .wp-show-posts-author .author-name:before {
        font-family: Your Icon Font;
        content: "\icon code";
    }
    
    .wp-show-posts-entry-date:before {
        font-family: Your Icon Font;
        content: "\icon code";
    }
    #6691

    Chao
    Participant

    Hi Tom

    If I want to use my image on the wp dashboard’s media.

    Is it right?

    
    .wp-show-posts-author .author-name:before {
        font-family: Your Icon Font;
        content: <img src="img.jpg">;
    }
    
    .wp-show-posts-entry-date:before {
        font-family: Your Icon Font;
        content: <img src="img.jpg">;
    }
    

    Thanks

    • This reply was modified 1 week, 5 days ago by  Chao.
    • This reply was modified 1 week, 5 days ago by  Chao.
    #6720

    Tom
    Keymaster

    If you want to use an image, you’d do this:

    content: url('URL TO IMAGE');

    #6724

    Chao
    Participant

    Hi Tom

    I successfully do it! Thanks

    http://wordpress-74103-670604.cloudwaysapps.com/news/

    But I have a few questions.

    (1) Is it possible to change the order between author and date? Currently it is author first and date second but I want to let date first and author second.

    (2) I want to let image fullwidth and the content area have margin. Is it possible? Currently, I saw I can’t tweak separately.

    (3) How to let pagination center ? Could you tell me which class?

    Thanks for your time.

    • This reply was modified 1 week, 4 days ago by  Chao.
    #6738

    Tom
    Keymaster

    1. Try this:

    .wp-show-posts-entry-meta {
        display: flex;
    }
    
    .wp-show-posts-posted-on {
        order: -1;
    }

    2. This should do it:

    .wp-show-posts-inner > *:not(.wp-show-posts-image) {
        padding: 10px;
    }

    3. Looks like you got it centered?

Viewing 6 posts - 1 through 6 (of 6 total)

You must be logged in to reply to this topic.