zblog分类页和文章页导航优化

admin5年前 (2016-10-26)SEO优化306

珠海SEO技术博客立足于珠海,服务于全国各地,笔者使用的这套博客程序zblog也在逐步修改完善中,一直想调整Zblog分类页和文章页导航,这里就把笔者自己调整Zblog程序的过程分享给大家。

栏目导航的优化栏目分类的伪静态设计已经实现,现在要实现的是栏目页左右导航到栏目列表,找到栏目列表模板,默认的是catalog.html模板,在模板中找到<#TEMPLATE_FOOTER#>替换成下面的代码

<#TEMPLATE_FOOTER#>
<a class="prev" href="http://yangchongyuan.com/" title="珠海SEO和你讲述建站与SEO优化的故事!"></a>
<a class="next" href="http://yangchongyuan.com/sem/" title="SEM优化!"></a>

Css样式添加

/* -----------------------------上下篇,上下列表部分----------------------------- */
a.prev,a.next{display:block;width:108px;height:282px;position:fixed;left:50%;top:50%;margin-top:-141px;background:url(images/arrow.png) no-repeat;}
a.prev{margin-left:-591px;background-position:0 0;}
a.next{margin-left:483px;background-position:0 -300px;}
a.prev:hover,a.next:hover{background-color:#F7F3ED;}


至此,Zblog的列表页导航修改完成。

文章页导航的优化,文章页与列表页的样式共用,不同的是要将导航代码添加到文章模板,以Single.html模板为例,single模板调用的是b_article_single.html,而b_article_single.html调用的是<#template:article_navbar_l#><#template:article_navbar_r#>,也就是b_article_navbar_l.html和b_article_navbar_r.html,实际上就是调整这里的代码

b_article_navbar_l.html中的代码替换为

<a class="prev" href="<#article/nav_l/url#>" title="<#article/nav_l/name#>"><#article/nav_l/name#></a>

b_article_navbar_r.html中的代码替换为

<a class="next" href="<#article/nav_r/url#>" title="<#article/nav_r/name#>"><#article/nav_r/name#></a>

至此文章页面导航修改完成。

导航栏体验的优化,文章列表页有一个很不好的用户体验,就是导航到栏目列表后,没有明确的标志指示用户所在的列表模块。看了Zblog的模板代码,发现能定制的东西很少,除了调用系统模板文件和模板标签,就只能自定义标签了,Zblog中自定义标签是比较复杂的活,这里提供大家一个简单的方法,就是用Jquery去动态适应当前的栏目导航。

$(document).ready(function(){//控制导航
		var curUrl = window.location.href;
		$("#menu a").each(function(i,item){
			if(curUrl.indexOf($(item).attr("href")) >= 0){
				$("#menu a").removeAttr("id");
				$(item).attr("id","menuON");
			}
		})
	});

看seo珠海博客调整后的效果如下图

相关文章

百度MIP效果演示及站点改造资料

百度MIP效果演示及站点改造资料

8月21号,第一时间给大家介绍了百度的MIP计划,相信SEO人员对MIP计划都有所了解了,短时间内应该还没来得及动手改造网站。继续关注百度的MIP,手机搜索“百度MIP" ,可以看到搜索结果...

百度site指令不在第一位是K站的预告吗

百度site指令不在第一位是K站的预告吗

在网上有很多站长质疑,百度site指令时,主站不在第一位了,是不是我的爱站要被K了?对于站长的这个问题,珠海SEO也纠结了很久,起初也认为有这个可能,不过在后来查阅了很多相关权威性的资料后,否认了这个...

SEO问答七:网站权重是什么,如何提高网站权重?

SEO问答七:网站权重是什么,如何提高网站权重?

网站权重是什么 网站权重,简单的说就是搜索引擎给网站的一个评分,分值越高,权重越高。权重高就表示搜索引擎越重视你的网站,那么网站在搜索引擎中的排名就越好,搜索引擎给予的流量也就越多。明白了网...

各地seoer晒工资单

前两天,在百度看到seo工资各地的标准,这样的工资是与当地的生活水平有关的,如果具体到个人,实在是很难说,笔者对seo行业工资待遇有自己的看法上海seo:5350.00元 广州seo:4750.00元...

如何做好移动站

如何做好一个移动站,珠海seoer前天参加了百度站长大课堂,根据百度提供的网站优化方案可以从以下几点入手。把握好三个宗旨,就是百度最喜欢的网站:速度快、死链少、页面主题内容突出速度好,要选择质量好的服...

搜索引擎如何提取正文

搜索引擎如何提取正文

还是延续上一篇两个"珠海SEO"所争论的问题,SEO必须了解HTML结构树,此文中介绍了搜索引擎是如何提取网页Title的,那网页的正文又是如何提取的呢?对于网页正文的提取方法就比...

评论列表

爱站库
5年前 (2016-10-30)

这个不错啊

发表评论

访客

◎欢迎参与讨论,请在这里发表您的看法和观点。