Autofocus+ Pro Theme | Javascript disabled after updating to 3.1 WordPress

Denzel Chia comments:

Hi,

Just saw your wp super cache at the bottom of your page source.
Maybe just clearing your super cache will work, instead of my previous answer.

Thanks.

Denzel Chia comments:

Sorry,

Latest update.

I had upgraded my autofocus localhost setup to WordPress 3.1 and autofocus theme javascript fails.
Pasted the codes below in functions.php saves the javascript, by using jQuery 1.4.2 from Google CDN instead of jQuery 1.4.4 included by WordPress 3.1

WordPress 3.0.5 uses jQuery 1.4.2


function autofocus_init_script() {
if (!is_admin()) {
wp_deregister_script( 'jquery' );
wp_register_script( 'jquery', 'https://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js');
wp_enqueue_script( 'jquery' );
}
}
add_action('init', 'autofocus_init_script');


Thanks.

Daniel Marsden comments:

Denzel,

Thanks for your help. I posted your code in my functions.php file at the very beginning, but below <?php and it the jquery still doesn't appear to be working.

I am posting my complete functions.php file code below.

Any help would be greatly appreciated!


<?php

function autofocus_init_script() {

if (!is_admin()) {

wp_deregister_script( 'jquery' );

wp_register_script( 'jquery', 'https://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js');

wp_enqueue_script( 'jquery' );

}

}

add_action('init', 'autofocus_init_script');

// Set Up AutoFocus+ Pro
// - Tell WordPress to run af_setup() when the 'after_setup_theme' hook is run.
add_action( 'after_setup_theme', 'af_setup' );

if ( ! function_exists( 'af_setup' ) ):
function af_setup() {
// Define constants
define('STYLESHEET_DIR', get_bloginfo('stylesheet_directory'));
define('TEMPLATE_DIR', get_bloginfo('template_directory'));

// This theme styles the visual editor with editor-style.css to match the theme style.
add_editor_style();

// This theme uses post thumbnails
add_theme_support( 'post-thumbnails' );

// Add AutoFocus+ Pro Header
define( 'HEADER_TEXTCOLOR', '' );
// No CSS, just IMG call. The %s is a placeholder for the theme template directory URI.
define( 'HEADER_IMAGE', '%s/css/headers/path.jpg' );

// The height and width of your custom header. You can hook into the theme's own filters to change these values.
// Add a filter to twentyten_header_image_width and twentyten_header_image_height to change these values.
define( 'HEADER_IMAGE_WIDTH', apply_filters( 'af_header_image_width', 292 ) );
define( 'HEADER_IMAGE_HEIGHT', apply_filters( 'af_header_image_height', 50 ) );

// We'll be using post thumbnails for custom header images on posts and pages.
// We want them to be 50 pixels wide by 50 pixels tall.
// Larger images will be auto-cropped to fit, smaller ones will be ignored. See header.php.
set_post_thumbnail_size( HEADER_IMAGE_WIDTH, HEADER_IMAGE_HEIGHT, true );

// Add AutoFocus+ Pro Header styles for Admin
add_custom_image_header( '', 'af_admin_header_style' );

// Default custom headers packaged with the theme. %s is a placeholder for the theme template directory URI.
register_default_headers( array(
'autofocus' => array(
'url' => STYLESHEET_DIR . '/img/logo.png',
'thumbnail_url' => STYLESHEET_DIR . '/img/logo.png',
'description' => __( 'AutoFocus Logo', 'thematic' )
)
) );
}
endif;

