Question

我在wordpress网站上有下拉菜单。

问题是只有当我登录到wp-admin时才会看到下拉选项a。我发现没有为未登录的客户加载一些主题JS。我找不到原因。

我的菜单结构如下：

在记录用户的实践中：

对于未记录的用户下拉列表（由红色选择）不可见。

我发现它的逻辑是在theme.js中，而不是以某种方式没有为logger用户加载。

我的function.php看起来像：

function csp_scripts() {
    wp_enqueue_style('google-font','http://fonts.googleapis.com/css?family=Open+Sans:300,400,500,600,700');

    wp_enqueue_style( 'bootstrap', get_template_directory_uri() . '/css/bootstrap.css' );

    wp_enqueue_style( 'csp-style', get_stylesheet_uri() );


    wp_enqueue_script('jquery');

    wp_enqueue_script( 'modernizr', get_template_directory_uri() . '/js/modernizr.js', array(), '20120206', false );

    wp_enqueue_script('bootstrap-js',get_template_directory_uri() . '/js/bootstrap.min.js',array('jquery'),false);

    wp_enqueue_script( 'jquery_validate', get_template_directory_uri() . '/js/jquery.validate.min.js', array( 'jquery' ) );

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

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

    if ( is_singular() && comments_open() && get_option( 'thread_comments' ) ) {
        wp_enqueue_script( 'comment-reply' );
    }
}
add_action( 'wp_enqueue_scripts', 'csp_scripts' );




 /**
  * CSP Hooks
  * 
  */
 function csp_inside_head() {
    do_action('csp_add_inside_head');
 }

 function csp_add_inside_head() {

 }

csp_scripts包括

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

我不知道应该在哪里使用它也包括未登录的用户。

我的标题模板代码：

<?php
/**
 * The Header for our theme.
 *
 * Displays all of the <head> section and everything up to <nav id="menu">
 *
 */
$options = TitanFramework::getInstance( 'csp-theme' );

 ?>
<!DOCTYPE html>
<html <?php language_attributes(); ?>>
<head>
<meta charset="<?php bloginfo( 'charset' ); ?>" />
<meta name="viewport" content="width=device-width, maximum-scale=1.0, minimum-scale=1.0, initial-scale=1.0">
<link rel="profile" href="http://gmpg.org/xfn/11">
<link rel="pingback" href="<?php bloginfo( 'pingback_url' ); ?>">

<?php   
    //Start Wordpress
    wp_head();

    echo $options->getOption('header_code_js');
    echo '<script type="text/css" rel="stylesheet">';
        echo $options->getOption('header_code_css');
    echo '</script>';

?>

</head>


<!-- NAVBAR
================================================== -->
<?php if(is_front_page()): ?>
<body <?php body_class(); ?> >
<?php else: ?>
<body <?php body_class('interior'); ?> >
<?php endif; ?>
    <div class="navbar-wrapper super-main-wrapper">

        <!-- Secondary Navigation Bar -->
        <div id="secondary-nav" class="no-margin-bottom">
          <div class="container">

            <!-- Social Media Buttons/Icons -->
            <div class="navbar-caption">
                <!-- <ul class="nav"> -->
                    <span class="secondary-caption">
                        <h3 class="hidden-xs"><?php echo $options->getOption('header_text'); ?></h3>
                        <h3 class="visible-xs"><?php echo $options->getOption('header_text_mobile'); ?></h3>
                    </span>
                <!-- </ul> -->
            </div>

          </div>
        </div>

        <!-- Main Navigation Bar -->
        <div id="main-nav" class="navbar navbar-static-top">

            <div class="container">
                <div class="col-lg-4 col-md-4 col-sm-4 col-xs-12 logo-container">

                    <?php
                    $imageID = $options->getOption( 'site_logo' );

                    $imageSrc = $imageID;
                    if ( is_numeric( $imageID ) ) {
                        $imageAttachment = wp_get_attachment_image_src( $imageID,'full');
                        $imageSrc = $imageAttachment[0];
                        //print_r($imageAttachment);
                    }
                    else {
                        $imageSrc =get_template_directory_uri() .'/images/logo.png';
                    }

                    ?>

                    <a href="<?php echo home_url(); ?>" class=""><img src="<?php echo $imageSrc ?>" class="logo" /></a>
                    <!-- <a href="<?php echo home_url(); ?>" class="visible-xs visible-sm"><img src="<?php echo get_template_directory_uri(); ?>/images/logo.png" class="logo" /></a> -->
                </div>  
                <div class="visible-xs col-xs-12 navbar-header">
                  <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
                    <div class="icon-bars pull-left">
                        <span class="icon-bar"></span>
                        <span class="icon-bar"></span>
                        <span class="icon-bar"></span>
                    </div>
                    <div class="icon-text pull-left">
                        &nbsp;&nbsp;Main Menu
                    </div>
                  </button>
                </div>              

                <!-- Navigation Dropdown Menu -->
                <div class="col-lg-8 col-md-8 col-sm-8 col-xs-12 navbar-collapse collapse">

                    <div class="navbar-wrapper container">
                        <?php  echo csp_display_menu('main-menu'); ?>


                    </div>

                </div>

            </div> <!-- /.container --> 

        </div> <!-- /#main-nav -->

    </div>  <!-- /.navbar-wrapper -->

