Title: Title/Heading below thumbnail
Last modified: January 22, 2019

---

# Title/Heading below thumbnail

 *  Resolved [vianaerich](https://wordpress.org/support/users/vianaerich/)
 * (@vianaerich)
 * [7 years, 4 months ago](https://wordpress.org/support/topic/title-heading-below-thumbnail/)
 * Hello. I was wondering if there is a way to make the title/heading appear below
   the thumbnail instead of on top of it, so the whole image is visible? Is there
   CSS I can use maybe? Thank you.
 * The page I need help with: _[[log in](https://login.wordpress.org/?redirect_to=https%3A%2F%2Fwordpress.org%2Fsupport%2Ftopic%2Ftitle-heading-below-thumbnail%2F%3Foutput_format%3Dmd&locale=en_US)
   to see the link]_

Viewing 13 replies - 1 through 13 (of 13 total)

 *  Plugin Author [Ajay](https://wordpress.org/support/users/ajay/)
 * (@ajay)
 * [7 years, 4 months ago](https://wordpress.org/support/topic/title-heading-below-thumbnail/#post-11119387)
 * Please change it to No styles in the Styles setting and then try this code
 * [https://gist.github.com/ajaydsouza/462b41930c325e6bc345](https://gist.github.com/ajaydsouza/462b41930c325e6bc345)
 *  Thread Starter [vianaerich](https://wordpress.org/support/users/vianaerich/)
 * (@vianaerich)
 * [7 years, 4 months ago](https://wordpress.org/support/topic/title-heading-below-thumbnail/#post-11126549)
 * Thank you, but now the thumbnail images on the second row are overlapping some
   of the title/header from the top row. It also created 5 items per row, instead
   of 3.
 *  Thread Starter [vianaerich](https://wordpress.org/support/users/vianaerich/)
 * (@vianaerich)
 * [7 years, 4 months ago](https://wordpress.org/support/topic/title-heading-below-thumbnail/#post-11126553)
 * I’m sorry, I meant to say 4 per row.
 *  Plugin Author [Ajay](https://wordpress.org/support/users/ajay/)
 * (@ajay)
 * [7 years, 4 months ago](https://wordpress.org/support/topic/title-heading-below-thumbnail/#post-11127632)
 * I checked your site but see the original settings for the plugin. Are you using
   the new code above in the custom styles box with the No style setting selected?
 *  Thread Starter [vianaerich](https://wordpress.org/support/users/vianaerich/)
 * (@vianaerich)
 * [7 years, 4 months ago](https://wordpress.org/support/topic/title-heading-below-thumbnail/#post-11127902)
 * No, I removed it, as I didn’t know how long it would take to get a response and
   it didn’t look good.
 *  Plugin Author [Ajay](https://wordpress.org/support/users/ajay/)
 * (@ajay)
 * [7 years, 4 months ago](https://wordpress.org/support/topic/title-heading-below-thumbnail/#post-11132505)
 * Understood. I won’t be able to debug this real time. Assume you’re happy to keep
   using the default styles?
 *  Thread Starter [vianaerich](https://wordpress.org/support/users/vianaerich/)
 * (@vianaerich)
 * [7 years, 4 months ago](https://wordpress.org/support/topic/title-heading-below-thumbnail/#post-11134567)
 * Actually, no. Is there a way to make more space between the rows so that the 
   image on the second row doesn’t overlap the title/heading from the first row?
   Thanks again.
 *  Thread Starter [vianaerich](https://wordpress.org/support/users/vianaerich/)
 * (@vianaerich)
 * [7 years, 4 months ago](https://wordpress.org/support/topic/title-heading-below-thumbnail/#post-11155517)
 * Is there a way to make more space between the rows so that the image on the second
   row doesn’t overlap the title/heading from the first row? Thanks again.
 *  Plugin Author [Ajay](https://wordpress.org/support/users/ajay/)
 * (@ajay)
 * [7 years, 4 months ago](https://wordpress.org/support/topic/title-heading-below-thumbnail/#post-11160992)
 * Which coding are you using from the two examples there. One option trying is 
   to add a “margin-bottom: 20px” to the `ul li` entities
 *  Thread Starter [vianaerich](https://wordpress.org/support/users/vianaerich/)
 * (@vianaerich)
 * [7 years, 4 months ago](https://wordpress.org/support/topic/title-heading-below-thumbnail/#post-11161378)
 * I was going to use the code provided in the answer above:
    [https://gist.github.com/ajaydsouza/462b41930c325e6bc345](https://gist.github.com/ajaydsouza/462b41930c325e6bc345)
 * I’m sorry, I’m not an experienced coder. Where specifically should I add this?
   In the crp-grid.css? Or in the crp-titles-below.css? And in both of these, there
   is “ul li” multiple times…specifically where do I add this?
 * Thank you.
 *  Plugin Author [Ajay](https://wordpress.org/support/users/ajay/)
 * (@ajay)
 * [7 years, 4 months ago](https://wordpress.org/support/topic/title-heading-below-thumbnail/#post-11162387)
 * In the plugin settings, select No style and then use the code of crp-titles-below
   in the custom css box in the settings page.
 * If there is less of a margin you can replace this line:
 *     ```
       .crp_related ul li { float:left; width:120px; padding:0px 6px 0px 0px; list-style:none;list-style-position: inside; height:180px;text-align: left;word-wrap:break-word;margin-bottom:20px;  }
       ```
   
 * I added the margin at the end.
 *  Thread Starter [vianaerich](https://wordpress.org/support/users/vianaerich/)
 * (@vianaerich)
 * [7 years, 4 months ago](https://wordpress.org/support/topic/title-heading-below-thumbnail/#post-11164429)
 * 1. The titles are rather long, so they’re still going to overlap (maybe I can
   shorten the titles somehow?).
 * 2. There are also now 6 “Related Posts” in the first row and 2 in the second.
   Under “Number of Related Posts to Display,” I have it set for a total of 8, but
   would like 4 in each row.
 * 3. Again, however, if I put 4 in each row (or choose just 4 posts to display,
   thereby deleting the second row), it overlaps with the “What do you think?” underneath.
    -  This reply was modified 7 years, 4 months ago by [vianaerich](https://wordpress.org/support/users/vianaerich/).
    -  This reply was modified 7 years, 4 months ago by [vianaerich](https://wordpress.org/support/users/vianaerich/).
 *  Plugin Author [Ajay](https://wordpress.org/support/users/ajay/)
 * (@ajay)
 * [7 years, 4 months ago](https://wordpress.org/support/topic/title-heading-below-thumbnail/#post-11165392)
 * 1. You can reduce the title length by reducing the number of characters in the
   settings page – Under output options
 * For 2. and 3. Can you include this piece of code in the same box to push down
   every 5th element to the next line
 *     ```
       .crp_related ul li:nth-child(4n+1) {
           clear: left;
       }
       ```
   

Viewing 13 replies - 1 through 13 (of 13 total)

The topic ‘Title/Heading below thumbnail’ is closed to new replies.

 * ![](https://ps.w.org/contextual-related-posts/assets/icon-256x256.png?rev=2985705)
 * [Contextual Related Posts](https://wordpress.org/plugins/contextual-related-posts/)
 * [Frequently Asked Questions](https://wordpress.org/plugins/contextual-related-posts/#faq)
 * [Support Threads](https://wordpress.org/support/plugin/contextual-related-posts/)
 * [Active Topics](https://wordpress.org/support/plugin/contextual-related-posts/active/)
 * [Unresolved Topics](https://wordpress.org/support/plugin/contextual-related-posts/unresolved/)
 * [Reviews](https://wordpress.org/support/plugin/contextual-related-posts/reviews/)

 * 13 replies
 * 2 participants
 * Last reply from: [Ajay](https://wordpress.org/support/users/ajay/)
 * Last activity: [7 years, 4 months ago](https://wordpress.org/support/topic/title-heading-below-thumbnail/#post-11165392)
 * Status: resolved