Developer API

Details of the hooks and filters that are available to developers

metaslider_capability

Description

Use this filter to modify the user capability required to use MetaSlider. The default capability is ‘edit_others_posts’.

Parameters

$capability

(string) (required) User role capability

Examples

Change the capability required to use MetaSlider

You can change the required capability to any default capability included in WordPress.

In the example below we’ve used the User Role Editor plugin to create a custom capability (called ‘metaslider_use’).

/**
 * You can change this to a different capability by pasting the code below into
 * your themes functions.php file.
 *
 * You can use the 'User Role Editor' plugin to add a custom capability to WordPress
 * specifically for MetaSlider users.
 */
function metaslider_change_required_role($capability) {
    return 'metaslider_use'; // this is the ID of a custom capability added using User Role Editor
}
add_filter('metaslider_capability', 'metaslider_change_required_role');

metaslider_post_feed_args

Description

Use this filter to modify the query arguments used to extract posts in a Post Feed slide.

Parameters

$args

(array) (required) WP_Query arguments as defined by the slide settings

$slide

(object) (required) Current slide data

$slider_settings

(array) (required) Current slider settings

$slide_settings

(array) (required) Current slide settings

Examples

The following code samples should be added to your theme’s functions.php file.

Display all posts tagged to the current category

Use this code to override the taxonomy restrictions defined in the slide settings, and instead extract all posts which are tagged to the current category. With this code in place you can create a single slideshow and add the Template Include to your category.php template. The slideshow will automatically show posts that are tagged to the current category.

function metaslider_restrict_to_current_category( $args, $slide, $slider_settings, $slide_settings ) {
 
    // check slide ID so we only apply this functionality where it's needed

    // replace "123" with the slide ID to target.

	if ( $slide->ID == 123 && is_category() ) {
 
		// remove any existing restrictions
		if ( isset ( $args['tax_query'] ) ) {
			unset( $args['tax_query'] );
		}
		
		// restrict to posts tagged to the current category
	        $args['tax_query'][] = array(
	            'taxonomy' => 'category',
	            'field' => 'id',
	            'terms' => get_query_var( 'cat' )
	        );
 
	}
 
	return $args;
}
add_filter( 'metaslider_post_feed_args', 'metaslider_restrict_to_current_category', 10, 4);

 Display Sticky Posts only

function metaslider_post_feed_sticky( $args, $slide, $slider_settings, $slide_settings ) {
 
    // replace "735" with the slide ID to target.
    // get the slide ID by hovering over the delete icon and noting down the "deleteSlide" ID in the status bar
	if ( $slide->ID == 735 ) {
		$args['post__in'] = get_option('sticky_posts');
		$args['ignore_sticky_posts'] = true;
	}
 
	return $args;
}
add_filter( 'metaslider_post_feed_args', 'metaslider_post_feed_sticky', 10, 4);

 

metaslider_hoplink

Description

Use this filter to modify the URL used in the “Go Pro” links throughout MetaSlider. This is for use by theme developers who have signed up as an affiliate.

Parameters

$link

(string) (required) The URL used to direct users to www.metaslider.com from all “Go Pro” links within the MetaSlider interface.

Examples

Use Affiliate URL

function metaslider_hoplink($link) {
    return "https://getdpd.com/cart/hoplink/15318?referrer=fh887eioypcsc4ok";
}
add_filter('metaslider_hoplink', 'metaslider_hoplink', 10, 1);

metaslider_default_parameters

Description

Use this filter to modify the default slideshow settings. Theme developers may wish to use this to automatically set a ‘recommended’ slideshow size.

Note: this will only apply to the first ever slideshow created in MetaSlider. Subsequent slideshows are given a copy of the settings for the last edited slideshow.

Parameters

$params

(array) (required) Default slideshow settings

Examples

Change Default Slideshow Size

function metaslider_default_slideshow_properties($params) {
        $params['width'] = 960;
        $params['height'] = 300;
	return $params;
}
add_filter('metaslider_default_parameters', 'metaslider_default_parameters', 10, 1);

metaslider_resized_image_url

Description

Usethis filter to modify the slide image URL used by MetaSlider. For example, it could be used to change the full image URL to a relative image URL.

Parameters

$cropped_url