// Add AutoFocus+ Pro Header styles for Admin
if ( ! function_exists( 'af_admin_header_style' ) ) :
function af_admin_header_style() {
global $options;
foreach ($options as $value) {
if (get_option( $value['id'] ) === FALSE) { $$value['id'] = $value['std']; } else { $$value['id'] = get_option( $value['id'] ); }
} ?>
<style type="text/css">
/* Shows the same border as on front end */
.appearance_page_custom-header #headimg {min-height:50px;border-width:0;padding:0;margin:0;background:#FFF;background-repeat:no-repeat;background-position:0 center;width:292px;margin:0 16px 0 0;float:left;clear:none;display:block;}
#headimg:hover {background-color:#<?php echo $af_hover_color; ?>;}
#headimg h1 {line-height:50px;position:relative;padding:0 0 0 50px;margin:0;}
#headimg #name {color:#<?php echo $af_hover_color; ?>;padding:0 8px;font-size:22px;font-weight:200;text-decoration:none;line-height:50px;font-family: "Garamond", "Hoefler Text", Times New Roman, Times, serif;}
#headimg:hover #name {color:#FFF;}
#headimg #desc {display:none;}
</style>
<?php }
endif;

// Set default content width for images in post content
$_GLOBALS['content_width'] = 494;

// Conditional test for IE6
function browser_ie6() {
$agents = array(
'MSIE 6.0'
);
foreach ($agents as $agent) {
if (strpos($_SERVER['HTTP_USER_AGENT'], $agent) or isset($_GET[$agent]) && $_GET[$agent] ) {
return true;
}
}
return false;
}

// Theme Options --------------------------------------------
$afthemename = "AutoFocus+ Pro";
$afshortname = "af";
$afoptions = array();

function autofocus_options() {
global $afthemename, $afshortname, $afoptions;
$af_categories_obj = get_categories('hide_empty=0');
$af_categories = array();
foreach ($af_categories_obj as $af_cat) {
$af_categories[$af_cat->cat_ID] = $af_cat->cat_name;
}
$categories_std = array_unshift($af_categories, "Select a category:");

$afoptions = array (

array( "name" => __( 'Layout', 'thematic'),
"desc" => __('Choose your layout options.','thematic'),
"type" => "subhead"),

array( "name" => __('Homepage','thematic'),
"desc" => __('Choose the Grid or Default layout','thematic'),
"id" => $afshortname."_layout",
"std" => "grid",
"childoptions" => array(
'grid' => __( ' GRID: Shows a square grid of images on the home page.' ),
'default' => __( ' DEFAULT: Shows a staggered grid of images on the home page with excerpts.' )
),
"type" => "radio"),

array( "name" => __('Sliding Feature Area','thematic'),
"desc" => __('Show a sliding featured content area?','thematic'),
"id" => $afshortname."_sliding_sticky_area",
"std" => "false",
"type" => "checkbox"),

array( "name" => __( 'Settings', 'thematic'),
"desc" => __('Define your color and display options.','thematic'),
"type" => "subhead"),

array( "name" => __('Text Color'),
"desc" => __('Change the color of text, borders and link hover states by entering a HEX color number. (ie: <span style="font-family:Monaco,Lucida Console,Courier,monospace;">003333</span>)','thematic'),
"id" => $afshortname."_text_color",
"std" => "999999",
"type" => "colorpicker"),

array( "name" => __('Link Color','thematic'),
"desc" => __('Change the color of anchor links by entering a HEX color number. (ie: <span style="font-family:Monaco,Lucida Console,Courier,monospace;">FF6600</span>)','thematic'),
"id" => $afshortname."_link_color",
"std" => "00CCFF",
"type" => "colorpicker"),

array( "name" => __('Background Color','thematic'),
"desc" => __('Change the background color by entering a HEX color number. (ie: <span style="font-family:Monaco,Lucida Console,Courier,monospace;">FF6600</span>)','thematic'),
"id" => $afshortname."_bg_color",
"std" => "FFFFFF",
"type" => "colorpicker"),

array( "name" => __('Photo Background Color','thematic'),
"desc" => __('Change the background color of Portrait (narrow) images on Single Pages by entering a HEX color number. (ie: <span style="font-family:Monaco,Lucida Console,Courier,monospace;">FF6600</span>)','thematic'),
"id" => $afshortname."_photo_color",
"std" => "F0F0F0",
"type" => "colorpicker"),

array( "name" => __('Blog Category','thematic'),
"desc" => __('Select a post category to be shown in the Blog Template and excluded from the Front Page.','thematic'),
"id" => $afshortname."_blog_cat",
"std" => $categories_std,
"type" => "select",
"options" => $af_categories),

array( "name" => __('Post Title & Date Display','thematic'),
"desc" => __("Display a randomized sliding featured/sticky post section on the home page.",'thematic'),
"id" => $afshortname."_title_date",
"std" => "titledate",
"childoptions" => array(
'titledate' => __( ' Show the Title & on hover, show the Date).' ),
'datetitle' => __( ' Show the Date & on hover, show the Title).' ),
'title' => __( ' Show the Title on hover only. (Also removes dates from single Photo pages)' ),
'date' => __( ' Show the Date on hover only.' )
),
"type" => "radio"),

array( "name" => __('Show Exif data','thematic'),
"desc" => __('Add a check here to show the Exif data for your images on attachment pages (WP Gallery Images only).','thematic'),
"id" => $afshortname."_show_exif_data",
"std" => "false",
"type" => "checkbox"),

array( "name" => __('Add Fancybox (Lightbox)','thematic'),
"desc" => __('Add a check here to use Fancybox within the [gallery] on single pages. (http://fancybox.net/).','thematic'),
"id" => $afshortname."_fancybox",
"std" => "false",
"type" => "checkbox"),

array( "name" => __( 'Flickr', 'thematic'),
"desc" => __('Connect to your Flickr account using the settings below. A working Flickr account is required and all fields below must be filled. <br />Follow <a href="http://fthrwght.com/autofocus/#flickrapi" target="_blank">these instructions</a> to get your Flickr API and Secret Keys.','thematic'),
"type" => "subhead"),

array( "name" => __('Flickr Username','thematic'),
"desc" => __('Change the color of hover links by entering a HEX color number. (ie: <span style="font-family:Monaco,Lucida Console,Courier,monospace;">FF6600</span>)','thematic'),
"id" => $afshortname."_flickr_username",
"std" => "Insert Flickr Username",
"type" => "text"),

array( "name" => __('Flickr API Key','thematic'),
"desc" => __('Change the color of hover links by entering a HEX color number. (ie: <span style="font-family:Monaco,Lucida Console,Courier,monospace;">FF6600</span>)','thematic'),
"id" => $afshortname."_flickr_api_key",
"std" => "Insert Flickr API Key",
"type" => "text"),

array( "name" => __('Flickr Secret Key','thematic'),
"desc" => __('Change the color of hover links by entering a HEX color number. (ie: <span style="font-family:Monaco,Lucida Console,Courier,monospace;">FF6600</span>)','thematic'),
"id" => $afshortname."_flickr_secret_key",
"std" => "Insert Flickr Secret Key",
"type" => "text")

);
}
add_action('init', 'autofocus_options');

