Foundation 4 Orbit >> Making it work in WP

  • Resolved RDStudent

    (@rdstudent)


    12 years, 5 months ago

    Hello,

    I am first time here and this is my last resort for trying to solve this issue. For past 4h I have been searching and playing around with footer.php and header.php and functions.php..

    I am trying to get
    FOUNDATIONS 4 – Orbit (JavaScript) to work.

    I got it to work just fine on stand alone .html page but for some reason I can’t figure out how to attach it to work correctly in wordpress.

    I tried the following ..
    1) HardCode the .js in the footer.php // NO GOOD
    2) HardCode in the header.php // NO GOOD
    3) different ways with functions.php // NEVER GOT IT TO WORK

    I am totally out of ideas and options, I found some solutions on stackoverflow however no one ever left a good enough explanation how they got it to work.

    If someone can walk me through this step by step I would truly appreciate it.

    P.S.
    Also in general how would I attach a custom JavaScript, I was also reading that WP is pushing for jQuery. I don’t have much experience with jQuery but I am all ears here I am willing to learn. THANK YOU ALL

    Thanks you!

Viewing 6 replies - 1 through 6 (of 6 total)
  • Thread Starter RDStudent

    (@rdstudent)

    12 years, 5 months ago

    Anyone ???

    Moderator Jose Castaneda

    (@jcastaneda)

    THEME COFFEE MONKEY

    12 years, 5 months ago

    What methods did you use with functions.php ??

    WPyogi

    (@wpyogi)

    12 years, 5 months ago

    Have you seen?

    http://codex.wordpress.org/Using_Javascript

    Thread Starter RDStudent

    (@rdstudent)

    12 years, 5 months ago

    <!--- Current Footer --->
<!-- Java Scripts -->
 <script>
  document.write('<script src= <?php bloginfo('template_url'); ?>' +
  ('__proto__' in {} ? 'js/vendor/zepto' : 'js/vendor/jquery') +
  '.js><\/script>')
  </script>

  <script type="text/javascript" src="<?php bloginfo('template_url'); ?>/js/foundation.min.js"></script> 

  <script type="text/javascript" src="<?php bloginfo('template_url'); ?>/js/foundation/foundation.orbit.js"></script>

  <script>
    $(document).foundation();
  </script>

  <?php wp_footer(); ?>
// I have tried few different version of this

<!-- Functions -->
<!-- Sample 1 -->
function load_my_java() {
	wp_enqueue_script( 'script-name', get_template_directory_uri() . '/js/foundation-min.js', array(), '', true );
}

add_action( 'wp_enqueue_scripts', 'load_my_java' );

<!-- Sample 2 -->
function load_my_java() {
wp_register_script( 'foundation', get_template_directory_uri() . '/js/foundation-min.js', array(), '', true );
wp_enqueue_script('foundation');
add_action( 'init', 'load_my_java' );

    So far none of it worked, they did load I could see them in the source but not functional.

    WPyogi

    (@wpyogi)

    12 years, 5 months ago

    That code may have been mangled (I added the code backticks) – please use the code buttons when posting code as per:

    http://codex.wordpress.org/Forum_Welcome#Posting_Code

    Thread Starter RDStudent

    (@rdstudent)

    12 years, 5 months ago

    I got the solution I needed to init additional script

    Here is how my functions.php look like

    <?php
function _sf_scripts() {
wp_enqueue_script('foundation-js', get_template_directory_uri().'
/js/foundation.min.js', array( 'jquery' ), false, true);
wp_enqueue_script('foundation-init', get_template_directory_uri().'/js/foundation-orbit.js', array(), false, true);
wp_enqueue_script( 'menu-effect', get_template_directory_uri() . '/js/menu.js',
array(), '1.0.0', true );
}
add_action( 'wp_enqueue_scripts', '_sf_scripts' );

add_action( 'wp_footer', 'so20558071_foundation_init', 9999 );
function so20558071_foundation_init()
{
    echo '<script>jQuery(document).foundation();</script>';
}
?>
Viewing 6 replies - 1 through 6 (of 6 total)

The topic ‘Foundation 4 Orbit >> Making it work in WP’ is closed to new replies.