WordPress.org

Ready to get started?Download WordPress

Forums

WP-Cycle
Can we add navigation arrows or buttons? (4 posts)

  1. Tussy
    Member
    Posted 1 year ago #

    I would like to give users the ability to navigate the slides. How can i add navigation arrows or buttons?

    http://wordpress.org/extend/plugins/wp-cycle/

  2. Gyan Gaurav
    Member
    Posted 1 year ago #

    Hi Tussy..

    this plugin doesn't support next and previous button links..we will have to wait for their next release.

  3. nerdfit
    Member
    Posted 7 months ago #

    Any plans on integrating this into the next update?

  4. Gyan Gaurav
    Member
    Posted 7 months ago #

    Hi nerdfit !

    I dont think if there is any update coming in near future of this plugin.
    but I have got a solution for you or any body who want to integrate the next prev buttons.

    You need to update the wp_cycle.php . In this file somewhere near line no 454 you can see this code.

    <script type="text/javascript">
    jQuery(document).ready(function($) {
    	$("#<?php echo $wp_cycle_settings['div']; ?>").cycle({
    	    fx: '<?php echo $wp_cycle_settings['effect']; ?>',
    	    timeout: <?php echo ($wp_cycle_settings['delay'] * 1000); ?>,
    	    speed: <?php echo ($wp_cycle_settings['duration'] * 1000); ?>,
    	    pause: 1,
    	    fit: 1
    	});
    });
    </script>

    you need to add two more lines in this code .

    <script type="text/javascript">
    jQuery(document).ready(function($) {
    	$("#<?php echo $wp_cycle_settings['div']; ?>").cycle({
    	    fx: '<?php echo $wp_cycle_settings['effect']; ?>',
    	    timeout: <?php echo ($wp_cycle_settings['delay'] * 1000); ?>,
    	    speed: <?php echo ($wp_cycle_settings['duration'] * 1000); ?>,
    	    pause: 1,
    	    fit: 1.
                next: '#next',
    	    prev: '#prev'
    	});
    });
    </script>

    Once its done.. move to line number 406 where you find the wp_cycle function written. Line # may be different in your file as i have made many changes here in mine. so basically find this function.

    function wp_cycle($args = array(), $content = null) {
    	global $wp_cycle_settings, $wp_cycle_images;
    
    	// possible future use
    	$args = wp_parse_args($args, $wp_cycle_settings);
    
    	$newline = "\n"; // line break
    
    	echo '<div id="'.$wp_cycle_settings['div'].'">'.$newline;
    
    	foreach((array)$wp_cycle_images as $image => $data) {
    		if($data['image_links_to'])
    		echo '<a href="'.$data['image_links_to'].'">';
    
    		echo '<img src="'.$data['file_url'].'" width="'.$wp_cycle_settings['img_width'].'" height="'.$wp_cycle_settings['img_height'].'" class="'.$data['id'].'" alt="" />';
    
    		if($data['image_links_to'])
    		echo '</a>';
    
    		echo $newline;
    	}
    
    	echo '</div>'.$newline;
    }

    now just below this function , add this two line which will be the navigation arrows for your slider.
    <div id="prev"><img src="<?php bloginfo('stylesheet_directory'); ?>/images/prev.gif" alt=""></div><div id="next"><img src="<?php bloginfo('stylesheet_directory');?>/images/next.gif" alt=""></div>

    thats it. don't forget to upload two images in your theme image folder named "prev.gif" and "next.gif".

    Let me know if it helps and any problem you face.

Topic Closed

This topic has been closed to new replies.

About this Plugin

About this Topic

Tags

No tags yet.