(string) (required) The URL to the cropped/resized image (e.g. http://[…]/image-150x150.jpg)

$orig_url

(string) (required) The URL to the full size image (e.g.  http://[…]/image.jpg)

Examples

Protocol Relative URLs

The example below will remove the “http:” portion of the image URL, making it into a “protocol relative URL”. This will allow the image to be loaded over the same protocol as the page itself (ideal for https pages).

function metaslider_protocol_relative_urls($cropped_url, $orig_url) {
    return str_replace('http://', '//', $cropped_url);
}
add_filter('metaslider_resized_image_url', 'metaslider_protocol_relative_urls', 10, 2);

Disable Cropping

The example below effectively disables cropping by returning the original, full size image URL for each slide.

function metaslider_disable_crop($cropped_url, $orig_url) {
    return $orig_url;
}
add_filter('metaslider_resized_image_url', 'metaslider_disable_crop', 10, 2);

metaslider_image_{$type}_slider_markup

Description

This filter allows you to modify the complete slide HTML generated by MetaSlider.

{type} can be flex, coin, responsive or nivo.

Parameters

$html

(string) (required) HTML markup for the complete slide

$slide

(array) (required) Slide data

$settings

(array) (required) Slideshow settings

Examples

Append custom HTML to each slide

function metaslider_append_pinit_button($html, $slide, $settings) {
    return $html .= "<div class="pinit">Pin It</div>";
}
add_filter('metaslider_image_coin_slider_markup', 'metaslider_append_pinit_button', 10, 3);

metaslider_{type}_slider_image_attributes

Description

Use this filter to modify or add attributes to each slide image tag.

{type} can be flex, coin, responsive or nivo.

Parameters

$attributes

(array) (required) Default image attributes (eg width, height, src).

$slide

(array) (required) Slide data

$slider_id

(int) (required) Slideshow ID

Examples

Add rel attribute

This example will add a ‘rel’ attribute of ‘lightbox’ to each slide in the slideshow. Eg, <img width=’x’ height=’x’ src=’x’ rel=’lightbox’ />

function metaslider_add_rel_attribute_to_images($attributes, $slide, $slider_id) {
        $attributes['rel'] = 'lightbox';
	return $attributes;
}
add_filter('metaslider_flex_slider_image_attributes', 'metaslider_add_rel_attribute_to_images', 10, 3);

metaslider_{type}_slider_anchor_attributes

Description

Use this filter to modify or add attributes to each slide anchor (link) tag.

{type} can be flex, coin, responsive or nivo.

Parameters

$attributes

(array) (required) Default anchor attributes (eg url, target etc).

$slide

(array) (required) Slide data

$slider_id

(int) (required) Slideshow ID

Examples

This example will automatically link each slide to it’s full image URL. {type} can be flex, coin, responsive or nivo.

function metaslider_add_full_url_to_slides($attributes, $slide, $slider_id) {
	if (!strlen($attributes['href'])) {
		$attributes['href'] = wp_get_attachment_url($slide['id']);
	}
	return $attributes;
}
add_filter('metaslider_flex_slider_anchor_attributes', 'metaslider_add_full_url_to_slides', 10, 3);

metaslider_{type}_slider_javascript

Use this filter to add javascript below (after) the slider JavaScript call. {type} can be flex, coin, responsive or nivo.


function metaslider_nivo_js($javascript, $slider_id) {
    $javascript .= "alert('Nivo slider has loaded');";

    return $javascript;
}
add_filter('metaslider_nivo_slider_javascript', 'metaslider_nivo_js', 10, 2);

metaslider_{type}_slider_javascript_before

Use this filter to add javascript before the slider JavaScript call. {type} can be flex, coin, responsive or nivo.


function metaslider_nivo_js($javascript, $slider_id) {
    $javascript .= "alert('Nivo slider is about to be initiated.');";
    return $javascript;
}
add_filter('metaslider_nivo_slider_javascript', 'metaslider_nivo_js', 10, 2);

metaslider_{type}_slider_parameters

Description

Use this filter to modify the JavaScript properties used to initiate the slideshow.

MetaSlider exposes most of each slideshows options in the slideshow settings, but there are some specialist options that are offered by each slideshow library that you cannot change through the MetaSlider interface. This filter allows you to change existing properties or add new ones.

For a full list of available properties, see Flex Slider Properties, Nivo Slider Properties (scroll down to ‘Play with settings’), Coin Slider Properties (scroll down to ‘List of all options’), Responsive Slides Properties (scroll down to ‘Options you can customise’)

Important:

  • To create/alter an integer property value, omit quotes
  • To create/alter a string property value, use single or double quotes
  • To create or add to a function, assign the value to an array (see first example)

{type} can be flex, coin, responsive or nivo.

Parameters

$options

(array) (required) Slideshow properties

$slider_id

(array) (required) Slideshow ID

$settings

(int) (required) Slideshow settings

Examples

Altering Flex Slider Properties

function metaslider_flex_params($options, $slider_id, $settings) {
    if ($slider_id == 123) { // check for slider ID (optional)
        $options['startAt'] = 2; // startAt: 2
        $options['animationLoop'] = "false"; // animationLoop: false
        $options['namespace'] = "'flex-'"; // namespace: 'flex'
        $options['start'][] = "alert('hello');"; // start: function() { alert('hello'); }
    } 
    return $options;
} 
add_filter('metaslider_flex_slider_parameters', 'metaslider_flex_params', 10, 3);

The above code will result in the following output:

$('#metaslider_123').flexslider({
    [existing properties],
    startAt: 2,
    animationLoop: false,
    namespace: 'flex-',
    start: function(slider) {
        alert('hello');
    }
});