[Support request] Text over image sidabar

Home Forums Support [Support request] Text over image sidabar

Home Forums Support Text over image sidabar

Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • #2204739
    Roger

    Hi!

    How do I make the post carousel with text over image as in the top of the sidebar of the Dispatch site? Can´t seem to find the right info (even though Im pretty sure it’s there).

    //Roger

    #2204954
    David
    Staff
    Customer Support

    Hi there,

    the Dispatch site doesn’t include a Carousel – this is a default install view:

    2022-04-30_16-20-10

    Is the Area titled “C” your wanting to replicate ?

    #2204977
    Roger

    Yes, C, exactly. Sorry about my sometimes lousy english, didnt mean a carousel. Would like to replicate C 🙂

    #2205041
    Ying
    Staff
    Customer Support

    Hi Roger,

    1. Go to appearance > wp show posts, create a new list. (make sure you you have WP show posts plugin installed)

    2. Checkimagebox, Image location: above title.
    Content type: None.
    check the Includetitle box.
    Check Include termsbox, terms location: below title.

    3. Add the list shortcode (eg. [wp_show_posts id="1207"])to your sidebar using a shortcode block

    4. Add this CSS:

     .wpsp-card .wpsp-content-wrap {
        position: absolute;
        bottom: 0;
        left: 0;
        right: 0;
        padding: 5% 8%;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        background-color: rgba(0, 0, 0, 0.35);
        background: -webkit-gradient(linear, left bottom, left top, color-stop(30%, rgba(80, 50, 50, 0.5)), to(rgba(0, 0, 0, 0)));
        background: linear-gradient(0deg, rgba(80, 50, 50, 0.5) 30%, rgba(0, 0, 0, 0) 100%);
        pointer-events: none;
    }
       :not(.widget).wpsp-card .wp-show-posts article, .wpsp-card .wp-show-posts-image {
        margin-bottom: 0 !important;
    }
    .widget .wp-show-posts article {
        margin-bottom: 0.5em !important;
    }

    Let me know if this helps 🙂

    #2205392
    Roger

    Didnt work I’m afraid. The CSS didn’t change the look of the posts…

    #2205438
    David
    Staff
    Customer Support

    Did you originally install the Dispatch Site ? Or are you just trying to copy that style ?

    #2205442
    Roger

    Yes, I have the dispatch site. Didn’t import demo content though…

    #2205449
    David
    Staff
    Customer Support

    Aah ok.
    So you will need to add this PHP Snippet to your site first:

    add_action( 'wpsp_before_header' , function() {
        ?>
        <div class="wpsp-content-wrap">
        <!-- Openeing wrapper -->
        <?php
    }, 15 );
    
    add_action( 'wpsp_after_content' , function() {
        ?>
        <!-- Close WPSP Wrapper -->
        </div>
        <?php
    }, 15);

    This will add the adding a <div> wrapper to the WPSP content.

    How to add PHP:
    https://docs.generatepress.com/article/adding-php/

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