Add Image to excerpts using integrity stack

Support
#1

As the title says, I’m currently using integrity stack. I am attempting to get my post excerpts to display an image used in the post. I cannot seem to find the solution.

#2

Hi There,

Please try adding this custom CSS under X > Theme Options > CSS:

.has-post-thumbnail .entry-featured {
    width: 30%;
    float: left;
}
.has-post-thumbnail .entry-wrap {
    width: 65%;
    float: right;
}
.hentry {
    clear: both;
    padding: 25px 0;
}

Hope it helps :slight_smile:

#3

unfortunately, no change on my posts page

#4

Hello There,

No images is displayed because there are no featured images assign to your posts.

Please edit each of your post items and add a featured image.

Hope this helps.

#5

When I add a featured image, I end up with a huge pic at the top of my post, and the same size image on my posts page. I tried several plugins to change the size of the featured image all with no effect. I do not want the featured image to appear on the actual post, but i do want a smaller version on the posts page that will fit next to the text as seen in original post.

#6

Hi There,

You forgot to close the curly bracket(}) in your custom CSS.

Please find this custom CSS:

.x-navbar .desktop .x-nav > li > a:hover, .x-navbar .desktop .x-nav > .x-active > a, .x-navbar .desktop .x-nav > .current-menu-item > a {
    box-shadow: none;
.has-post-thumbnail .entry-featured {
    width: 30%;
    float: left;
}
.has-post-thumbnail .entry-wrap {
    width: 65%;
    float: right;
}
.hentry {
    clear: both;
    padding: 25px 0;
}

And change to this:

.x-navbar .desktop .x-nav > li > a:hover, .x-navbar .desktop .x-nav > .x-active > a, 
.x-navbar .desktop .x-nav > .current-menu-item > a {
    box-shadow: none;
}
.has-post-thumbnail .entry-featured {
    width: 34%;
    float: left;
}
.has-post-thumbnail .entry-wrap {
    width: 65%;
    float: right;
    padding: 25px;
}
.hentry {
    clear: both;
}

Let us know how it goes!

#7

Thank you very much! I now have what i was looking for on my posts page. Unfortunately, it has now messed up my actual post. Is there a way to leave global css the way it is for the site, but change the css just for my blog page?

#8

Hi there,

It is possible to change the CSS code itself to work only on the blog page:

.blog .x-navbar .desktop .x-nav > li > a:hover, .x-navbar .desktop .x-nav > .x-active > a, 
.blog .x-navbar .desktop .x-nav > .current-menu-item > a {
    box-shadow: none;
}
.blog .has-post-thumbnail .entry-featured {
    width: 34%;
    float: left;
}
.blog .has-post-thumbnail .entry-wrap {
    width: 65%;
    float: right;
    padding: 25px;
}
.blog .hentry {
    clear: both;
}

Thank you.

#9

Exactly what i wanted to accomplish. Thank you for your time and assistance.

#10

Glad we were able to help :slight_smile:

#11

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.