Recently I faced a problem while doing a wordpress theme modification for a website. The requirement was to give custom footer color for every post or page using the wordpress custom field. I have to create an additional custom field in the admin post page to give the user option to input their favorite footer color they want for that specific page or post.

First I added a new he custom field called “Footer Color” in my blog post or page, then I added a color value to that custom “Footer Color” field. This is the color of the footer which I want for my page.

wordpress-add-custom-field-value

Then I open the “footer.php” in my current wordpress theme and added the following php code to display my custom footer in the footer div. The purpose of the code is to fetch the custom field value for the current post or page and then assign the custom footer color to the footer div background using the inline css style. There is a “if else“ logic which assign the custom footer color for the post type and page type.

wordpress-custom-field-value

I have commented which variable store color value for the post type and which variable store the color value for the page type. You can use this code as you like, means if you want to add custom header color for individual post or page you can use this code, the difference will be you will have to put the styling code into your header div. You can also add custom images for specific page using this code, the prospect is endless. You just have to use your brain to do what you want.

<?php
function all_my_customs_footer($id = 0){
if ($id == 0) :
global $wp_query;
$content_array = $wp_query->get_queried_object();
$id = $content_array->ID;
endif;
$first_array = get_post_custom_keys($id);
foreach ($first_array as $key => $value) :
$second_array[$value] = get_post_meta($id, $value, FALSE);
foreach($second_array as $second_key => $second_value) :
$result[$second_key] = $second_value[0];
endforeach;
endforeach;
$result = $result[$second_key];
return $second_array;
}
$result = all_my_customs_footer();
$result_color = $result['Footer Color'][0]; /*<== “$result_color” store the
custom color code for the
type page */
?>
</*your div or td Start*/  <?php if (is_single()) {
/*”$vFooterColor” store the custom color code for the type post ==>*/
$vFooterColor = get_post_meta($post->ID, ‘Footer Color’, true);
if (!empty($vFooterColor)) { ?>
style=”background-color:<?php echo $vFooterColor; ?>;”
<?php }
}
else { ?>
style=”background-color:<?php echo $result_color; ?>;”
<?php }
?>
id=”footer”>
/*Your Content Goes Here*/
</*your div or td End*/>

Latest posts by Soumyajit Dutta

  • Share/Bookmark