groups

name language licence
Untitled Snippet Other Other
maeghandonovan HTML Other
someecards Other Other
featured sliding content PHP BSD
How to change the default Wordpress excerpt PHP BSD
player PHP BSD
Excluding the Category PHP BSD
Custom post title with lead graphic background PHP BSD

< 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 >



language: PHP
licence: BSD

Custom post title with lead graphic background

options: view full snippet • send to code collector 
//First, create the image / photo that you want to use. For the example above, I create a photo of Boo, our Mini Rat Terrier, titled boo-lead-title.gif. Upload the image to your server and save the URI. If you would like the image and post title to span the entire width of your main content column, you’ll want to create a lead image with a width to match that of your main column. In the standard K2 theme included with WordPress, that width is 450px.

//Second, compose a new post. Before saving, scroll towards the bottom of the editor pane and add a new Custom Field in the ‘Key’ field. In the example, I created a Custom Field titled lead_image. Paste the previously saved URI in the ‘Value’ field. Save the post - do not publish yet.

//Third, open the index.php file in your themes directory and find the line beginning with <?php if (have_posts()) : ?>. If you are using the default theme, the area of the file we will be editing can be found below:


<?php if (have_posts()) : ?>
<?php while (have_posts()) : the_post(); ?>
<div class="post" id="post-<?php the_ID(); ?>">
<div class="lead-image-wrapper">
<h2><a href="<?php the_permalink() ?>" rel="bookmark" title="Permanent Link to <?php the_title_attribute(); ?>"><?php the_title(); ?></a></h2>
<?php $image = get_post_meta($post->ID, "lead_image", true); ?>
</div>
<div class="entry">
(Continues...)