Question

我是初级网页设计师，目前正在开发基于wordpress的网站（修改当地房屋清理公司的主题）。

网站的所有者希望修复侧边栏，因此即使用户向下滚动页面，右侧边栏（我们的服务菜单）也会始终保持在首位。

我尝试了很多CSS解决方案，但没有任何效果。请在相关页面上have a look。

如果你帮我解决这个侧边栏，我将非常感激，因为我很绝望。

Answer 1

好的朋友，您需要在主题中打开 functions.php
在您的functions.php中找到wp_enqueue_script('somename')的某个地方，可能会有多个这些和某些名称＆＃39;只是一个例子，它可能看起来像这样wp_enqueue_script( 'some-boring-name', get_template_directory_uri() . '/js/some-boring-name.js', array( 'jquery' ), '1.0', true' );
在所有这些之后添加您自己的脚本，如wp_enqueue_script('do-fixed-sidebar' get_template_directory_uri() . '/js/do-fixed-sidebar', array('jquery'), '1.0', true );

它应该是这样的：

wp_enqueue_script( 'some-boring-name', get_template_directory_uri() . 'some-boring-name.js', array( 'jquery' ), '1.0' );
wp_enqueue_script( 'some-boring-name2', get_template_directory_uri() . 'some-boring-name2.js', array( 'jquery' ), '1.0' );
wp_enqueue_script( 'do-fixed-sidebar', get_template_directory_uri() . '/js/do-fixed-sidebar.js', array( 'jquery' ), '1.0' );<--this will be your included do-fixed-sidebar.js file-->

您在/js/do-fixed-sidebar.js中看到wp_enqueue_script()部分？

这意味着您需要在主题中创建一个空文件夹，名为 js （如果您的主题没有它）

为了安全起见，您的 主题文件夹结构 应该如下所示（这只是一个例子）：
- 的index.php
- 的style.css
- single.php中
- author.php
- 全另一files.php
- js <--this your empty folder -->
打开文本编辑器并创建一个新文件并将其命名为 do-fixed-sidebar.js

将以下代码添加到do-fixed-sidebar.js并保存。

$(document).ready(function(){

var stickySidebar = $('.wpb_content_element').offset().top;

$(window).scroll(function() {  
 if ($(window).scrollTop() > stickySidebar) {
    $('.wpb_content_element').addClass('fixed');
 }
 else {
     $('.wpb_content_element').removeClass('fixed');
 }  
 });

 });

将此文件上传到主题中的js文件夹。

我们尚未完成...在您的主题中找到style.css并添加此代码：

.fixed{
position:fixed;
top:0;
right:0;<--this will probably need some adjusting maybe 45px...-->
overflow-y:scroll;
height:100%;
}

哇，你完成了!! ：）

Answer 2

for create custom sidebar in wordpress, use "register_sidebar" hook in function.php

register_sidebar( array(
        'name' => __( 'Main Sidebar', 'wpb' ),
        'id' => 'sidebar-1',
        'description' => __( 'The main sidebar appears on the right on each page except the front page template', 'wpb' ),
        'before_widget' => '<aside id="%1$s" class="widget %2$s">',
        'after_widget' => '</aside>',
        'before_title' => '<h3 class="widget-title">',
        'after_title' => '</h3>',
    ) );

Now you can use this sidebar in any files of theme. you need to use this "dynamic_sidebar" for calling sidebar.

<?php if ( is_active_sidebar( 'sidebar-1' ) ) : ?>
    <div id="secondary" class="widget-area" role="complementary">
    <?php dynamic_sidebar( 'sidebar-1' ); ?>
    </div>
<?php endif; ?>

如何在wordpress网站上创建静态侧边栏

2 个答案: