How to Display Featured Image On Carrington Mobile Theme Homepage

*Wheew*, if you have been following my posts on Carrington starting from the complete guide on customizing Carrington mobile theme to the free customized Carrington mobile theme (with featured image on homepage enabled) I released few weeks ago, you will agree that a lot of requests have been made  via comment on how to display featured image on Carrington mobile theme homepage. Without much ado let’s swing into action.

Difficulty: Easy (all u have to do is copy and paste my codes :D)

Follow these 3 steps to display featured image on Carrington mobile theme homepage

Step 1: We need to add featured image support to Carrington theme, to do this Login to your WordPress Dashboard, Goto Appearance, Click on Editor, On the Editor page Choose Carrington and click on select. (the page reloads). Scroll down a bit,

Now click on theme functions, Copy and paste the following code on the last line before the closing ?> tag in theme functions (also known as functions.php)

add_theme_support('post-thumbnails');
set_post_thumbnail_size(50,50);

Step 2: We need to call the featured image for each post to be displayed on the homepage, to do this Login to your WordPress Dashboard, Goto Appearance, Click on Editor, On the Editor page Choose Carrington and click on select. (the page reloads).

Now click on loop-default.php, within the codes look for cfct_excerpt(); and paste the following code above it and save changes. (This is responsible for displaying the featured image before each post title on the homepage if a featured image has been set.)

if(has_post_thumbnail())
{ the_post_thumbnail();}

Step 3: We need to style the featured image for it to be displayed properly beside the post title on the homepage, to do this Login to your WordPress Dashboard, Goto Appearance, Click on Editor, On the Editor page Choose Carrington and click on select. (the page reloads).

Now scroll down and click on style.css, Copy and paste the following code on the last line of Style.css.

img {
height: auto;
max-width: 99%;
}
.wp-post-image {
float: left;
margin: 0 11px 0 0;
padding: 2px 0 5px !important;
}
ul.table.disclosure li, ul.table li.disclosure {
clear: both;
margin: 0;
padding: 0 0 0 3px !important;
position: relative;
}


Congrats! Your featured image should display now.

NOTE

If you find it difficult to carry out the steps above, you can download my customized Carrington Mobile the with featured image on homepage enabled here to save yourself some stress.

MUST READ:A-Z: Installing and Customizing Carrington Mobile Theme for WordPress

MUST READ: Download Customized Carrington Mobile Theme (with featured image on homepage) For WordPress Mobile Site by Syntocode

MUST READ: Top 4 Plugins To Create A Mobile Version Of Your WordPress Website Or Blog