[Resolved] WP Show Post List Layout

Home Forums Support [Resolved] WP Show Post List Layout

Home Forums Support WP Show Post List Layout

Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • #2005889
    riz

    Hi Team,

    I have another issue with WP Show Post Layout. I need to make a list layout, but only need to show one post. I copied the css code from Dispatch as this

    @media (min-width: 420px) {
        .wpsp-align .wp-show-posts-inner {
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
        }
    
        .wpsp-align .wp-show-posts-inner>div   {
            -webkit-box-flex: 1;
            -ms-flex: 1;
            flex: 1;
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-orient: vertical;
            -webkit-box-direction: normal;
            -ms-flex-direction: column;
            flex-direction: column;
            -webkit-box-pack: center;
            -ms-flex-pack: center;
            justify-content: center;
        }
    }
    
    @media (max-width: 768px) and (min-width: 420px) {
        .wpsp-align .wp-show-posts-inner .wp-show-posts-image {
            margin-right: 1.5em;
        }
    }

    Then add this code to the HTML Blocks:

    <div class="wpsp-align">I put my WPSP shoretcode here</div>

    But it’s not working as on Dispatch.
    Please check the link below. The goal is to make the layout like the second section (Image in the first column, then Title, Excerpt and Read more button in the right column).

    Thank you.

    #2005905
    Elvin
    Staff
    Customer Support

    Hi there,

    I can see that the CSS you’ve provided is actually having some effect on the WPSP list but I’m not exactly sure what’s the layout you were trying to achieve.

    Can you provide a mockup image of how you want things to be laid out?

    A wise man once said:
    "Have you cleared your cache?"

    #2005915
    riz

    Hi Elvin,

    Please see below.

    Thank you.

    #2005931
    Elvin
    Staff
    Customer Support

    I see.

    It’s a bit tricky to do but can you try adding this PHP snippet?

    add_action('wpsp_before_header',function(){
        echo '<div class="wpsp-content-wrapper">';
    },1);
    
    add_action('wpsp_after_content',function(){
        echo '</div>';
    },1);

    It’s to add wrapper to the contents so we can do the desired layout. Let us know when it’s applied so we can recheck the site and provide the necessary CSS writeup.

    A wise man once said:
    "Have you cleared your cache?"

    #2007013
    riz

    Hi Elvin,

    Yes, it is done. Let me know the next steps.
    Thank you.

    #2007182
    Elvin
    Staff
    Customer Support

    I mistyped the priority for this one:

    add_action('wpsp_before_header',function(){
        echo '<div class="wpsp-content-wrapper">';
    },1);

    Can you change 1 to 11?

    It should be like this:

    add_action('wpsp_before_header',function(){
        echo '<div class="wpsp-content-wrapper">';
    },11);

    Also,

    Change the priority of this:

    add_action('wpsp_after_content',function(){
        echo '</div>';
    },1);

    to this:

    add_action('wpsp_after_content',function(){
        echo '</div>';
    },6);

    Yes, it is done. Let me know the next steps.

    You then add this CSS:

    section#wpsp-239 .wp-show-posts-inner {
        display: flex;
        flex-direction: row;
        align-items: center;
    }
    
    section#wpsp-239 .wpsp-content-wrapper {
        display: flex;
        flex-direction: column;
    }

    A wise man once said:
    "Have you cleared your cache?"

    #2007263
    riz

    Perfect!

    Thank you very much Elvin. Great support as all always.

    Thumbs up to all GP team!

    #2007272
    Elvin
    Staff
    Customer Support

    No problem. Glad you got it sorted. 😀

    A wise man once said:
    "Have you cleared your cache?"

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