在Wordpress上手动安装Nivoslider无效 [英] Manual install of nivoslider on wordpress not working

查看:109
本文介绍了在Wordpress上手动安装Nivoslider无效的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我正在尝试将nivoslider手动安装到wordpress主题,因此我可以将nivoslider作为选项添加到主题选项面板.最初,我只需要使用它即可处理硬编码图像,但我不断收到此js错误$(#slider").nivoSlider不是函数.

I am trying to manually install nivoslider to a wordpress theme so I can add nivoslider as an option to the theme options panel. Initially I just need it to work with hard coded images but I keep getting this js error $("#slider").nivoSlider is not a function.

包括了Nivo滑块,并且该路径正与jquery版本1.7.1一样适用于该文件.这两个文件路径都可以使用,因此包含了所有必需的js.在浏览器中渲染后,我将整个标头粘贴到下面.文件路径是本地的,因此无法在外部访问

Nivo slider is included and the path is working to the file as is jquery version 1.7.1. Both paths to files are working so all the necessary js is included. I'll paste the whole header below after render in the browser. The filepaths are local so won't be accesible externally

<?php
/**
 * The Header for our theme.
 *
 * Displays all of the <head> section and everything up till <div id="main">
 *
 * @package WordPress
 * @subpackage GPSite
 * @since Starkers 3.0
 */
global $theme_shortname;
global $mm;
$mm = get_option($theme_shortname."_maintenance_mode");

// If maintenance mode is on and we're not on the homepage, then redirect to the homepage
if($mm && !is_front_page() && !current_user_can('level_10')) {
  //wp_redirect( get_bloginfo("url") );
}
?>
<!DOCTYPE html>
<html <?php language_attributes(); ?>>
<head>
<meta charset="<?php bloginfo( 'charset' ); ?>" />
<title><?php wp_title( '&nbsp;', true, 'right' ); ?></title>


<!-- For iPhone 4 -->
<link rel="apple-touch-icon-precomposed" sizes="114x114" href="<?php bloginfo("template_url"); ?>/images/apple-touch-icon-114.png">
<!-- For iPad 1-->
<link rel="apple-touch-icon-precomposed" sizes="72x72" href="<?php bloginfo("template_url"); ?>/images/apple-touch-icon-72.png">
<!-- For iPhone 3G, iPod Touch and Android -->
<link rel="apple-touch-icon-precomposed" href="<?php bloginfo("template_url"); ?>/images/apple-touch-icon-64.png">
<!-- For Nokia -->
<link rel="shortcut icon" href="<?php bloginfo("template_url"); ?>/images/apple-touch-icon-64.png">
<!-- For everything else -->
<link rel="shortcut icon" href="<?php bloginfo("template_url"); ?>/images/favicon.ico">

<?php
if(class_exists("MultiPostThumbnails") && (is_single() || is_page()))
{
    if(MultiPostThumbnails::has_post_thumbnail($post->post_type, 'secondary-image'))
    {
        $thumbnail = wp_get_attachment_image_src ( MultiPostThumbnails::get_post_thumbnail_id ($post->post_type, "secondary-image", $post->ID ),array(1024,9999));
        ?>
<style type="text/css">
#top
{
    background-image: url("<?php print $thumbnail[0];?>") !important;
    background-position: 50% 0;
    background-repeat: no-repeat;
}
</style>
        <?php

    }
}


?>

<?php
/*
<link rel="stylesheet" type="text/css" media="all" href="<?php bloginfo( 'stylesheet_url' ); ?>" />
<link type="text/css" rel="stylesheet" media="print" href="<?php print get_bloginfo("template_url")."/css/print.css"; ?>" />
 * */

if($_COOKIE['high_contrast'])
{
    ?>
    <link id="high-contrast-stylesheet" type="text/css" title="high-contrast" rel="stylesheet" href="<?php print get_bloginfo("template_url")."/css/high-contrast.css"; ?>" >
    <?php
}
?>

<!-- http://t.co/dKP3o1e -->
<meta name="HandheldFriendly" content="True">
<meta name="MobileOptimized" content="320">
<meta name="viewport" content="width=device-width, target-densitydpi=160dpi, initial-scale=1.0">

<!-- For all browsers -->
<link rel="stylesheet" href="<?php bloginfo( 'stylesheet_url' ); ?>">
<link rel="stylesheet" media="print" href="<?php bloginfo("template_url"); ?>/css/print.css">

<!-- For progressively larger displays -->

<link rel="stylesheet" href="<?php bloginfo("template_url"); ?>/css/992.css">
<?php
/* WHEN RESPOND IS WORKING USE THIS
<!-- For progressively larger displays -->
<link rel="stylesheet" media="only screen and (min-width: 480px)" href="<?php bloginfo("template_url"); ?>/css/480.css">
<link rel="stylesheet" media="only screen and (min-width: 600px)" href="<?php bloginfo("template_url"); ?>/css/600.css">
<link rel="stylesheet" media="only screen and (min-width: 768px)" href="<?php bloginfo("template_url"); ?>/css/768.css">
<link rel="stylesheet" media="only screen and (min-width: 992px)" href="<?php bloginfo("template_url"); ?>/css/992.css">
*/
?>
<?php
/*
 * <!-- For Retina displays -->
<link rel="stylesheet" media="only screen and (-webkit-min-device-pixel-ratio: 1.5), only screen and (-o-min-device-pixel-ratio: 3/2), only screen and (min-device-pixel-ratio: 1.5)" href="css/2x.css">
*/
?>
<link rel="pingback" href="<?php bloginfo( 'pingback_url' ); ?>" />
<script type="text/javascript" src="<?php bloginfo("template_url"); ?>/js/modernizr-1.5.min.js"></script>
<?php wp_enqueue_script("jquery"); ?>
<?php
    /* We add some JavaScript to pages with the comment form
     * to support sites with threaded comments (when in use).
     */
    if ( is_singular() && get_option( 'thread_comments' ) )
        wp_enqueue_script( 'comment-reply' );

    /* Always have wp_head() just before the closing </head>
     * tag of your theme, or you will break many plugins, which
     * generally use this hook to add elements to <head> such
     * as styles, scripts, and meta tags.
     */
    wp_head();
?>
<script type="text/javascript">
jQuery(window).load(function() {
    jQuery('#slider').nivoSlider({
        effect:'random', //Specify sets like: 'fold,fade,sliceDown'
        slices:15,
        animSpeed:500, //Slide transition speed
        pauseTime:5000,
        startSlide:0, //Set starting Slide (0 index)
        directionNav:true, //Next & Prev
        directionNavHide:true, //Only show on hover
        controlNav:true, //1,2,3…
        keyboardNav:true, //Use left & right arrows
        pauseOnHover:true, //Stop animation while hovering
        captionOpacity:0.8 //Universal caption opacity
    });
});
</script>
</head>
<!--[if lt IE 7 ]> <body <?php body_class("ltie7"); ?>> <![endif]-->
<!--[if IE 7 ]>    <body <?php body_class("ie7"); ?>> <![endif]-->
<!--[if IE 8 ]>    <body <?php body_class("ie8"); ?>> <![endif]-->
<!--[if IE 9 ]>    <body <?php body_class("ie9"); ?>> <![endif]-->
<!--[if (gt IE 9)|!(IE)]><!--> <body <?php body_class(); ?>> <!--<![endif]-->
<!--<div class="push">-->
<div class="wrapper">
    <header id="top">

        <div class="inner">
            <div id="slider" class="nivoSlider">
                <img src="http://192.168.200.74/~wadem/gpsite/slide.png" alt="Slide 1" width="957" height="280" />
                <img src="images/slide2.jpg" alt=""  />
            </div>

页面上安装了两个版本的jquery,它们相互冲突.首先要了解的是nivo滑块.一位老开发人员在页脚中保留了一个旧版本,这意味着jquery正在$和jQuery上运行,而nivoslider显然并不喜欢.

There were 2 versions of jquery installed on the page conflicting with each other. The first thing to pick this up was nivo slider. An old developer left in a legacy version in the footer meaning jquery was running from $ and jQuery which apparently nivoslider really doesnt like.

完全愚蠢,我无法自己回答问题. Juset最终在我的帐户上出现更多问题,但仍未得到解答.整理出来

Totally stupid I cant jsut answer the questions myself. Juset end up with more questions on my account unanswered. Sort it out

推荐答案

页面上安装了两个版本的jquery,它们相互冲突.首先要了解的是nivo滑块.一位老开发人员在页脚中保留了一个旧版本,这意味着jquery正在$和jQuery上运行,这显然是nivoslider真正讨厌的

There were 2 versions of jquery installed on the page conflicting with each other. The first thing to pick this up was nivo slider. An old developer left in a legacy version in the footer meaning jquery was running from $ and jQuery which apparently nivoslider really hates

这篇关于在Wordpress上手动安装Nivoslider无效的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