Shop Menu

How to Add Featured Image Code to Inside Pages – WordPress Bunch theme

WordPress theme: Bunch

Desired result: Have a Featured Image at the top of every inside Page. This will show how to add the Featured Image code to inside Pages, without ruining the other inside Pages that don’t have a Featured Image on them. Alter the following files: style.css, page.php and functions.php.

1. CSS FILE

File: style.css
Line: 618 (approx)

/* featuredImg – Featured Image on each Page */

#featuredImgWrapper {
width: 960px;
margin: 0 auto;
padding: 0;
margin-top: -50px; /* This moves the img up to the top HR line */
padding-bottom: 50px; /* This pushes the bottom of the wrapper back down for the pages that don’t have a Featured Img, but still need the 50px gap between the top HR line and the content box */
}

2. PAGE FILE

File: page.php
Note: add the following Featured Image section between get_header and posts sections.

<?php get_header(); ?>

<!– FEATURED IMG AT TOP OF INSIDE PAGES –>
<div id=”featuredImgWrapper”>
<?php
// Check if this is a post or page, if it has a thumbnail, and if it’s a big one
if ( is_singular() && current_theme_supports( ‘post-thumbnails’ ) &&
has_post_thumbnail( $post->ID ) &&
( /* $src, $width, $height */ $image = wp_get_attachment_image_src( get_post_thumbnail_id( $post->ID ), ‘post-thumbnail’ ) ) &&
$image[1] >= HEADER_IMAGE_WIDTH ) :
// Houston, we have a new header image!
echo get_the_post_thumbnail( $post->ID );
elseif ( get_header_image() ) : ?>
<img src=”<?php header_image(); ?>” width=”<?php echo HEADER_IMAGE_WIDTH; ?>” height=”<?php echo HEADER_IMAGE_HEIGHT; ?>” alt=”" />
<?php endif; ?>
</div><!– #featuredImgWrapper –>
<!– #FEATURED IMG AT TOP OF INSIDE PAGES –>

<?php if (have_posts()) : while (have_posts()) : the_post(); ?>

3. FUNCTIONS FILE

File: functions.php
Note: Change numbers to 960 and 180.
Line: 120 (approx):

// Post thumbnail support
if (function_exists(‘add_theme_support’)) {
add_theme_support(‘post-thumbnails’);
set_post_thumbnail_size(960, 180, true); // Normal post thumbnails
add_image_size(‘loopThumb’, 960, 180, true);
}

function thumb_url(){
$post = ”;
$src = wp_get_attachment_image_src( get_post_thumbnail_id($post->ID), array( 2100,2100 ));
return $src[0];
}

, ,

2 Responses to How to Add Featured Image Code to Inside Pages – WordPress Bunch theme

  1. Ry Love November 10, 2011 at 5:24 pm #

    Thank you thank you thank you thank you thank you!!!  This rocked!!

  2. KwangKung Kung May 29, 2012 at 10:31 pm #

    Thanks ^^

Leave a Reply

css.php