有人能指出我如何以正确的方式解决问题吗？

theme.js：

/*  
    Theme JS  

    @author:    Sada Garba
    @date:      September 20, 2013

    @description: Main JS file for Cool Springs Chiro' standard template

    @dependency:  jQuery must be imported on the page before this file

*/

//Global Namespace Object
var CSP = {

    //Global Attributes
    jq:     null,

    options: null,

    //Initialization Function
    init:   function(jqObj) {
                console.log("Initializing...");

                var self = this;

                //assign object wide reference to jQuery
                self.jq = jqObj;

                var jq = self.jq;

                //setup the dropdown Hover Intent
                jqObj(".nav .dropdown").on('show.bs.dropdown', function(e) {
                        var culprit = jqObj(this);
                        culprit.find(".dropdown-menu")
                            .css("opacity", 0)
                            .animate({ opacity: 1 } , 700);
                    }).on('hide.bs.dropdown', function(){
                        var culprit = jqObj(this);
                        culprit.find(".dropdown-menu")
                            .animate({ opacity: 0 } , 400);
                    }).hover( function(){
                            var culprit = jqObj(this);

                            this.myTimeout = setTimeout(function() {
                                    if(!culprit.hasClass("open")) culprit.find(".dropdown-toggle").dropdown("toggle");
                                    //console.log("Did I toggle?");
                                }, 300);

                        }, function() {
                            var culprit = jqObj(this);
                            clearTimeout(this.myTimeout);
                            delete this.myTimeout;
                            if(culprit.hasClass("open")) culprit.find(".dropdown-toggle").delay(500).dropdown("toggle");
                        }
                );

                //locate any nav-tabs and activate the first element
                jqObj(".nav-tabs a:first").tab("show");

                //locate any popovers and enable/initialize them
                jqObj(".roster-popover").popover({

                });

                //locate any content sliders and activate them
                /* if(jqObj(".program-carousel-wrapper").contentSlider) {
                    jqObj(".program-carousel-wrapper").contentSlider({
                        paged: true,
                        //startIndex: 2
                    });
                } */

                //Slider Carousel initialization

                jqObj('.carousel').carousel({       //should be $(...).carousel/bannerStream
                    interval: 6000,
                    pause: false
                });

                //locate any video launchers and initialize/activate
                /* jqObj(".video-launcher").each(function(idx, val) {
                    val = jqObj(val);

                    val.on("click", function(e) {
                        console.log("...launcher clicked...");
                        var vurl = val.attr("data-video-url"),
                            vcontainer = val.attr("data-video-container");
                        self._launchVideo(vcontainer, vurl);
                    });

                }); */

                //Add Window Resize Listener
                jqObj(window).on("resize", function(e) {
                    self._handleWindowResize(e);
                });

                this._handleWindowResize();

                //If Modernizer.touch initializations
                /* 
                if(Modernizr.touch) {
                    this.touchInit(jqObj);
                } 
                */

            },

    touchInit:  function(jqObj) {

                    var touchHandler = function(event) {
                        //Touch Event Capabilities to jQuery-UI elements

                        /*
                        * picked from http://stackoverflow.com/questions/5186441/javascript-drag-and-drop-for-touch-devices
                        *
                        */

                        // trick to add support for touch event to elements/widgets that do not support it
                        // by converting convert touchevents into mouseevents

                        // only apply this trick to ui-draggable elements
                        if ( ! jqObj(event.target).hasClass('ui-draggable') ) {
                            return;
                        }

                        var touches = event.changedTouches,
                            first = touches[0],
                            type = "";

                        switch(event.type) {
                            case "touchstart": type = "mousedown"; break;
                            case "touchmove": type="mousemove"; break;
                            case "touchend": type="mouseup"; break;
                            default: return;
                        }

                        // convert touchevents into mouseevents
                        var simulatedEvent = document.createEvent("MouseEvent");

                        simulatedEvent.initMouseEvent(type, true, true, window, 1,
                                                        first.screenX, first.screenY,
                                                        first.clientX, first.clientY, false,
                                                        false, false, false, 0/*left*/, null);

                        first.target.dispatchEvent(simulatedEvent);
                        event.preventDefault();
                    }

                    // faster links for touch devices
                    // by wiring directly touchend event as if it was a click (and disabling click handler)

                    //console.log("touch initializer called");
                    var links = document.getElementsByTagName("a");

                    for (var i=0; i < links.length; i++) {
                        var link = links[i];
                        if ( link.href !== undefined && link.href !== '') {
                            link.addEventListener("click", function(e) {
                                e.preventDefault();
                            });
                            link.addEventListener("touchend", function() {
                                document.location = this.href;
                            });
                        }
                    };

                    // listen to touch events and provide support to them where needed
                    document.addEventListener("touchstart", touchHandler, true);
                    document.addEventListener("touchmove", touchHandler, true);
                    document.addEventListener("touchend", touchHandler, true);
                    document.addEventListener("touchcancel", touchHandler, true);
                },

    _handleWindowResize:    function(e) {
                                var jq = this.jq || null;
                                var overlayCaption = false; //this is the default ...carousel overlays the slider
                                                            //images in the carousel

                                if(jq) {
                                    //find any carousels on the page and adjust height

                                    /* jq(".jq-monitor.carousel .item.active > img").each(function(idx, elem) {
                                        //console.log(elem, ":", jq(elem).height());
                                        var parentItem = jq(elem).parent();
                                        var newHeight = jq(elem).height();
                                        var captionItem = parentItem.find(".carousel-caption");
                                        //console.log("captionItem", elem, captionItem.innerWidth(), jq(elem).width());

                                        if( (captionItem.innerWidth() === jq(elem).width()) && (overlayCaption === false) ) {
                                            newHeight += captionItem.innerHeight();
                                        }
                                        var itemWrappers = parentItem.parent().find(".item");
                                        if(newHeight > 0) itemWrappers.height(newHeight);
                                    }); */

                                    //find any hero images that need height's adjusted

                                    jq(".no-carousel-layout .hero .item.large").each(function(idx, elem) {
                                        var parentItem = jq(elem).parent(),
                                            parentHeight = parentItem.height(),
                                            parentWidth = parentItem.width();
                                        //console.log("hero item height: ", parentHeight);
                                        //console.log("hero width: ", parentWidth);

                                        if(parentWidth > 970) {
                                            var availHeight = (parentItem.find(".item.small").height() * 2) - jq(elem).find(".item-image").height();
                                            var diff = (parentItem.find(".item.small").innerHeight() - parentItem.find(".item.small").height()) / 2;
                                            //console.log(parentItem.find(".item.small").innerHeight());
                                            //console.log(jq(elem).find(".item-image").height());
                                            //console.log(jq(elem).find(".item-image").innerHeight());

                                            jq(elem).find(".item-summary").height(availHeight + diff);
                                        }
                                    });


                                } else {
                                    if(typeof console !== "undefined") console.log("jq Error: Not set to jQuery object");
                                }
                            },

};

//JQuery onReady event handler
jQuery(document).ready(function($j){

    S = CSP;

    //Call initialization function
    S.init($j);


});


//Helper Functions'


(function($){
    var adminBar=$('body').find('#wpadminbar');
    console.log(adminBar);
}(jQuery));

当我没有登录时，在源代码中我只得到一个包含js： WP-包括/可湿性粉剂表情符号* JS

当我被记录时，包括更多的JS，但最重要的是： http://website/wp-content/themes/csp/js/theme.js?ver=1

当我没有登录时，我找不到解决方案如何包含它。

Answer 1

我已通过以下方式解决了问题：

将'Scripts n Styles'插件安装到wordpress。
在主题网站上找到缺少的javascript http://www.coolspringsfamilychiropractic.com/（奇怪的是 - 上他们的网站脚本对未登录的用户正常工作。）
使用Scripts n Styles插件在标题中粘贴缺少的javascript。

谢谢大家。

Answer 2

我有一个解决方案请执行此操作。

首先在管理员端添加菜单css类作为附加图像。

之后在document.ready上写javascript就像这张图片

最后请检查前面是否有用户登录，然后会看到正面的shop菜单，其他方面无法查看。

对于Wordpress页面中未记录的用户，下拉菜单不可见

2 个答案: