Black Friday sale! Get 25% off WPSP Pro! Discount automatically applied at checkout.

[Resolved] Design Question

Please login to receive premium support.

Support for the free plugin can be found here.

Home Forums Pro Support Design Question

Viewing 15 posts - 1 through 15 (of 15 total)
  • Author
    Posts
  • #18315
    Kevin
    Participant

    Hi 😉

    I try to create this header from https://techgarage.blog with WPSP Pro and GP and GB 😀
    Actually, it looks not sooo easy, now my qustion. Do you think it would work with your Plugin and not 1000 lines of Code?

    I started here https://dev.techgarage.blog/ with a New Block Element and a Grid Container and have 3 seperate Shortcodes.

    Best Kevin

    • This topic was modified 3 months, 2 weeks ago by Kevin.
    #18326
    Tom
    Keymaster

    Hi there,

    It looks like you’re most of the way there. You just need to adjust some of the styles in the lists and may need some additional CSS in there to get it all of the way.

    I definitely think you can do it without 1000 lines of code 🙂

    #18345
    Kevin
    Participant

    Hi Tom

    Thank you for your answer.

    Is there any chance you could help me? I’d would love leave something in your donation box, of course.

    But a pro like you, who knows plugins and themes, is 100 times faster and better than a developer which doesn’t know the material.

    Best Kevin

    #18372
    Tom
    Keymaster

    Unfortunately I don’t have a ton of time for custom development at the moment.

    You could start with something like this:

    #wpsp-134353 .wp-show-posts-inner {
        position: relative;
    }
    
    #wpsp-134353 .wp-show-posts-entry-header {
        position: absolute;
        bottom: 0;
        padding: 30px;
        background: rgba(255,255,255,0.7);
        margin: 10px;
    }
    
    #wpsp-134353 .wp-show-posts-image {
        margin-bottom: 0;
    }

    You’ll want to reduce the font size within the settings as well.

    Then for the other posts, have you tried the base card along with some padding? That should get you quite close to the other look.

    #18402
    Kevin
    Participant

    Wow thank you for helping me. I understand your actually situation, so BIG Thank you.

    Just one small thing 😉 I try to dont use jQuery. Actually i get this error

    jquery.matchHeight.js:17 Uncaught ReferenceError: jQuery is not defined
        at jquery.matchHeight.js:17
        at jquery.matchHeight.js:19

    I know the problem is the main content with all the other posts. Any way to don`t need jQuery there?

    Best Kevin

    #18421
    Tom
    Keymaster

    Give this a shot:

    add_action( 'wp_print_scripts', function() {
        wp_dequeue_script( 'wpsp-matchHeight' );
    }, 999 );
    #18544
    Kevin
    Participant

    Thank you Tom

    #18564
    Tom
    Keymaster

    No problem 🙂

    #18732
    Kevin
    Participant

    Hi Tom

    Sorry for open the Topic again 😉 The Page is now finish, but actually i fight with the performance. The Image size is to big. When i create a custom image size (like gtmetrix shows me) it get blured images and no “retina” or sharp images. Any idea how to fix this situation?

    Best Kevin

    #18752
    Tom
    Keymaster

    If you need the image to be retina, it needs to be larger than what it displays at.

    For example, if an image displays at 200×200, it must actually be 400×400 in order to be “retina”.

    If you’re stuck loading large images, at least make sure they’re optimized using an image optimizer – they can usually reduce the size significantly.

    #18760
    Kevin
    Participant

    Hey Tom

    i try to ask different 😉

    Whats the best setting to get sharp but still small images in the right size with WPSP?
    I`not sure if my Screenshot was inside before but actually it loads 1536×864 image for the first WPSP Block which is 308×173. If i make a custom image size and let WPSP know that he should use 308×173 for the image, i get a bluered image.

    Best Kevin

    #18768
    Tom
    Keymaster

    The best thing to do is to upload the image at the desired width. It likely doesn’t need to be 1536×864 unless it’s being used as a full-width page hero background.

    You can also use this method to resize the images: https://wpshowposts.com/support/topic/show-posts-images-not-working/#post-8324

    Then use CSS to resize them further so they aren’t displaying at the size you set.

    #18772
    Kevin
    Participant

    Hi Tom. thank you, will try it. The Image is always uploaded as 1920×1080 and will be use for a Post Header. But the solution with the function.php looks great.
    One thing i see now is: I use different sizes of WPSP inside one page look here https://dev.techgarage.blog How i manage this in the functions?

    Best Kevin

    • This reply was modified 3 months ago by Kevin.
    #18778
    Tom
    Keymaster

    Right now it’s difficult. We just committed a change to the next version of WPSP that allows you to choose the image size directly in the settings. Hoping to have a beta out this week 🙂

    #18790
    Kevin
    Participant

    Thx Tom. Then i wait for the GGP 1.12 and the WPSP Update to transfer my News Site to GP.

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