// Make a Theme Options Page
function af_add_admin() {

global $afthemename, $afshortname, $afoptions;

if ( $_GET['page'] == basename(__FILE__) ) {

if ( 'save' == $_REQUEST['action'] ) {

foreach ($afoptions as $afvalue) {
update_option( $afvalue['id'], $_REQUEST[ $afvalue['id'] ] ); }

foreach ($afoptions as $afvalue) {
if( isset( $_REQUEST[ $afvalue['id'] ] ) ) { update_option( $afvalue['id'], $_REQUEST[ $afvalue['id'] ] ); } else { delete_option( $afvalue['id'] ); } }

header("Location: themes.php?page=functions.php&saved=true");
die;

} else if( 'reset' == $_REQUEST['action'] ) {

foreach ($afoptions as $afvalue) {
delete_option( $afvalue['id'] ); }

header("Location: themes.php?page=functions.php&reset=true");
die;

}
}

add_theme_page($afthemename." Options", "$afthemename Options", 'edit_themes', basename(__FILE__), 'af_admin');

}

function af_admin() {

global $afthemename, $afshortname, $afoptions;

if ( $_REQUEST['saved'] ) echo '<div id="message" class="updated fade"><p><strong>'.$afthemename.' settings saved.</strong></p></div>';
if ( $_REQUEST['reset'] ) echo '<div id="message" class="updated fade"><p><strong>'.$afthemename.' settings reset.</strong></p></div>';

?>
<script language="javascript" type="text/javascript" src="<?php echo bloginfo('stylesheet_directory') ?>/js/jscolor/jscolor.js"></script>
<div class="wrap">
<h2><?php echo $afthemename; ?> Options</h2>

<form method="post">

<table class="form-table">

<?php foreach ($afoptions as $afvalue) {

switch ( $afvalue['type'] ) {

case 'text':
?>
<tr valign="top">
<th scope="row"><?php echo $afvalue['name']; ?>:</th>
<td>
<input name="<?php echo $afvalue['id']; ?>" id="<?php echo $afvalue['id']; ?>" type="<?php echo $afvalue['type']; ?>" value="<?php if ( get_option( $afvalue['id'] ) != "") { echo get_option( $afvalue['id'] ); } else { echo $afvalue['std']; } ?>" />
<?php echo $afvalue['desc']; ?>
</td>
</tr>
<?php
break;

case 'subhead':
?>
<tr valign="top" style="border-top:1px solid #DDD;margin-top:30px;">
<th scope="row"><h3><?php echo $afvalue['name']; ?></h3></th>
<td style="padding-top:24px;font-style:italic;">
<?php echo $afvalue['desc']; ?>
</td>
</tr>
<?php
break;

case 'colorpicker':
?>
<tr valign="top">
<th scope="row"><label for="<?php echo $afvalue['id']; ?>"><?php echo __($afvalue['name'],'thematic'); ?></label></th>
<td>
<input type="<?php echo $afvalue['type']; ?>" name="<?php echo $afvalue['id']; ?>" id="<?php echo $afvalue['id']; ?>" value="<?php if ( get_option( $afvalue['id'] ) != "") { echo get_option( $afvalue['id'] ); } else { echo $afvalue['std']; } ?>" class="color {pickerPosition:'right'}" />
<?php echo __($afvalue['desc'],'thematic'); ?>

</td>
</tr>
<?php
break;

case 'select':
?>
<tr valign="top">
<th scope="row"><?php echo $afvalue['name']; ?></th>
<td>
<select name="<?php echo $afvalue['id']; ?>" id="<?php echo $afvalue['id']; ?>">
<?php foreach ($afvalue['options'] as $option) { ?>
<option<?php if ( get_option( $afvalue['id'] ) == $option) { echo ' selected="selected"'; } elseif ($option == $afvalue['std']) { echo ' selected="selected"'; } ?>><?php echo $option; ?></option>
<?php } ?>
</select>
<?php echo $afvalue['desc']; ?>
</td>
</tr>
<?php
break;

case 'textarea':
$ta_options = $afvalue['options'];
?>
<tr valign="top">
<th scope="row"><?php echo $afvalue['name']; ?>:</th>
<td>
<?php echo $afvalue['desc']; ?>
<textarea name="<?php echo $afvalue['id']; ?>" id="<?php echo $afvalue['id']; ?>" cols="<?php echo $ta_options['cols']; ?>" rows="<?php echo $ta_options['rows']; ?>"><?php
if( get_option($afvalue['id']) != "") {
echo stripslashes(get_option($afvalue['id']));
}else{
echo $afvalue['std'];
}?></textarea>
</td>
</tr>
<?php
break;

case "radio":
?>
<tr valign="top">
<th scope="row"><?php echo $afvalue['name']; ?></th>
<td>
<?php foreach ($afvalue['childoptions'] as $key=>$option) {
$radio_setting = get_option($afvalue['id']);
if($radio_setting != ''){
if ($key == get_option($afvalue['id']) ) {
$checked = "checked=\"checked\"";
} else {
$checked = "";
}
}else{
if($key == $afvalue['std']){
$checked = "checked=\"checked\"";
}else{
$checked = "";
}
}?>
<input type="radio" name="<?php echo $afvalue['id']; ?>" value="<?php echo $key; ?>" <?php echo $checked; ?> /><?php echo $option; ?><br />
<?php } ?>
</td>
</tr>
<?php
break;

case "checkbox":
?>
<tr valign="top">
<th scope="row"><?php echo $afvalue['name']; ?></th>
<td>
<?php
if(get_option($afvalue['id'])){
$checked = "checked=\"checked\"";
}else{
$checked = "";
}
?>
<input type="checkbox" name="<?php echo $afvalue['id']; ?>" id="<?php echo $afvalue['id']; ?>" value="true" <?php echo $checked; ?> />
<?php ?>
<?php echo $afvalue['desc']; ?>
</td>
</tr>
<?php
break;

default:

break;
}
}
?>

</table>

<p class="submit">
<input name="save" type="submit" value="Save changes" />
<input type="hidden" name="action" value="save" />
</p>
</form>
<form method="post">
<p class="submit">
<input name="reset" type="submit" value="Reset" />
<input type="hidden" name="action" value="reset" />
</p>
</form>

<p><?php _e('For more information about this theme, visit the <a href="http://fthrwght.com/autofocus">documentation page</a>. If you have any questions, check out <a href="http://wpquestions.com/">WPQuestions.com</a>.', 'thematic'); ?></p>

<?php }
add_action('admin_menu' , 'af_add_admin');

