[Resolved] Feature image + Footer Widget Help

[William]

Hi all,

1. Is there are a way to set a fixed size for feature image in each post? ex: 700px by 400px for every post.

2. How can I create a footer widget similar to this site, with 3 columns and center as well as the lines?

3. How to add a background color to h1 and h2 in WordPress page that stretches across containers like the website shown above. Like their “Latest posts” “Most popular” “Review” sections on their home page.

Site password: Generatepress

Thanks!

[David]

Hi there,

1. You can set featured image sizes in the Customizer:

https://docs.generatepress.com/article/adjusting-the-featured-images/

Note: If you want consistency, the best thing to do is upload images of the same size.

2. You can set the theme to display three widgets:
https://docs.generatepress.com/article/footer-widgets/

Then add your widgets via Appearance > Widgets.

To add a double border below title add this CSS:

.footer-widgets .widget-title {
    position: relative;
    text-align: center;
    border-bottom: 1px solid #ccc;
}

.footer-widgets .widget-title:after {
    content: '';
    position: absolute;
    left: 0;
    bottom: -5px;
    width: 100%;
    height: auto;
    border-bottom: 1px solid #ccc;
}

To center align widgets you can use the footer-widget-# classes eg. this will center align widgets 1 and 2.

.footer-widget-1,
.footer-widget-2 {
    text-align: center;
}

[William]

Hi David!

1. For the feature image size, I managed to change the size for desktop. How can I keep the tablet and mobile version default? When changing the size on desktop version, both the mobile and tablet version makes it look longer. I rather have the default if possible.

2. I included a CSS that adds a background color to the widget title. How can I exclude only the footer widget title?

Thanks!

[Tom]

Hi there,

1. Is this on the page you linked to? Looks like that one is using WP Show Posts.

2. Right now you have this selector:

.widget-title

Try this:

.sidebar .widget-title

[William]

Hi Tom,

1. It’s under Layout>blog>feature image>posts. I wanted to create a fixed feature image in each of my post. Once I input the px I want for desktop, the size for mobile and tablet also changes. Is there a way to keep mobile/tablet version default while just changing the size on desktop?

Thank You!

[David]

There isn’t a separate mobile sizing option.
As your mobile images will be displayed larger then your desktop images.
I would leave the width and height fields empty and choose a Media Attachment Size that is appropriate for mobile. Those images should scale down for desktop.

[Author]

Posts