Custom Slider Themes

Hey @kevinvess

There’s no great way to do this at the moment but it’s something I’ve been wanting to add in actually. I think it would be a good option for theme developers to include their own themes that MetaSlider can pick up on.

Can you give me an idea of how you plan to use it?

Thanks for the quick reply!

Instead of just overwriting the styles of one of the builtin/free slideshow themes to fit the style of our site theme, I was looking for a way to include a custom slideshow theme to the MetaSlider “Select a custom theme” option.

This way, users of our theme can either select our tailored slideshow theme or one of the builtin themes.

I figured I would follow the same structure of your current builtin themes, for example:

class MetaSlider_Theme_Outline extends MetaSlider_Theme_Base {
  // etc...
}

Only, I would need a way to tell MetaSlider to include my custom slideshow theme(s) located in whatever directory.

Hi @kevinvess

I’ll try to have something in the next release. Most likely I will add a filter for the following:

1. add an entry (or entries) to the theme manifest file
2. define a directly to look for themes (the folder name is defined in the manifest)
3. I’ll add a filter to define a default theme so that when a user creates a slideshow it will set that theme.

Anything else useful you can think of?

That’s perfect–?thanks!

I look forward to these changes in the next release. Thanks again for your quick replies and support of this plugin–?keep up the great work!

Hey Kevin,

This is possible now. You just need to add a filter to an area where you want to house your MetaSlider themes. I’ll eventually get some documentation up but for now here’s how ti works:

You have a folder structure like this somewhere in your WP theme folder

/metaslider
│   manifest.php   
│
└───/themefoldername
    │   screenshot.png
    │
    └───/v1.0.0
        │   theme.php

You need these files for it to register properly.

Then in the manifest file you need something like this:

<?php

return [
  'themefoldername' => [
    'folder' => 'themefoldername',
    'title' => 'Theme Title',
    'supports' => array('flex', 'responsive', 'nivo', 'coin'),
    'tags' => array('optional', 'tags', 'can', 'be', 'used'),
    'description' => __('An optional description can be used', ''),
    'screenshot_dir' => get_stylesheet_directory_uri() . '/metaslider/themefoldername'
  ]
];

Then it should pick up the theme and show them at the top of the list.

Let me know if there are any issues! Thanks

@kbat82 Thanks for working on this request!

I’m trying to get this to work, but the plugin doesn’t seem to pick up the custom theme added to my theme folder. And no errors are being thrown.

It looks like the constant METASLIDER_THEMES_PATH is always using the plugin directory?

Let me know your thoughts.

Thanks!
Kevin

Hi @kevinvess,

It should merge your defined path with the METASLIDER_THEMES_PATH constant. It checks to make sure everything is formatted and set up properly. Can you show me how you have it set up?

$themes = (include METASLIDER_THEMES_PATH . 'manifest.php');

// Let theme developers or others define a folder to check for themes
$extra_themes = apply_filters('metaslider_extra_themes', array());
foreach ($extra_themes as $location) {

	// Make sure there is a manifest
	if (file_exists(trailingslashit($location) . 'manifest.php')) {
		$manifest = include (trailingslashit($location) . 'manifest.php');

		// Make sure each theme has an existing folder, title, description
		foreach ($manifest as $data) {
			if (file_exists(trailingslashit($location) . $data['folder'])
				&& isset($data['title']) 
				&& isset($data['description'])
				&& isset($data['screenshot_dir'])) {

				// Identify this as an external theme
				$data['type'] = 'external';

				// Add theirs to the top
				array_unshift($themes, $data);
			}
		}
	}
}

@kbat82 Thanks for the quick reply!

I see– I needed to hook into the metaslider_extra_themes filter to add my custom manifest.php file.

I thought the plugin would automatically find and add my custom manifest.php file based on the specific /metaslider folder structure in your example.

Now that I’ve added the metaslider_extra_themes filter, my custom theme is showing up as an option.

Thanks!

Hi @kevinvess

Oh yeah, it looks like I forgot to mention the filters previously!

add_filter('metaslider_extra_themes', function($locations) {
	$locations[] = get_template_directory() . '/metaslider';
	return $locations;
});

This one will set it as default

add_filter('metaslider_default_theme', function() {
	return 'name_of_your_theme';
});

@kbat82 Perfect,?thanks!

One other question–?how do I configure the slider parameters?

Here is what I’ve tried which seems to work for a couple options, but delay and effect don’t seem to work:

public $slider_parameters = array(
		'height'   => 400,
		'delay'    => 4000,
		'effect'   => 'slide',
		'prevText' => '',
		'nextText' => ''
);

Hi @kevinvess

Of the top of my head I think you have to set it up for each slider plugin you want to use/support, so if you’re using FlexSlider you need to add options for that, which you can find here.

https://gist.github.com/bryceadams/3883059

If that doesn’t work let me know and I can take a closer look tomorrow.

@kbat82 Never mind, I figured it out–

I needed to pass quotes with the value for effect otherwise, the JS errors out, for example:

public $slider_parameters = array(
		'height'   => 400,
		'delay'    => 4000,
		'effect'   => '"slide"',
		'prevText' => '',
		'nextText' => ''
);

Thanks!

Hi @kevinvess,

Yeah that makes sense the way it’s set up, otherwise JS is looking for a variable. Let me know if you have any other issues.

Ok–?after further testing, the $slider_parameters setting in the theme.php file doesn’t seem to override the default slider settings for the selected theme.

Is the only way to do this, through the metaslider_default_parameters filter? Which also doesn’t seem to change the settings for a new slideshow for some reason; for example:

function my_default_parameters( $params ) {
	$slider_parameters = array(
		'height' => 400,
		'delay' => 4000,
		'effect' => 'slide',
	);
	return array_merge( $params, $slider_parameters );
}
add_filter( 'metaslider_default_parameters', 'my_default_parameters' );

@kbat82

When I create a new slideshow, it seems to start with the settings I last manually entered instead of the plugin’s default settings.