现在的位置: 首页 > WordPress > 正文

如何为WordPress日志中的链接添加一个按钮

2010年12月27日 WordPress ⁄ 共 856字 ⁄ 字号 暂无评论 ⁄ 阅读 5,225 次

很多童鞋对我日志中,主题演示及下载链接按钮很好奇,总是问如何添加的,其实很简单,准备一张按钮图片,然后在文章中加入一个盒子(DIV),几行CSS样式就可作出这个效果,现在就教大家如何添加这个按钮效果.

1.将下面的图片文件,另存下来,上传到主题的images文件夹中

2.把以下样式文件加到主题的style.css中:

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

3.在编辑日志时切换到代码模式(HTML),在适当位置加入以下代码:

<div id="demo"><a href="http://lovesoo.org/">主题演示</a></div>
<div id="download"><a href="http://lovesoo.org/">主题下载</a></div>

显示效果如下:

4.用table表格进行定位,完整代码如下:

<table border="0" width="240" align="center">
<tbody>
<tr>
<td width="120" height="25">
<div id="demo"><a href="http://lovesoo.org/">主题演示</a></div></td>
<td width="120" height="25">
<div id="download"><a href="http://lovesoo.org/">主题下载</a></div></td>
</tr>
</tbody>

显示效果如下:

本文转自:知更鸟

给我留言

留言无头像?