// Add Thematic Body and Post Classes, Comment form classes & RSS links
define('THEMATIC_COMPATIBLE_BODY_CLASS', true);
define('THEMATIC_COMPATIBLE_POST_CLASS', true);
define('THEMATIC_COMPATIBLE_COMMENT_FORM', true);
define('THEMATIC_COMPATIBLE_FEEDLINKS', true);

// Load AutoFocus Post & Meta Options
require_once(STYLESHEETPATH . '/extensions/autofocus-settings.php');

// Load AutoFocus Post & Meta Options
require_once(STYLESHEETPATH . '/extensions/autofocus-post-meta.php');

// Load phpFlickr
require_once(STYLESHEETPATH . '/extensions/phpFlickr.php');

// Load AF+ Flickr Integration
require_once(STYLESHEETPATH . '/extensions/autofocus-flickr.php');

// Load Thematic Functions
require_once(STYLESHEETPATH . '/extensions/thematic-functions.php');

// Load Color Options
function af_load_color_options() {
global $afoptions;
foreach ($afoptions as $afvalue) {
if (isset($afvalue['id']) && get_option( $afvalue['id'] ) === FALSE && isset($afvalue['std'])) { $$afvalue['id'] = $afvalue['std']; }
elseif (isset($afvalue['id'])) { $$afvalue['id'] = get_option( $afvalue['id'] ); }
} ?>
<style type="text/css">
/* <![CDATA[ */
/* AutoFocus+ Pro Colors */
<?php $afcoloroptions = dirname( __FILE__ ) . '/css/af-styles.php'; if( is_file( $afcoloroptions ) ) require $afcoloroptions; ?>

/* ]]> */
</style>

<?php }
add_action('wp_head', 'af_load_color_options');

