[Resolved] Can I do this with Element Blocks?

Home Forums Support Can I do this with Element Blocks?

  • This topic has 6 replies, 2 voices, and was last updated 1 month ago by Elvin.
Viewing 7 posts - 1 through 7 (of 7 total)
  • Author
  • #1421080

    I have this great new blog layout that was designed for me. Before I hand it off to a better dev than me (which is really pretty much any dev), can I do this with Element Blocks?

    New Blog Layout

    Link to image if it doesn’t load: https://www.dropbox.com/s/jz96baw0joet2pz/skyworkblog.png?dl=0

    I’ve been getting pretty good at GenerateBlocks (here’s the staging site, not ready for primetime, but it’s not bad https://staging-skyworkult.temp513.kinsta.cloud/sky-work-features/) for nice cards and such, so if I could build a blog page with blocks instead of editing the archive template … I’d be into that.

    Much appreciated.


    I figured it out! Inspired by another post, I used WP Show Posts and tweaking a lot of CSS. https://staging-skyworkult.temp513.kinsta.cloud/blog/ . Not perfect yet, but I’m happy with the progress.

    Customer Support

    Hi Tris,

    Nice work. So great to see you using WP Show Posts and finding ways with it.

    To add to to your current setup, you may want to consider adding these css styles.

    .wpsp-read-more {
    margin-top: auto;
    align-self: center;
    .wp-show-posts-columns .wp-show-posts-inner {
    flex-direction: column;
    display: flex;
    .wpsp-read-more a {
    margin-left: 0;

    Here’s how it’ll look like when you add these css styles.

    You might also consider assigning a fixed height on the image and reducing the number of words displayed on excerpt so the card layout looks visually even.

    Let us know if this helps. 🙂


    Thank you Elvin! I appreciate your help. Tris

    Customer Support

    No problem. We’re always glad to help. You’re welcome.:)


    All the changes work fine … except the buttons. I don’t know what magic you did Elvin when you inspected the CSS … but even following along, align-self doesn’t center. What am I missing?

    Customer Support

    I’ve reinspected your site and saw that display: flex; didn’t apply to the button’s parent element.

    display:flex has to be applied to parent elements for align-self:center; margin-top:auto; to work.

    You may have to force the class selector to use !important if its not applying.

    .wp-show-posts-inner {
    flex-direction: column;
    display: flex !important;

    You can try this css code. Let us know if this works for you.

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