Hi. Currently producing a Wordpress plugin that allows for multiple image sliders. At the moment, to make sure that the code is valid I am having to load each sliders dynamic styling into the tags. This is fine, however it loads the styling for all the sliders, which can really start to add a lot of code to the pages source if the users uses many image sliders.
So I'm trying to get the styling to only be added to the tags if the slider is actually displayed on the page. Is this possible? This is how I am currently displaying the styling:
function test() {
global $wpdb;
$table_name = $wpdb->prefix . "premiumslider";
$number = $wpdb->get_results("SELECT * FROM $table_name");
foreach ($number as $slider) { ?>
<style type="text/css"><?php if($slider->paginationstyle == 'icons') { ?>
#lofslidecontent<?php echo $slider->id; ?> .lof-navigator li{<?php if($slider- >paginationstyle=='icons'){ ?>background: url(<?php if($slider->paginationoff=='') echo WP_PLUGIN_URL.'/premium-slider/images/pagination.png'; if($slider->paginationoff!='') echo $slider->paginationoff; ?>) 0 0 no-repeat;<?php } ?>}
#lofslidecontent<?php echo $slider->id; ?> .lof-navigator li.active{<?php if($slider->paginationstyle=='icons'){ ?>background: url(<?php if($slider->paginationon=='') echo WP_PLUGIN_URL.'/premium-slider/images/pagination_current.png'; if($slider->paginationon!='') echo $slider->paginationon; ?>) 0 0 no-repeat;<?php } ?>}
<?php } ?>
<?php if($slider->paginationstyle == 'images') { ?>
#lofslidecontent<?php echo $slider->id; ?> .lof-navigator { margin-top: 50px; }
#lofslidecontent<?php echo $slider->id; ?> .lof-navigator li img { border: <?php echo $slider->imgborder; ?>px solid #<?php echo $slider->imgcolour; ?>; }
#lofslidecontent<?php echo $slider->id; ?> .lof-navigator li.active img { border: <?php echo $slider->imgborder; ?>px solid #<?php echo $slider->imghover; ?>; }
#lofslidecontent<?php echo $slider->id; ?> .lof-navigator li.active img:hover { border: <?php echo $slider->imgborder; ?>px solid #<?php echo $slider->imghover; ?>; }
<?php } ?></style><?php
}
}
How can I achieve this?
To display the above code I use:
add_action('wp_head','test');
And to display the slider ($id being the id of that particular slider; 1, 2, 3, etc):
premium_slider($id);