Front Page Tile Layout - Post Title Location

General questions pertaining to how certain issues can be resolved. This forum is closed with effect from February 2019. Please post future requests on https://github.com/sayontan/suffusion.
Forum rules
This forum is closed with effect from February 2019. Please post future requests on https://github.com/sayontan/suffusion.

1. No offensive language and no mocking
2. Please do a thorough search before you post something. Trust us, there is a high probability that the question you are asking has been asked previously.
3. No soliciting. You cannot post here soliciting bids for people offer you quotes, or even offer money to people for some work. You will be moderated if you do so. If you are looking for help, please post your request on http://jobs.wordpress.net or http://codepoet.com
4. Please be reasonable. You are getting software and support. For free. Complicated requests from a general purpose theme are not welcome and some volunteers might lose patience with you.
5. Please do your due diligence. If you posted a query and we answered with a link, take the trouble to go through the link contents.
6. Please post with complete information. Requests for help MUST be accompanied with your URL, particularly if you are asking something like "Why am I seeing a blank space?"
Locked
ckwimberly
Posts: 41
Joined: 16 Jan 2012, 08:01

Front Page Tile Layout - Post Title Location

Post by ckwimberly » 04 Jul 2015, 09:22

Two questions. I'm using a tile layout for the front/post page. 1) I'd like to know if there is a way to place the post title on the thumbnail image as opposed to below the thumb nail container and 2) Can I make the tile size equal to the thumb nail container? My goal is to have tiles that are all image.

Thanks, Craig
http://www.coalchicago.com

drake
Posts: 6223
Joined: 26 Jul 2011, 07:56
Location: Constanta, Romania
Contact:

Re: Front Page Tile Layout - Post Title Location

Post by drake » 04 Jul 2015, 10:00

Your layout sounds like Mosaic Layout, have you tried it?

ckwimberly
Posts: 41
Joined: 16 Jan 2012, 08:01

Re: Front Page Tile Layout - Post Title Location

Post by ckwimberly » 05 Jul 2015, 03:32

Thanks for the quick response. I had previously looked at the mosaic layout, however, I may not have delved into it sufficiently - I will do so.

Craig

ckwimberly
Posts: 41
Joined: 16 Jan 2012, 08:01

Re: Front Page Tile Layout - Post Title Location

Post by ckwimberly » 05 Jul 2015, 03:55

Drake, the mosaic layout does provide the look I want. Question #1 remains - can I place the post title on the thumbnail image itself as opposed to below the image with css?

Craig

Colin
Posts: 5066
Joined: 27 Oct 2009, 10:46

Re: Front Page Tile Layout - Post Title Location

Post by Colin » 05 Jul 2015, 04:01

Yes you can with

Code: Select all

h2.suf-tile-title {
  margin-top: -50px;
}
Adjust the -50 to suit you will probably need a suitable color definition too to ensure the title is legible.

ckwimberly
Posts: 41
Joined: 16 Jan 2012, 08:01

Re: Front Page Tile Layout - Post Title Location

Post by ckwimberly » 06 Jul 2015, 14:57

Colin, based on your input, I did the following:

Code: Select all

.suf-mosaic-post-title {
 margin-top: -75px; margin-right: 5px; margin-left: 5px;
}
It did move the title to overlay the image in mosaic layout. I added a few test posts to see how additional posts would look and now thumbnails overlap and are of differing sizes (although I specified images as 196x196).

1) Why are thumb nail containers overlapping, 2) Are thumb nail containers of differing sizes the nature of the mosaic layout, and if so, 3) Can I force thumbnail containers to be all the same size?

My test site: http://www.govstrategicsolutions.net/wordpress

Thanks for assisting me with this,
Craig

Colin
Posts: 5066
Joined: 27 Oct 2009, 10:46

Re: Front Page Tile Layout - Post Title Location

Post by Colin » 06 Jul 2015, 23:47

URL 404's with a correct url may be able to help.


Colin
Posts: 5066
Joined: 27 Oct 2009, 10:46

Re: Front Page Tile Layout - Post Title Location

Post by Colin » 10 Jul 2015, 00:35

You have specified the first 2 images to be 96x96. You need to add a margin-bottom of 75px to counteract the -75px top.

ckwimberly
Posts: 41
Joined: 16 Jan 2012, 08:01

Re: Front Page Tile Layout - Post Title Location

Post by ckwimberly » 12 Jul 2015, 07:19

Colin, using margin-bottom did the trick, thanks.

BTW - the issue with the 96x96 images (I believe) was due to using Jetpack's Photon for my images. I believe Photon had 'locked' my excerpt thumbnail for previously used images to 96x96 - once I replaced those two images with new images, they sized to the new larger custom sizes I had specified for thumbnail images.

Again, thanks for the assistance, the mosaic layout will now work for the look I've wanted for a revised look for one of my websites.

Craig

Locked