Making a Simple Rating Field Type in Easy Content Types

Several users have requested that I build a “rating” field type for Easy Content Types that will allow administrators / editors to apply a rating to a post or custom post type entry. This sort of field type would be exceptionally useful for users running review websites, such as book, movie, or game reviews. I have gone ahead and built a simple star/number rating field type, and would like to share with all of you the methods used to build such a field type. It is a little complicated, but if you’re already familiar with adding new field types in Easy Content Types, you won’t have any problems.

If you have not already watched my tutorial on how to register custom meta field types in the plugin, then go  watch it now.

The field types we will be creating look like this:

When rendered on the front end, our fields will look like this (when using the automatic display meta function):

In the video, I walk you through all of the functions (except the last two; the reason is explained in the video) and describe the process of setting up the new field type. To aide you in building your own rating field type, the complete code is below:

   <?php
 
/*
Plugin Name: Easy Content Types: Simple Rating Field Type Add On
Plugin URI: https://pippinsplugins.com/making-a-simple-rating-field-type-in-easy-content-types
Description: Adds a "rating" meta field type to Easy Content Types
Author: Pippin Williamson
Contributors: mordauk
Author URI: https://pippinsplugins.com
Version: 1.0
*/
 
 
function ecpt_rating_field_types($field_types) {
	$field_types[] = 'star rating';
	$field_types[] = 'number rating';
 
	return $field_types;
}
add_filter('ecpt_field_types', 'ecpt_rating_field_types');
 
function ecpt_rating_field_html($field_html, $field, $meta) {
 
	switch($field['type']) :
 
		case 'star rating' :
			$field_html = '<select name="' . $field['id'] . '" id="' . $field['id'] . '">';
				$field_html .= '<option value="none">' . __('Choose a rating', 'ecpt') . '</option>';
				for($i = 1; $i <= 5; $i++) {
					$field_html .= '<option value="' . $i . '" ' . selected($i, $meta, false) .'>';
						for($stars = 1; $stars <= $i; $stars++) {
							$field_html .= '&#9734';
						}
					$field_html .= '</option>';
				}
			$field_html .= '</select>';
		break;
 
		case 'number rating' :
			$field_html = '<select name="' . $field['id'] . '" id="' . $field['id'] . '">';
				$field_html .= '<option value="none">' . __('Choose a rating', 'ecpt') . '</option>';
				for($i = 1; $i <= 5; $i++) {
					$field_html .= '<option value="' . $i . '" ' . selected($i, $meta, false) .'>' . $i . '</option>';
				}
			$field_html .= '</select>';		
		break;
 
	endswitch;
 
	return $field_html;
 
}
add_filter('ecpt_fields_html', 'ecpt_rating_field_html', 10, 3);
 
function ecpt_show_rating_field_type_in_auto_display($display, $value, $field) {
 
	switch($field->type) :
 
		case 'star rating' :
			$display .= '<li class="ecpt_field ecpt_' . $field->type . '_field" id="ecpt_' . $field->name . '">';
				$display .= '<div class="ecpt_field_name">' . $field->nicename . '</div>';
				if($descriptions) {
					$display .= '<div class="ecpt_field_desc">' . $field->description . '</div>';
				}
				$display .= '<div class="ecpt_field_content ecpt_star_rating" style="color: gold;">';
					$display .= '<style>.ecpt_star_rating span { position: relative; display: inline-block; } .ecpt_star_rating span:before { content: "\2605"; position: absolute; }</style>';
					for($i = 1; $i <= $value; $i++) {
						$display .= '<span>&#9734</span>';
					}
 
				$display .= '</div>';
			$display .= '</li>';		
		break;
 
		case 'number rating' :
			$display .= '<li class="ecpt_field ecpt_' . $field->type . '_field" id="ecpt_' . $field->name . '">';
				$display .= '<div class="ecpt_field_name">' . $field->nicename . '</div>';
				if($descriptions) {
					$display .= '<div class="ecpt_field_desc">' . $field->description . '</div>';
				}
				$display .= '<div class="ecpt_field_content ecpt_number_rating">' . $value . '</div>';
			$display .= '</li>';	
		break;
 
	endswitch;
 
	return $display;
}
add_filter('ecpt_display_fields', 'ecpt_show_rating_field_type_in_auto_display', 10, 3);
 
function ecpt_add_settings_for_rating_fields($post_type) { 
 
	global $ecpt_options;
	?>
	<!--star ratin field-->
	<div style="border-left: 1px solid #ccc; padding-left: 25px;" class="meta-field-option">
		<input class="checkbox" id="ecpt_settings[meta_fields_<?php echo $post_type; ?>_star_rating]" name="ecpt_settings[meta_fields_<?php echo $post_type; ?>_star_rating]" type="checkbox" value="1" <?php if ( isset($ecpt_options['meta_fields_' . $post_type . '_star_rating']) && $ecpt_options['meta_fields_' . $post_type . '_star_rating'] == 1) echo 'checked="checked"'; ?>/>
		<label class="description" for="ecpt_settings[meta_fields_<?php echo $post_type; ?>_star_rating]"><?php _e( 'Check this box to automatically display star rating fields', 'ecpt'); ?></label>
	</div>
 
	<!--number rating field-->
	<div style="border-left: 1px solid #ccc; padding-left: 25px;" class="meta-field-option">
		<input class="checkbox" id="ecpt_settings[meta_fields_<?php echo $post_type; ?>_number_rating]" name="ecpt_settings[meta_fields_<?php echo $post_type; ?>_number_rating]" type="checkbox" value="1" <?php if ( isset($ecpt_options['meta_fields_' . $post_type . '_number_rating']) && $ecpt_options['meta_fields_' . $post_type . '_number_rating'] == 1) echo 'checked="checked"'; ?>/>
		<label class="description" for="ecpt_settings[meta_fields_<?php echo $post_type; ?>_number_rating]"><?php _e( 'Check this box to automatically display number rating fields', 'ecpt'); ?></label>
	</div>
	<?php
}
add_action('ecpt_settings_for_bonus_field_types', 'ecpt_add_settings_for_rating_fields', 10);
 
function ecpt_add_ratings_to_enabled_types_for_auto_display($types, $post_type) {
 
	global $ecpt_options;
 
	if($ecpt_options['meta_fields_' . $post_type . '_number_rating'] == true)	
		$types[] = 'number rating';
 
	if($ecpt_options['meta_fields_' . $post_type . '_star_rating'] == true)	
		$types[] = 'star rating';
 
	return $types;
}
add_filter('ecpt_enabled_types_for_auto_display', 'ecpt_add_ratings_to_enabled_types_for_auto_display', 10, 2);

Still need help? Contact Us Contact Us