[Support request] Trying to customize a post style

Please login to receive premium support.

Support for the free plugin can be found here.

Home Forums Pro Support Trying to customize a post style

This topic contains 8 replies, has 2 voices, and was last updated by  Carlo 15 hours, 50 minutes ago.

Viewing 9 posts - 1 through 9 (of 9 total)
  • Author
    Posts
  • #8677

    Carlo
    Participant

    Hi Tom,
    currently using the beta version and am trying to make a similar style blog post layout and look to https://d.pr/i/cDBSso

    To be honest im not really getting anywhere close yet, best i could do was set the “cards” as Base but it seems the image ratio is preset and i cant seem to change it – trying to keep the aspect ration 2:1 (1200×600)

    is it possible to get some tips to be able to style:
    -featured image (so the aspect ratio stays true) EDIT- i think i got the image ratio correct now.
    -style the size, font & bold of the excerpt content and title (separately)
    -slight shadow to the outside of the box
    -only have the padding effect the text and not the image

    thanks

    • This topic was modified 1 week, 2 days ago by  Carlo. Reason: update
    #8688

    Tom
    Keymaster

    Hi there,

    Any chance you can link me to what you have right now so I can provide accurate CSS?

    Thanks! 🙂

    #8699

    Carlo
    Participant

    hey Tom,
    just sent through the details on the support contact form with Url and the url im trying to style similar to

    #8706

    Tom
    Keymaster

    How about this?:

    #wpsp-2687 p.wp-show-posts-entry-title {
        font-weight: bold;
        font-size: 22px;
    }
    
    #wpsp-2687 .wp-show-posts-entry-summary {
        font-size: 16px;
    }
    
    #wpsp-2687 .wp-show-posts-inner {
        box-shadow: 0 4px 8px 0 rgba(38,153,251,.2);
        border: 1px solid #dfdfdf;
    }

    Let me know 🙂

    #8711

    Carlo
    Participant

    hi Tom,
    I added that in via Simple CSS but none of it is making any changes and im not sure why?
    any ideas?

    #8712

    Carlo
    Participant

    do i also need to add any functions code via the snippets plugin?

    #8732

    Tom
    Keymaster

    Nope, only CSS. I just tried it in developer tools and it worked.

    Can you try clearing any caching plugins/autoptimize?

    #8817

    Carlo
    Participant

    Hi Tom,
    Sorry for the delay, worked out why the CSS changes were having no effect (although i found they were originally working in mobile view fine),
    it was/is some previous CSS i had that i am using to style a element header, if i take that out the WP show posts CSS takes effect (also if i make the wp show posts CSS before the element header CSS it works).
    here is both codes. as it is below, the wp show posts code doesnt work, but if i put it first it works (is there any obvious conflicting code here which i cant see?

    Also got 2 more questions:
    1: what CSS can i use to make both the post title and post entry line-height smaller (its a little too spread out at the moment).
    2: if i want this CSS to take effect on other wp show posts pages i make, how do i incorporate each wp show post id and combine them into this CSS?
    thanks heaps Tom

    /* Element Header – Author, Date, Category Font Size CSS Change */
    .hero-meta {
    font-size: 15px;
    }

    /* Author,publish,category make spacing and responsive on mobile */
    @media (min-width: 769px) {
    .author-meta, .publishdate-meta, .category-meta{
    display: inline-block;
    }
    .publishdate-meta {
    padding-right: 15px;
    }
    .author-meta {
    padding-right: 15px;
    }
    }
    @media (max-width: 768px) {
    .author-meta,
    .publishdate-meta, .category-meta {
    display: block;
    }

    /*WP Show Posts CSS*/
    #wpsp-2687 p.wp-show-posts-entry-title {
    font-weight: bold;
    font-size: 22px;
    }

    #wpsp-2687 .wp-show-posts-entry-summary {
    font-size: 16px;
    }

    #wpsp-2687 .wp-show-posts-inner {
    box-shadow: 0 4px 8px 0 rgba(38,153,251,.2);
    border: 1px solid #dfdfdf;
    }

    #8863

    Carlo
    Participant

    Hi Tom, just bumping this thread in case you missed my last post 😉

Viewing 9 posts - 1 through 9 (of 9 total)

You must be logged in to reply to this topic.