We're merging with GenerateBlocks! Learn more here.

[Resolved] Title position

Please login to receive premium support.

Support for the free plugin can be found here.

Home Forums Pro Support Title position

Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • #23995
    Tomasz
    Participant

    Hi,

    I’m using modified Overlay Style 1 and I want to move the post title to center or bottom of the image.

    image

    Thank you.

    Regards,
    Tomasz

    #24004
    elvin
    Moderator

    Hi,

    This is pretty tricky to do as the post title is pushed up by the excerpt.

    To clarify: do you want to switch the order between the excerpt and the title?

    Or

    do you want to remove the excerpt so the title can be aligned at the center or bottom of the card?

    Let us know.

    #24014
    Tomasz
    Participant

    Hi Elvin,

    For this card I will never use the excerpt so I want to remove the excerpt so the title can be aligned at the center or bottom of the card (depends on the final need).

    I was trying to use #wpsp-15055 header.wp-show-posts-entry-header + some CSS but I couldn’t align the title for all posts (different size) centrally.

    Regards,
    Tomasz

    #24064
    elvin
    Moderator

    For this card I will never use the excerpt so I want to remove the excerpt so the title can be aligned at the center or bottom of the card (depends on the final need).

    We can position absolute the title so it is forced to the center of the card even when there are social icons and entry meta.

    #wpsp-15055 .wpsp-content-wrap {
        position: relative;
    }
    
    #wpsp-15055 header.wp-show-posts-entry-header {
        position: absolute;
        top: 50%;
        transform: translate(0, -50%);
        padding: 0 40px;
    }

    Change the #wpsp-xxxxx to your WPSP list’s ID.

    #24088
    Tomasz
    Participant

    Hi Elvin,

    Almost perfect.
    With the CSS “top” 50-80%” I can decide about a vertical position.

    The problem with horizontal. The title position with your CSS below:
    padding 0 – 40

    If I put padding 240 to center it looks like below (values between 40-240 don’t center the title)

    padding 0 240

    Thank you.

    Best Regards,
    Tomasz

    #24103
    elvin
    Moderator

    You can change this:

    #wpsp-15055 header.wp-show-posts-entry-header {
        position: absolute;
        top: 50%;
        transform: translate(0, -50%);
        padding: 0 40px;
    }

    to this:

    #wpsp-15055 header.wp-show-posts-entry-header {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        padding: 0 40px;
    }
    #24121
    Tomasz
    Participant

    Thank you:)

    #24128
    elvin
    Moderator

    No problem. 😀

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