// Load JS Options
function af_load_js_options() {
global $afoptions, $post;
foreach ($afoptions as $afvalue) {
if (isset($afvalue['id']) && get_option( $afvalue['id'] ) === FALSE && isset($afvalue['std'])) { $$afvalue['id'] = $afvalue['std']; }
elseif (isset($afvalue['id'])) { $$afvalue['id'] = get_option( $afvalue['id'] ); }
} ?>
<script type="text/javascript">
/* <![CDATA[ */
/* AutoFocus+ Pro JS Options */
<?php $afjsoptions = dirname( __FILE__ ) . '/js/af-optional-scripts.php'; if( is_file( $afjsoptions ) ) require $afjsoptions; ?>

/* ]]> */
</script>

<?php }
add_action('wp_head', 'af_load_js_options');

// Add custom Plugins and Styles on NON-admin pages.
function af_enqueue_styles() {
global $afoptions;
foreach ($afoptions as $afvalue) {
if (isset($afvalue['id']) && get_option( $afvalue['id'] ) === FALSE && isset($afvalue['std'])) { $$afvalue['id'] = $afvalue['std']; }
elseif (isset($afvalue['id'])) { $$afvalue['id'] = get_option( $afvalue['id'] ); }
}

if ( !is_admin() ) { // Is this necessary?

if ($af_sliding_sticky_area == 'true' && $af_layout == 'default' ) {
wp_enqueue_style('afdefaultslider', STYLESHEET_DIR . '/css/default-slider-layout.css','','20100629','all');
} elseif ( $af_layout == 'default' ) {
wp_enqueue_style('afdefault', STYLESHEET_DIR . '/css/default-layout.css','','20100329','all');
} elseif ( $af_layout == 'grid' ) {
wp_enqueue_style('afportfolio', STYLESHEET_DIR . '/css/portfolio-layout.css','','20100610','all');
}

// Add Fancybox styles to single pages if the option is turned on
if ( $af_fancybox == 'true' ) {
wp_enqueue_style('fancyboxstyles', STYLESHEET_DIR . '/js/fancybox/jquery.fancybox-1.3.1.css','','1.3.1','all');
}

// BOO IE6! :-/
wp_enqueue_style('afiestyles', STYLESHEET_DIR . '/css/ie-styles.css','','20100329','all');
}
}
add_action('init', 'af_enqueue_styles');

