Home | About | Web Stories | View All Posts

3 Nov 2012

How to write wordpress plugin for showing Featured Image Thumb column at admin posts list page

Featured Image meta is very important functionality in wordpress. By help of this we display or call featured content slider or other type of output at the theme.


Basic Understandings:
It is assumed that reader aware of wordpress plugin installation activities. Featured Image meta is very important functionality in wordpress. By help of this we display or call featured content slider or other type of output at the theme. To check and view featured image, we need to open each post. This plugin avoids these posts opening type additional steps.



Feature image is automatically visibled at posts list management page, in respect of each post in thumb size. Default image "No Featured Image" has been displayed, in case of no featured image. Image thumb size can be controlled at plugin option page. Default thumb image size has been formatted as 40x40px. This plugin add a submenu under ‘settings’ menu in wordpress admin.
Example:
The plugin has been tested successfully at Wordpress 3.4.2. Page code has been commented well for smooth understandings. Following files have been used :
index.php – plugin main file
options-form.php – plugin options file
output.php – plugin output file

File – index.php
<?php
/*
Plugin Name: CMSSE Feature Image Thumb at posts list page
Plugin URI: http://cmssolutionsexpert.com/
Description: It displays feature image thumb (default size 40x40 px). Feature thumbnail must be enabled. It can be enabled by placing this(add_theme_support( 'post-thumbnails' );) code at theme functions.php
Author: Aashutosh Kumar Yadav
Version: 1.0
Author URI: http://cmssolutionsexpert.com/author/admin
License: GPL
*/
global $options;
$options = array(//Defaults values in multidimensional(array in array) array
array( 'optionname' => 'image-thumb-size', 'value' => '40,40'),
);
/**
STEP 1 : Plugin activation
*/
register_activation_hook(__FILE__,'cmsse_feature_image_thumb_install'); //It hooks or enables "cmsse_feature_image_thumb_install" function when plugin is activated. function syntax in codex is "register_activation_hook( $file, $function )"
/**
STEP 2 : Plugin deactivation
*/
register_deactivation_hook( __FILE__, 'cmsse_feature_image_thumb_uninstall'); //It unhooks or disables "cmsse_feature_image_thumb_uninstall" function when plugin is dactivated. Function syntax in codex is "register_deactivation_hook( $file, $function )"
function cmsse_feature_image_thumb_install() { //It writes new field in database(check or search 'title' and 'detail' in wp_options table)
global $options;
foreach ($options as $option){
add_option($option['optionname'], $option['value'], '', 'yes');
//It adds option/value pair in wp_options table. Function syntax in codex is "add_option( $option, $value, $deprecated, $autoload )"
}
}
function cmsse_feature_image_thumb_uninstall(){
global $options;
foreach ($options as $option){
delete_option($option['optionname']);
}
}
/**
STEP 3 : Adding plugin Menu in Administration menu management
*/
add_action('admin_menu', 'cmsse_feature_image_thumb_option_page'); //It adds plugin menu in admin menu management column.
function cmsse_feature_image_thumb_option_page()
{
add_options_page('Feature Image Thumb Options', 'Feature Image Thumb Options', 'manage_options', 'cmsse_feature_image_thumb','cmsse_feature_image_thumb_option_page_options');
//Add a new submenu under Settings Menu
}
/**
STEP 4 : Creating plugin option form in Admin
*/
if ( is_admin() ) {
function cmsse_feature_image_thumb_option_page_options()
{
include_once dirname(__FILE__).'/includes/options-form.php';
}
}
/**
STEP 5 : Creating output for user in Admin
*/
include_once dirname(__FILE__).'/includes/output.php';
?>

