189期B班报名时间4月15日-4月30日 4月30日开班仪式 加V咨询:seowhy2021 立即咨询

如何修改yiqicms导航的背景颜色、导航字体大小?(图文)

在我们使用yiqicms程序建站时,可能因为站点的需要或者希望让自己的网站更有个性化,我们希望让自己网站的导航背景颜色能够根据自
己的意愿来设置,同时也希望适当改变导航字体的大小,那么到底该如何来实现呢?

要想实现导航背景颜色和导航字体大小的更改,总共只要三个步骤。

第一步:修改导航是在模版文件里进行修改的,因此第一步就是找到你的模版文件,这里以yiqicms的默认模版作为例子;
把/templets/default/下的header.tpl文件传输到本地,

使用notepad++软件打开header.tpl文件,找到第26-33行的代码:
<div class=”menu”>
<ul>
{assign var=”topnavlist” value=$navdata->TakeNavigateList(“顶部导航”,0,10)}
{foreach from=$topnavlist item=navinfo}
<li><a href=”{$navinfo->url}” title=”{$navinfo->name}”>{$navinfo->name}</a></li>
{/foreach}
</ul>
</div>

从这几行代码中我们可以看出,yiqicms的导航,调用的是css样式表,我们只要在模版的css样式表中找到关于menu的定义就可以进行修改
了。

第二步:找到css样式表;
在header.tpl文件第十六行代码中我们会看到:
<link href=”{$siteurl}/templets/{$templets->directory}/images/style.css” rel=”stylesheet” type=”text/css” />
这行代码的意思是这个样式表位于模版的image文件夹,而且这个样式表的名称叫做style.css;

第三部:把/templets/default/images/下的style.css文件传输到本地文件,使用notepad++软件打开进行修改;
找到95-101行代码:
background:#008be8;
overflow:hidden;
height:35px;
line-height:35px;
color:#fff;
font-size:15px;
font-weight:bold;

如果想要修改导航的背景颜色,只要把background:#008be8的颜色进行修改就可以了,background代表背景的意思,另外如果想要修改导
航字体的大小,只要修改font-size:15px就可以实现改变导航字体的大小了。

修改完成之后保存文件,把style.css文件传输到/templets/default/images/,覆盖原先的内容,然后回到站点首页刷新就会发现导航背
景和字体大小的已经成功更改了。

当然,如果你不懂代码,也没有关系,跟着以上的步骤一步步操作同样可以实现导航背景颜色的更改和导航字体大小的更改。

发布时间:2019-08-23

推荐阅读:

  1. SEO优化中微调在网站中后期的重要作用
  2. 顶级域名和一级,二级、二级目录域名的形式区别
  3. 如何让你的小程序带来收益?这些运营思路你需要了解
  4. wordpress系统中的模板好吗?为什么不建议使用?
  5. 如何避免网站页面相似度?有效降低页面相似度的方法

了解夫唯SEO特训营

夫唯学院成立于2007年,11年来与数万学员共成长。创始人夫唯先生总结的四处一词、站内站、定向锚文本、聚合等多种核心优化策略,并在众多学员网站上得到验证。夫唯先生推崇“循序渐进,基业长青”的SEO运维思想,以SEOWHY为现实实战案例,历经5年零起步创造了网站品牌。

SEO培训报名联系方式:客服QQ86594013 客服微信:seowhy2021

关于我们 / 联系我们 / 人文关怀 / 付款方式 / 教研室夫唯SEO特训营为您提供SEO培训SEO培训教程,实时搜索引擎算法更新。 © 2018 SEOWHY Inc.