Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

WordPress How to Build a WordPress Theme Extending WordPress Template Functionality Finishing the Homepage Template

I'm having an issue with the clearfix flexslider. It is not showing up on my homepage for the wordpress portfolio site.

I have followed all the instructions to the tee, I'm wondering if it has something to do with jQuery file? Please help

8 Answers

Joe Bruno
Joe Bruno
35,909 Points

Are you getting any js errors in your consol?

I'm just following the videos and there seems to be a few inconsistencies with the project files and what is shown in the video. Something doesn't work, or if you take something out, it works. I tinkered around a little bit and got it to where I was happy.

I am having the same problem, and am getting console errors.
GET .../flexslider.js?ver=4.0 (index):613 Uncaught: TypeError: undefined is not a function theme,js?ver=4.0:2 jquery-latest.min.js?ver4.0:2 Andrew's vague reply that he "tinkered around a little bit" does not help me.

Joe Bruno
Joe Bruno
35,909 Points

Look at the line in the error above "function theme,js" - change to function theme.js

Use a period not a comma

Sorry that comma was my typo here. the Text in this reply was from the debug console referencing the file name and version.

Joe Bruno
Joe Bruno
35,909 Points

I am not seeing the "Text" from the debug console.

Joe Bruno
Joe Bruno
35,909 Points

Copy your php from your functions.php file so we can have a look.

<?php

// Load the Theme CSS

function theme_styles() {

wp_enqueue_style( 'normalize', get_template_directory_uri() . '/css/normalize.css' );
wp_enqueue_style( 'grid', get_template_directory_uri() . '/css/grid.css' );
wp_enqueue_style( 'gogglefonts', 'http://fonts.googleapis.com/css?family=Sorts+Mill+Goudy:400,400italic' );
wp_enqueue_style( 'main', get_template_directory_uri() . '/style.css' );
wp_enqueue_style( 'social', get_template_directory_uri() . '/css/webfonts/ss-social.css' );

wp_register_style( 'flexslider', get_template_directory_uri() . '/css/flexslider.css' );

if( is_page( 'home') ) {

    wp_enqueue_style( 'flexslider' );

}

}

add_Action( 'wp_enqueue_scripts', 'theme_styles' );

// Enable custom menus add_theme_support( 'menus' );

function create_widget( $name, $id, $description ) { /** * Creates a sidebar * @param string|array Builds Sidebar based off of 'name' and 'id' values. */

$args = array(
    'name'          => __( $name ),
    'id'            => $id,
    'description'   => $description,
    'before_widget' => '',
    'after_widget'  => '',
    'before_title'  => '<h5>',
    'after_title'   => '</h5>' 
); 

register_sidebar( $args ); //To add new widget areas to the theme

}

create_widget ( 'Left Footer', 'footer_left', 'Display in the bottom left of footer' ); create_widget ( 'Middle Footer', "footer_middle", 'Display in the bottom middle of footer' ); create_widget ( 'Right Footer', 'footer_right', 'Display in the bottom right of footer' );

// Load the Theme JS

function theme_js() {

wp_enqueue_script( 'flexslider', get_template_directory_uri() . '/js/flexsilder.js', array('jquery'), '', true );

if( is_page( 'home') ) {

    wp_enqueue_script( 'flexslider' );
}

wp_enqueue_script( 'theme_js', get_template_directory_uri() . '/js/theme.js', array('jquery'), '', true );

} add_Action( 'wp_enqueue_scripts', 'theme_js' );

?>

Joe Bruno
Joe Bruno
35,909 Points

Actually, with WordPress you usually get an undefined error like that when there is an issue with a JS file. WordPress does not like the $ jQuery sign. Try this in your js:

  //FIRST LINE OF JS FILE TYPE
   ( function( $ ) {

    ....contents....

//LAST LINE OF JS FILE
 } )( jQuery );

I ended up copying the flexslider.js and flexslider.css from the section downloads, seems the versions of those I had did not match. The $ to jQuery did not have an effect.