// Add custom JS & jQuery scripts on NON-admin pages.
function af_enqueue_scripts() {
global $afoptions;
foreach ($afoptions as $afvalue) {
if (isset($afvalue['id']) && get_option( $afvalue['id'] ) === FALSE && isset($afvalue['std'])) { $$afvalue['id'] = $afvalue['std']; }
elseif (isset($afvalue['id'])) { $$afvalue['id'] = get_option( $afvalue['id'] ); }
}

if ( !is_admin() ) { // Is this necessary?
if( !browser_ie6() ) {
wp_enqueue_script('imgCenter', STYLESHEET_DIR . '/js/jquery.imgCenter.minified.js', array('jquery'), '1.0' );
wp_enqueue_script('hotkeys', STYLESHEET_DIR . '/js/jquery.hotkeys-0.7.9.min.js', array('jquery'), '0.7.9' );
wp_enqueue_script('easing', STYLESHEET_DIR . '/js/jquery.easing-1.3.pack.js', array('jquery'), '1.3' );
wp_enqueue_script('anythingslider', STYLESHEET_DIR . '/js/jquery.anythingslider.js', array('jquery', 'easing'), '1.2' );
// Add Fancybox script to single pages if the option is turned on
if (is_single() && ( $af_fancybox == 'true' ) ) {
wp_enqueue_script('fancybox', STYLESHEET_DIR . '/js/fancybox/jquery.fancybox-1.3.1.pack.js', array('jquery', 'easing'), '1.3.1' );
}
wp_enqueue_script('autofocusjs', STYLESHEET_DIR . '/js/afscripts.js', array('jquery', 'anythingslider', 'hotkeys', 'imgCenter'), '1.4' );
}
}
}
add_action('wp_print_scripts', 'af_enqueue_scripts');

?>


Denzel Chia comments:

Hi,

Clear your WP cache plugin's cache.
Your blog is still showing the old cache page!
You are adding the code correctly.

Thanks

Denzel Chia comments:

Hi,

This page is not cached http://cynthiapcaster.org/wordpress/archives/68
so slider and fancybox is working.

Your homepage is cached, so you need to clear it, so that new code gets updated and shown in browser.

Thanks.

Daniel Marsden comments:

Thanks Denzel,

The wp-cache plugin has been more of a hinderance than a help. I went to the "wp-cache" options screen under "Settings" and manually cleared the cache. Then I disabled the wp-cache plugin for good. I feel like such a wordpress noob.

Going to award you the winner now Denzel. Thanks again for your help!

Denzel Chia comments:

To expert Ms Vidyut Kale;

For your info hashgrid.js is
<blockquote>
A little tool that inserts a layout grid in web pages, allows you to hold it in place, and toggle between displaying it in the foreground or background.
</blockquote>

Here is the github project https://github.com/dotjay/hashgrid
Here is the homepage http://hashgrid.com/

Nothing to do with this Question.

Thanks.