We're merging with GenerateBlocks! Learn more here.

[Resolved] Centralise the "Read More" Button

Please login to receive premium support.

Support for the free plugin can be found here.

Home Forums Pro Support Centralise the "Read More" Button

  • This topic has 12 replies, 3 voices, and was last updated 4 years ago by Tom.
Viewing 13 posts - 1 through 13 (of 13 total)
  • Author
    Posts
  • #6068
    Andy
    Participant

    Hi

    I bought WP SHowposts Pro today and it is exactly what I need for my website

    Please could I suggest a future upgrade whereby there is an option to “centralize” the “Read More…” button either on a page or in a column?

    Look forward to hearing from you

    #6071
    Tom
    Keymaster

    Good idea! Should be very easy to achieve right now with some CSS:

    .wpsp-read-more {
        text-align: center;
        display: block;
    }
    #6072
    Andy
    Participant

    That works perfectly – thankyou

    #6087
    Tom
    Keymaster

    You’re welcome 🙂

    #7075
    Hui Boon
    Participant

    I was searching for this too. btw after centralizing the readmore button, is there a way to make the width of the button the same width as the image?
    Similar to how this website https://packhacker.com/

    appreciate it if there is also a way to control the height of each row like how packhacker is doing it.

    thanks for the great app!

    #7076
    Tom
    Keymaster

    Hi there,

    Try adding this as well:

    .wpsp-read-more a {
        width: 100%;
        display: block;
        box-sizing: border-box;
    }
    #7077
    Hui Boon
    Participant

    thanks tom. i had tried previously on the width: 100% as well but did not work.

    tried the above CSS code too..but the background colour did not extend to the edges.

    View post on imgur.com

    #7105
    Tom
    Keymaster

    Any chance you can link me to that page?

    #7118
    Hui Boon
    Participant

    https://26copy.com/

    this is the site

    #7119
    Hui Boon
    Participant

    finally managed to get it to stretch to the edges with the following css syntax.

    .wp-show-posts-read-more{
    width: 100%;
    max-width: 800px;
    box-sizing: border-box;
    }

    .wpsp-read-more {
    text-align: center;
    display: block;
    }

    however the “Read More: button does not always align to the bottom of the cells.

    do take a look at the site and you will notice one of the boxes have an alignment issue…

    #7124
    Tom
    Keymaster

    Try adding this:

    .wp-show-posts-inner {
        display: flex;
        flex-direction: column;
    }
    
    .wpsp-read-more {
        margin-top: auto;
    }
    #7125
    Hui Boon
    Participant

    it worked! thanks!

    You run the most responsive support forum i have ever seen!

    #7131
    Tom
    Keymaster

    Glad I could help 🙂

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