制作个性化下载地址_wordpress技术分享

转自点点 12 年前 回复

,

感谢皇家园林技术支持 让我在大学便民网加入了投稿功能,特此在这里分享一下我的文章

先给个演示哈!!

大学便民网

大学便民网兼有资源下载功能 我就在网站上放了很多课件的下载地址 一个课程页面少说也有20多个下载链接,总觉得太丑了

昨天看到别人用hotnews主题 看他的下载地址居然有背景图片,且样式很不错,本站就拿来用啦!!

他的方法是在css页面加入一个download的定义 具体如下:

#download {
background: url(images/dd.png) no-repeat;
width:105px;
height:25px;
color: #fff;
padding-left:15px;
}

然后在images中放置所需的图片

然后在文章中要在下载地址中显示的地方加入如下 div设置 如

就是在之前以一个

后面加一个

用了几次 觉得太麻烦啦 我的一个页面几十个链接 每个重新加也太麻烦了吧 且你切换到html才能编辑 然后在切回可视化 价格div便签全没了 太不方便啦

我在想 何不考虑用自带编辑器的段落功能 果不其然 让我做出更加简便的设置方法啦

演示地址:http://www.cobmw.com/smu/?p=65

下面讲具体方法

首先在你的css中删除h6设置样式(为什么选h6呢 因为这个大家不常用,且h1 h2 标签对seo的重要性大家都知道吧!当然 你要设成h5 h4我也没意见)

比如我的css开头语句

html,body,div,ul,ol,li,dl,dt,dd,h1,h2,h3,h4,h5,h6,pre,form,p,blockquote,fieldset,input{margin:0; padding:0;list-style:none;}

勇敢的把中间的h6和逗号删掉

然后在下面加一句

h6{font-size:13px; height:24px; background: url(images/download.png) no-repeat; padding-left:30px;}

然后在你的主题文件images文件夹中加上download.png我这里提供一个
(右键另存图片)

然后在你之前的下载地址中选中 然后设置格式为h6(不要告诉我你不会,首先在wp编辑器上显示出高级工具,然后拉黑要加样式的文字,然后选段落 六级标题),更新一下 进前台看下效果吧!! 不错吧

注意:此为段落格式 加入的必须为一个段落 也就是独立的一行 不能在句子中间插入(之前

也必须这样),不然会造成错乱。

大学便民网原创并首发 也分享给大家 也希望大家有更好的方法可以提出来交流  另 个人美工和css不是很好 所以做的不是很好 望高手可以补充 更改图片样式,这里只是给出方法 更多扩展功能期待大家发掘。

原文地址:http://www.cobmw.com/?p=160

支付宝打赏微信打赏

如果此文对你有帮助,欢迎打赏作者。

发表评论

欢迎回来 (打开)

(必填)