File – options-form.php
<div class="wrap"><!--wrap is default class of wordpress admin setting page -->
<?php screen_icon(); ?><!--It is wordpress codex function gives output as "<div id="icon-cmsse_featured_content_menu" class="icon32" ><br></div>". Image can be alter by dynamic id class - id="icon-..." --><h2>CMSSE Feature Image Thumb options</h2>
<!--Options form stars-->
<form method="post" action="options.php">
<?php wp_nonce_field('update-options') ?>
<div class="metabox-holder" >
<div class="postbox" >
<h3>Feature Image Thumb Size(in px eg. 40px, 40px)</h3>
<div class="inside" style="padding:0px 15px 0px 15px;" >
<?php cmsse_selectbox( 'Select Custom Image Thumb Size:', 'image-thumb-size', array('40,40','50,50','60,60','80,80','90,90') ); ?>
<input type="submit" class="button-primary" name="Submit" value="Save Options" />
</p>
<strong>Note:</strong>
It displays feature image size at <a href="<?php echo admin_url( 'edit.php') ?>" target="_blank" >Posts listing page</a>. One can alter image size through above size selection.
</p>
<input type="hidden" name="action" value="update" />
<input type="hidden" name="page_options" value="<?php global $options; foreach($options as $option){ echo $option['optionname'].',';}?>" />
</div><!--/.inside-->
</div><!--/.postbox-->
</div><!--/.metabox-holder-->
</div><!--/.wrap-->
<!-- Form elements -->
<?php //Default select box ?>
<?php function cmsse_selectbox( $title, $name, $choices) { ?>
<strong><?php print $title; ?></strong>
<select name="<?php echo $name; ?>">
<?php
$select = get_option( $name );
foreach ( $choices as $choice ) {
if ( $choice == $select ) {
echo "<option value=\"$choice\" selected>" . $choice . "</option>\n";
}
else {
echo "<option value=\"$choice\" >" . $choice . "</option>\n";
}
} ?>
</select>
</p>
<?php }?>

File – output.php
<?php
// Add the posts and pages columns filter- by manage_posts_columns
// Default syntax for add filter - add_filter( $tag, $function_to_add, $priority, $accepted_args )
add_filter('manage_posts_columns', 'cmsse_add_post_thumbnail_column', 5);
// Adding Feature Image column at posts lists management page
function cmsse_add_post_thumbnail_column($column){
$column['cmsse_post_thumb'] = __('Featured Image');
return $column;
}
// See wordpress codex for more detail - manage_posts_custom_column
// Default syntax for add action - add_action( $tag, $function_to_add, $priority, $accepted_args )
// For example in codex: add_action( 'manage_posts_custom_column' , 'custom_columns', 10, 2 ); function custom_columns( $column, $post_id ) { //
add_action('manage_posts_custom_column', 'cmsse_display_post_thumbnail_column', 10, 2);
// Get Featured-thumbnail size post thumbnail and display it.
function cmsse_display_post_thumbnail_column($column, $post_id){
switch ( $column ) {
case 'cmsse_post_thumb':
//Default sytax : has_post_thumbnail( $post_id );
if ( has_post_thumbnail() ) {
// Default syntax - the_post_thumbnail( $size, $attr )
echo the_post_thumbnail( array(get_option('image-thumb-size')));
}
else {
//Extracting width and height figure, passing characters after 3rd position
$size = substr(get_option('image-thumb-size'),3);
echo '<img width="'.$size.'" height="'.$size.'" src="' . plugins_url('/images/default.jpg' , dirname(__FILE__ )).' " />';
}
break;
}
}
?><?php
// Add the posts and pages columns filter- by manage_posts_columns
// Default syntax for add filter - add_filter( $tag, $function_to_add, $priority, $accepted_args )
add_filter('manage_posts_columns', 'cmsse_add_post_thumbnail_column', 5);
// Adding Feature Image column at posts lists management page
function cmsse_add_post_thumbnail_column($column){
$column['cmsse_post_thumb'] = __('Featured Image');
return $column;
}
// See wordpress codex for more detail - manage_posts_custom_column
// Default syntax for add action - add_action( $tag, $function_to_add, $priority, $accepted_args )
// For example in codex: add_action( 'manage_posts_custom_column' , 'custom_columns', 10, 2 ); function custom_columns( $column, $post_id ) { //
add_action('manage_posts_custom_column', 'cmsse_display_post_thumbnail_column', 10, 2);
// Get Featured-thumbnail size post thumbnail and display it.
function cmsse_display_post_thumbnail_column($column, $post_id){
switch ( $column ) {
case 'cmsse_post_thumb':
//Default sytax : has_post_thumbnail( $post_id );
if ( has_post_thumbnail() ) {
// Default syntax - the_post_thumbnail( $size, $attr )
echo the_post_thumbnail( array(get_option('image-thumb-size')));
}
else {
//Extracting width and height figure, passing characters after 3rd position
$size = substr(get_option('image-thumb-size'),3);
echo '<img width="'.$size.'" height="'.$size.'" src="' . plugins_url('/images/default.jpg' , dirname(__FILE__ )).' " />';
}
break;
}
}
?>
Tags : ,
Aashutosh Kumar Yadav

By Aashutosh Kumar Yadav

He is a PHP-based UI/Web designer and developer by profession and very interested in technical writing and blogging. He has been writing technical content for about 10 years and has proficient in practical knowledge and technical writing.
@www.infotokri.in

0 comments:

Post a Comment