ThemeShaper Forums » Thematic

[closed]

Adding slider to child theme, not working.

(11 posts)
  • Started 11 years ago by photoman
  • Latest reply from tarpontech
  • This topic is resolved

  1. photoman
    Member

    Hi,

    I was hoping wondering if someone could help me out. I'm building my first child theme which is based on the Thematic Feature Site and am trying to add the jquery plugin easySlider to my home page.

    http://cssglobe.com/post/3783/jquery-plugin-easy-image-or-content-slider

    I've done a ton of reading through this forum and can't get it to work. I am adding the following code to my functions file which I modified from ian's post here http://forums.themeshaper.com/topic/best-way-to-add-additional-jquery-scripts:

    // Add extra javascript to the childtheme
    function childtheme_scripts(){
    ?>

    <script type='text/javascript'>
    var childtheme_url = '<?php bloginfo('stylesheet_directory') ?>';
    </script>

    <script type='text/javascript' src='<?php bloginfo('stylesheet_directory'); ?>/js/easySlider.js'></script>
    <?php
    }

    add_action('wp_head', 'childtheme_scripts','10');

    When I add the code to my wordpress functions file I get a parse error in wordpress and it breaks my site.

    Parse error: syntax error, unexpected '}' in /x/wp-content/themes/thematicfeaturesite/functions.php on line 109

    I've run the code through php designer and it says there are no syntax errors so I can't figure out whats going wrong!

    Can anyone help?

    Posted 11 years ago #

  2. helgatheviking
    Moderator

    try: 

    define('CHILDTHEME_URI', get_stylesheet_directory_uri() . '/');

function childtheme_panel_add_stuff() {
wp_enqueue_script('easy_slider', CHILDTHEME_URI . 'js/easySlider.js');

}

add_action('wp-head', 'childtheme_panel_add_stuff');

    I've defined the theme location as a constant b/c i use it all over my files and this way i dont have to keep re-using get_bloginfo. also if that doesn't work try hooking the function onto init instead of wp-head. i am not really sure which it should be

    Posted 11 years ago #

  3. photoman
    Member

    Thanks very much. I used

    add_action('init', 'childtheme_panel_add_stuff');

    which worked great!!

    Posted 11 years ago #

  4. photoman
    Member

    Sorry I forgot to ask. Now my easySlider.js is showing up in my header I need to call the following script to get it to run:

    $(document).ready(function(){
    $("#slider").easySlider({
    prevText: 'Previous Slide',
    nextText: 'Next Slide',
    orientation: 'vertical'
    });
    });

    Could someone show me an example of the code I would add to add this to my child theme, I'm guessing it goes in functions.php also?

    Posted 11 years ago #

  5. photoman
    Member

    I managed to get this working but am still having a slight issue with the javascript options. I changed the code a bit:

    //jQuery
    function my_init() {
    if (!is_admin()) {
    wp_deregister_script('jquery');
    wp_register_script('jquery', 'http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js');
    wp_enqueue_script('jquery');
    }
    }
    add_action('init', 'my_init');

    //jQuery easySlider
    function easyslider() {
    ?>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js" type="text/javascript" charset="utf-8"></script>
    <script type="text/javascript" src="http://mysite.com/js/easySlider.js"></script>
    <script type="text/javascript">
    jQuery(document).ready(function(){
    jQuery('#slider').easySlider({ auto: true, speed: 800 });
    });
    </script>
    <?php
    }
    add_action('wp_head', 'easyslider');

    I can't get the auto option working. I was wondering if this is to do with the function being "ready" rather than being told to start when the page loads. Anyone any ideas?

    Posted 11 years ago #

  6. tarpontech
    Member

    try adding the action to thematic_before instead of wp_head

    add_action('thematic_before', 'easyslider');

    I just finished up a child-theme of the Featured, so we're pretty much in the same boat.
    I keep trying to add jQuery the "right way", using deregister et.al, with no results.

    here's a cut-n-paste from my functions.php, this works, and hasn't broken any other jquery plugins on the site (yet). Different slideshow, same general idea. Hope it helps get you working...

    //add front page javascript for slider 

	function shabadoo_front_page_javascript() { 

	if (is_front_page()) { ?>

		<script type="text/javascript" src="<?php echo bloginfo('stylesheet_directory') ?>/js/jquery.easing.1.3.js"></script>
		<script type="text/javascript" src="<?php echo bloginfo('stylesheet_directory') ?>/js/jquery.coda-slider-2.0.js"></script>
		<script>
			jQuery().ready(function() {
				jQuery('#coda-slider-1').codaSlider({
					autoSlide: true,
					autoSlideInterval: 18000,
					autoSlideStopWhenClicked: true,
					autoHeight: false,
					dynamicArrows: false,
					dynamicArrowLeftText: "left",
					dynamicArrowRightText: "right",
					dynamicTabs: false,
					dynamicTabsAlign: "center",
					dynamicTabsPosition: "bottom",
					panelTitleSelector: "",
					slideEaseDuration: 1000,
					slideEaseFunction: "easeInOutExpo"
			  });
			});

		</script>

	 		<?php }
					}
	add_action('thematic_before', 'shabadoo_front_page_javascript');
    Posted 11 years ago #

  7. cypress34
    Member

    Hi.. I wish I can help out here, but I use a different jquery slider for my blog which is Nivo Slider, and I was able to implement it after 2 days of trial and error. What I did was place one line of php code on my feature php file, set my rand to (1, 1) on functions.php and what took me long is the css, which would effect in case I want to use the other feature php file if I want to feature something without using the slider.

    Posted 11 years ago #

  8. photoman
    Member

    Hi,

    I'm managed to get everything working today using the same code I posted above. I updated to the latest version of my jquery slider and it started working so I'm guessing there was a problem with the old file or a bug in the javascript.

    A big thank you to everyone for your help. :)

    Posted 11 years ago #

  9. Robo
    Member

    Any chance of a link to where you have implemented it?

    Posted 11 years ago #

  10. sowingseeds
    Member

    Not sure if this will help but I implemented this (easyslider) in a theme two days ago. See it at http://racheloliver.eu/paintings. If this is similar to what you are looking for then: I function in_head_js(){
    ?>
    <script type="text/javascript" src="<?php echo bloginfo('stylesheet_directory') ?>/js/easySlider1.7.js"></script>
    <script type="text/javascript">
    jQuery(document).ready(function(){
    jQuery("#slider1").easySlider({
    numeric:true,
    numericId: 'controls1'
    });
    jQuery("#slider2").easySlider({
    numeric:true,
    numericId: 'controls2'
    });
    jQuery("#slider3").easySlider({
    numeric:true,
    numericId: 'controls3'
    });
    jQuery("#slider4").easySlider({
    numeric:true,
    numericId: 'controls4'
    });
    jQuery("#slider5").easySlider({
    numeric:true,
    numericId: 'controls5'
    });
    });
    </script>
    <?php
    }
    add_action('wp_head','in_head_js',33);

    Not sure if I neeeded the '33' in the add_action... put it in hopefully not to get a conflict and when it worked left it!!

    Posted 11 years ago #

  11. tarpontech
    Member

    As an addendum to my first post on this, I've since looked further into my issues with adding jquery to wp_head and determined that the issue was specific to the jquery plugin (coda), that I was trying to implement.

    Photoman's code is on-the-money for adding jquery to a thematic theme, as he can no doubt attest to.

    Posted 11 years ago #

RSS feed for this topic

Topic Closed

This topic has been closed to new replies.