Add an Image to the Single Download Page Template

This tutorial goes over how to use the featured image in our single downloads page template. This will allow you to upload an image when you are creating a new digital download and display it on the front-end of your site. When selling WordPress themes it is important for users to be able to see what they are purchasing of course…

Notes from the Video

1. Make sure your theme supports features images. If they are not currently enabled, you can add the following code to your functions.php file:
   PHP

   /* * Enable support for Post Thumbnails on posts and pages. * * @link http://codex.wordpress.org/Function_Reference/add_theme_support#Post_Thumbnails */ add_theme_support( 'post-thumbnails' );

   1 2 3 4 5 6

   /* * Enable support for Post Thumbnails on posts and pages. * * @link http://codex.wordpress.org/Function_Reference/add_theme_support#Post_Thumbnails */ add_theme_support( 'post-thumbnails' );

2. Add the markup to display the featured image to the content-download.php file. It should now look like the following:
   PHP

   <?php /** * @package bootstrapwp */ ?> <article id="post-<?php the_ID(); ?>" <?php post_class(); ?>> <header class="entry-header"> <?php the_title( '<h1 class="entry-title">', '</h1>' ); ?> </header><!-- .entry-header --> <?php // check if the post has a Post Thumbnail assigned to it. if ( has_post_thumbnail() ) { the_post_thumbnail('full', array('class' => 'img-responsive')); } ?> <div class="entry-content"> <?php the_content(); ?> <?php wp_link_pages( array( 'before' => '<div class="page-links">' . __( 'Pages:', 'bootstrapwp' ), 'after' => '</div>', ) ); ?> </div><!-- .entry-content --> <footer class="entry-footer"> <?php edit_post_link( __( 'Edit', 'bootstrapwp' ), '<span class="edit-link btn btn-danger btn-xs">', '</span>' ); ?> </footer><!-- .entry-footer --> </article><!-- #post-## -->

   1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32

   <?php /** * @package bootstrapwp */ ?>   <article id="post-<?php the_ID(); ?>" <?php post_class(); ?>>   <header class="entry-header"> <?php the_title( '<h1 class="entry-title">', '</h1>' ); ?> </header><!-- .entry-header --> <?php // check if the post has a Post Thumbnail assigned to it. if ( has_post_thumbnail() ) { the_post_thumbnail('full', array('class' => 'img-responsive')); } ?>   <div class="entry-content"> <?php the_content(); ?> <?php wp_link_pages( array( 'before' => '<div class="page-links">' . __( 'Pages:', 'bootstrapwp' ), 'after'  => '</div>', ) ); ?> </div><!-- .entry-content -->   <footer class="entry-footer"> <?php edit_post_link( __( 'Edit', 'bootstrapwp' ), '<span class="edit-link btn btn-danger btn-xs">', '</span>' ); ?> </footer><!-- .entry-footer --> </article><!-- #post-## -->

3. You can now display the featured image on your single download page!