How can I make the post title appear above the featured images on the blog page? - Support

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

Author

Posts
April 1, 2014 at 12:23 am #245795

bakbek
Participant

Hi, I would like the post titles to be above the featured images on the blog page instead of the featured image or gallery or video or whatever type of post I choose appearing above the post title.

I find that it is confusing while scrolling the blog page as one post featured image might seem to be part of the post above it as there is no clear separation between the posts.

Thanks.

April 1, 2014 at 7:16 am #245859

Ismael
Moderator

Hi bakbek!

Thank you for the question. You might want to check Josue’s solution here: https://kriesi.at/support/topic/move-featured-image-below-post-title-date-etc/

If that doesn’t work, do this instead. Edit includes > loop-index.php, remove everything then replace it with this code:

http://pastebin.com/PrknfpSw

I hope that helps.

Cheers!
Ismael

April 1, 2014 at 9:07 am #245879

bakbek
Participant

The first solution didn’t work.

The second one did move the title above the featured image but it isn’t aligned and the small icon on the left stays where the title was before so it really doesn’t look good.

https://www.evernote.com/shard/s55/sh/48f61563-01b8-4c36-bfba-3812ceb0ed36/7c7e1117a2d61b60cda0b6723044836e/deep/0/Blog—Photobek.png

Maybe there is a way to add a divider between posts in the blog page? As it is now it is simply too confusing as a featured image of one post seems like it is part of a previous post – https://www.evernote.com/shard/s55/sh/8a396435-b1a7-4598-a5fe-4fefb9319e13/5ca80b19df9fc023d7d489a30590c586/deep/0/Blog—Photobek.png

Thanks for the help.

April 2, 2014 at 9:05 am #246406
Dude
Participant
Hi!

Yes, use this css code to add a border to the post divider element:
```
.template-blog .post_delimiter {
border-bottom: 1px #e2e2e2 solid;
}
```
You can change the border style based on your requirements.

Best regards,
Peter
April 2, 2014 at 9:42 am #246432

bakbek
Participant

Added the code but again, I can’t see any changes. Cleared cache and also checked in incognito but it looks the same…

April 3, 2014 at 6:08 pm #247155
Yigit
Keymaster
Hi!

Please try adding following code to Quick CSS
```
.avia-post-format-image {
border-bottom: 1px dashed #e2e2e2;
padding-bottom: 30px;
}
```
Best regards,
Yigit
April 4, 2014 at 10:08 am #247356

bakbek
Participant

This did work but the divider is placed at the wrong place. It appears under the featured image and above the title and it should be located under the read more link at the bottom of each post excerpt.

https://www.evernote.com/shard/s55/sh/25493d75-31a7-4ca7-ae59-f0bac0270155/89f2bc91f3653cd74c727760db8a4ca3/deep/0/Blog—Photobek.png

It also only shows under featured image in the image type of posts but it should show under all posts type.

April 4, 2014 at 8:26 pm #247628
Yigit
Keymaster
Hi!

Please add following code to Quick CSS instead
```
.blog .entry-content {
border-bottom: 1px dashed #e2e2e2;
margin-bottom: 15px;
}
```
Cheers!
Yigit
April 5, 2014 at 3:00 pm #247786

bakbek
Participant

Added the code but as always I can’t see any changes… does it work on your end?

April 5, 2014 at 4:12 pm #247790

Yigit
Keymaster

Hi!

Yes it does work fine on my end. Please see screenshot here – http://i.imgur.com/K6tdr6j.png

Cheers!
Yigit

August 6, 2014 at 10:26 pm #300851

netchoice
Participant

I made the changes via index-loop.php..however, the alignment of the post title is off when the blog is set to “multiple-author”

See http://imagizer.imageshack.us/v2/150x100q90/536/zDjutx.png

I would also like to “enlarge” the image on the blog page when using a sidebar (much like its enlarged when not using a sidebar)

Thanks

August 7, 2014 at 3:57 am #300935
Ismael
Moderator
Hi!

@netchoice: Please use this on Quick CSS or custom.css to re-align the blog header:
```
header.entry-content-header {
padding-left: 130px;
}
```
Regarding the second question, the preview image is already large and there are no spaces left to increase the size of the image. Please give us a link to the actual blog page and a screenshot of what you’re trying to do.

Regards,
Ismael
September 8, 2014 at 6:24 pm #315269

frankwelschlehmann
Participant

How can I make changes to includes > loop-index.php in an upgrade safe way?
Can this file be copied to the child theme?

Thanks,
Frank

September 9, 2014 at 4:55 am #315578

Ismael
Moderator

Hey!

Yes, copy the the includes folder with the loop-index.php on your child theme folder.

Regards,
Ismael

June 14, 2015 at 3:02 pm #458920

kalebw
Participant

Hi

Is pasting the ‘loop-index.php’ code still valid with the latest theme.

If not, please provide a solution for moving the Blog/Post Title above the Featured Image across the site.

Thanks

June 16, 2015 at 3:43 pm #460092

Andy
Inactive Moderator

Hi!

it should still be valid and if it does not work for you please open a new ticket, as this thread is growing too big already and it gets confusing for us moderators and other readers.

Best regards,
Andy
Author

Posts

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

The topic ‘How can I make the post title appear above the featured images on the blog page?’ is closed to new replies.