Background Images in Blog Post 3 Featured Blogs on Front Page (Dyad)

  • Unknown's avatar
    jchavarria90 · Member ·

    Hi,

    I’m helping a friend build a site to promote his services.

    I’m using Dyad’s Blog Page as a static home page to take advantage of the Featured Posts function and the Sticky Post function.

    I’d like to know how to
    1) eliminate the negative space (plain white background) of the sticky blog posts on the home page. I tried altering the HTML code to place a background image in the blog post’s body, but that only altered the blog post’s page, not the thumbnail of the blog post on the home page.

    2) add a third horizontal sticky post to the front page. When I add a third sticky post to the front page, it comes out on the bottom of the other 2 posts. Is there any way to squeeze three sticky posts side by side on the front page?

    Thanks a lot for your time,

    Joel

    The blog I need help with is: (visible only to logged in users)

  • staff-loquaciousloon · Staff ·

    Hi @jchavarria90!

    For adding the background image, you could probably get it done with some Custom CSS (part of a Premium Plan or Business Plan) by targeting each post individually.

    Here’s an example:

    /* Add background on specific post*/
.blog .post-72 .entry-inner {
    background: url(IMAGE URL HERE);
    background-size: cover;
}

/* Remove gradient and border from blog page content */
.blog .entry-inner-content {
    border-bottom: 0
}
.blog .entry-inner-content:before {
    display: none;
}

    In the first style, we’re using that post’s ID number to target it. This shows where to get Page IDs, you can use the same trick on Posts:
    https://en.support.wordpress.com/pages/#how-to-find-the-page-id

    The number of items displayed depends on the size of the screen being used. On most computers, you’ll see two posts, because a third would be too narrow. If you open the site on a larger screen though, a third post has room to fit :)

  • staff-loquaciousloon · Staff ·

    Thinking about this a little bit more, I’m wondering if a theme like Dara might not be a better fit for your needs.

    It has a post slider, and three spaces for Featured Pages to be displayed :)

    I also just noticed the text you have in your slider about a video and a paid account.

    A WordPress.com Premium Plan or Business Plan would allow you to upload video files to your site, and place them in posts or pages – but playing a video in Dyad’s featured post section won’t be possible, it isn’t built for that.

    There are some themes that have built in video display, in case you’d like to look those over (different themes have different approaches to video, so take a look at the demo sites and info pages!)

    https://wordpress.com/themes/filter/video/

  • Unknown's avatar
    jchavarria90 · Member ·

    Hi Chad1008.

    Thanks so much for the advice and the CSS code tips!

    I spoke with my friend and we’re going to stick with Dyad for now, despite the lack of video support. Thanks for clearing that up as well – I thought that since the “Upgrade to a premium plan and enable Videopress” was an option for me on Dyad, that this was available on this template.

    But I can still embed the video in the body of the blog post, so I’ll do that.

  • staff-loquaciousloon · Staff ·

    I thought that since the “Upgrade to a premium plan and enable Videopress” was an option for me on Dyad, that this was available on this template.

    Ah, I see the confusion :)

    VideoPress allows you to upload videos directly to your site, on any theme – but it doesn’t integrate those videos into the theme directly.

    I’m glad embedding will do the trick!

  • The topic ‘Background Images in Blog Post 3 Featured Blogs on Front Page (Dyad)’ is closed to new replies.