如何为WordPress主题添加一个返回顶部按钮

一、确保你的主题已经加载jQ库，然后将以下js代码以gototop.js文件保存，放在主题的目录下：

创新互联是一家集网站建设,若羌企业网站建设,若羌品牌网站建设,网站定制,若羌网站建设报价,网络营销,网络优化,若羌网站推广为一体的创新建站企业，帮助传统企业提升企业形象加强企业竞争力。可充分满足这一群体相比中小企业更为丰富、高端、多元的互联网需求。同时我们时刻保持专业、时尚、前沿，时刻以成就客户成长自我，坚持不断学习、思考、沉淀、净化自己，让我们为更多的企业打造出实用型网站。

jQuery(document).ready(function($) {

$body = (window.opera) ? (document点抗 patMode == "CSS1Compat" ? $("html") : $("body")) : $("html,body");

$("#shang").mouseover(function() {

up()

}).mouseout(function() {

clearTimeout(fq)

}).click(function() {

$body.animate({

scrollTop: 0

},

400)

});

$("#xia").mouseover(function() {

dn()

}).mouseout(function() {

clearTimeout(fq)

}).click(function() {

$body.animate({

scrollTop: $(document).height()

},

400)

});

$("#comt").click(function() {

$body.animate({

scrollTop: $("#comments").offset().top

},

400)

});

});

function up() {

$wd = $(window);

$wd.scrollTop($wd.scrollTop() - 1);

fq = setTimeout("up()", 50)

};

function dn() {

$wd = $(window);

$wd.scrollTop($wd.scrollTop() + 1);

fq = setTimeout("dn()", 50)

};

二、打开主题的footer.php，在最后加入以下代码：

script type="text/javascript" src="?php bloginfo('template_directory');?/js/gototop.js"/script

div id="shangxia"

div id="shang" title="↑ 返回顶部"/div

?php if ( is_singular() ){ ?

div id="comt" title="查看评论"/div

?php } ?

div id="xia" title="↓ 移至底部"/div

/div

/js/gototop.js需要改为与你的实际路径。

三、将以下css代码丢入主题的style.css中：

#shangxia{position:fixed;top:45%;right:50%;display:block;margin-right:-540px;z-index:999;}

#shang,#comt,#xia{background:url(gototop.png) no-repeat;position:relative;cursor:pointer;

height:25px;width:29px;margin:10px 0 0;}

#comt{background-position:left -30px;height:32px;}

#xia{background-position:left -68px;}

#comt:hover{background-position:right -30px;}

#shang:hover{background-position:right 0;}

#xia:hover{background-position:right -68px ;}

上面的css相关代码有些需要修改。

求助：如何修改wordpress回到顶部

一般在主题模板里面修改，如果主题代码里面没找到你需要改的话，可以在外观/菜单,里面看看是不有你要改的地址。

WordPress网站返回顶部按钮怎么添加

WordPress网站返回顶部按钮添加方法：

重写window.onscroll()事件，先将返回顶部div设置为position:fixed;right:10px;bottom:10px;display:none，一旦event.scrollTop100(100可以设置为你想要的值)就display:block（fadeIn()），否则display:none(fadeOut())。还要设置返回顶部div点击事件，onclick(function(){$('body,html').animate({scrollTop:0},1000);})，这个什么意思不用我多说吧，既然搞Jquery，动画还是应该晓得。

style type="css/text"

#gotop{position:fixed;right:10px;bottom:10px;display:none}

/style

div id="gotop"/div

script type="javascript/text"

$(function(){

$(window).scroll(function(){

if($(window).scrollTop 100){

$("#gotop").fadeIn(1000);//一秒渐入动画

}else{

$("#gotop").fadeOut(1000);//一秒渐隐动画

}

});

$("#gotop").click(function(){

$('body,html').animate({scrollTop:0},1000);

});

});

/script

wordpress 怎么编辑返回顶部插件

用户一般都是自上而下浏览完网站，浏览完后就要返回网站顶部，一般的网站都添加了返回顶部的功能，方便用户快速到达网站顶部，而不必去滚动鼠标。如果你不懂得代码，没关系，wp auto top这个WordPress插件将帮你实现这个功能。

下面将详细介绍WordPress返回顶部插件wp auto top的使用方法。

1/3

先安装wp auto top插件。登陆WordPree后台，按如下步骤操作：

2/3

安装好了之后，不用任何设置，打开网站首页，在左侧会看到如下图的两个箭头，点击向上的箭头，回到网站顶部，点击向下的箭头，回到网站底部。

3/3

另外，我们在“设置”》“wp-auto-top”里面可以设置它的图片颜色、显示页面、显示位置、浮层层高等等。

名称栏目：wordpress回顶部 wordpress恢复初始页面
路径分享：http://kswjz.com/article/ddieisp.html