Blog Post – Show Smaller Author photo

[tsimarketing]

I have some of our blogs posts showing on our homepage. My supervisor wants a photo of the author to appear next to the blog post. When I upload a photo to the “thumbnail Options” it appears really big on the homepage. I have attached a screenshot showing you what it looks like. Is there a way to make the photo smaller so it is sitting right next to the post?

Attachments:

You must be logged in to view attached files.

[Kyle – SUPPORT]

Hi

Try this:

.recent-post figure {
  width: 80px;
}

– Kyle

[tsimarketing]

Thanks. That worked for making it smaller. Is it possible to have it sit to the left of the blog title and post instead of on top of it?

Attachments:

You must be logged in to view attached files.

[Kyle – SUPPORT]

Yes but it’s not ideal, try this:

.recent-post figure {
  width: 80px;
  float:left;
}
.recent-post .details-wrap {
  width: 82%;
}

– Kyle

[tsimarketing]

Is this what you meant by not ideal, haha (see attached photo). Is there a way to add a little padding between the photo and text.

Attachments:

You must be logged in to view attached files.

[Kyle – SUPPORT]

Reduce the 82% in the css

– Kyle

[tsimarketing]

I tried lowering the 82% to 50% to see what would happen and this happened (see attached photo). Its making all the text go below the photo again. I liked the layout of the text from the screenshot I sent in the previous message but I just wanted to bump it over to the right a little. Is that possible?

Attachments:

You must be logged in to view attached files.

[Kyle – SUPPORT]

Sorry, missed the float right!

.recent-post figure {
  width: 80px;
  float:left;
}
.recent-post .details-wrap {
  width: 82%;
  float:right;
}

– Kyle

[tsimarketing]

That worked. Its still a little wonky, but it will do for now. If I have anymore questions I’ll post it. Thanks!

[Kyle – SUPPORT]

Ok no problem

– Kyle