Slider Revolution WP
09.06.2016
Let’s say we want to create a new Source Type that makes use of the Essential Grid Image Meta.
1 2 3 4 5 6 7 8 |
add_filter('essgrid_set_media_source_order', 'eg_add_custom_image_type'); function eg_add_custom_image_type($media){ $media['interior-photo'] = array('name' => __('Interior Photo'), 'type' => 'picture'); return $media; } |
This will add a new entry called Interior Photo to the available list in the Grid Settings. As type, there can be set many different things, it will be the icon that is used. For a full list of available icons, please open essential-grid/public/css/settings.css and search for .eg-icon-soundcloud. .eg-icon- need to be always beeing ignored in this setting. So for the soundcloud icon, you would only write ‘type’ => ‘soundcloud’.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 |
add_filter('essgrid_modify_media_sources', 'eg_set_meta', 10, 2); //Add a call to add the new values that Ess. Grid needs. In this example, we add the image url function eg_set_meta($media, $postid){ $meta_val = get_post_meta($postid, 'interior-photo', true); //Get the choosen Image ID in the Post if(intval($meta_val) == 0) //since we use in this example an Meta from Ess. Grid, it may be that we need to use the eg- part if we receive 0 here $meta_val = get_post_meta($postid, 'eg-interior-photo', true); //May also be eg-interior-photo if this is a meta created by essential grid $feat_img = wp_get_attachment_image_src($meta_val, 'full'); //Get the Image, in this case full means the original, not cropped size. $feat_img_full = $feat_img; $feat_img_alt_text = get_post_meta($meta_val, '_wp_attachment_image_alt', true); //Also get the alt tag for SEO reasons /** * now add the URL of the image and the alt text to the values. Make sure to use the same handle here as in the next function (interior-photo) * interior-foto-full is used for the LightBox */ $media['interior-photo'] = @$feat_img[0]; $media['interior-photo-full'] = @$feat_img_full[0]; $media['interior-photo-alt'] = $feat_img_alt_text; return $media; } |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 |
add_filter('essgrid_set_media_source', 'eg_set_interior_value', 10, 3); //add a call when Essential Grid is setting the media to the item function eg_set_interior_value($media, $handle, $media_sources){ if($handle == 'interior-photo'){ //Only modify anything if the handle is our handle! if(isset($media_sources['interior-photo'])){ //check if the media is set in the post. Again, only modify if it is set! $media = '<img src="'.$media_sources['interior-photo'].'" alt="'.@$media_sources['interior-photo-alt'].'">'; //set the HTML that should be used } } return $media; } |
Now the Grids have the capability to use a Meta as the Media Source.