WPDX 广告设置

该主题预留了 8 个广告位,分别为顶部和底部通栏、右上角广告(仅垂直布局可用)、首页幻灯右边、文章顶部和底部、评论表单顶部和底部。侧边栏的广告,可以使用“文本或HTML”小工具来添加。

广告设置方法

预留的广告位如果要添加一个图片的广告,可以在线上传添加;如果要添加多个图片或者广告联盟代码,直接添加广告代码:

0054-cmhello_com

wpdx 主题在宽度 1680 分辨率以内都是满屏的,大于这个分辨率在右边会有点空白。

顶部广告和底部广告

顶部广告位和顶部广告位,添加广告图片的尺寸和添加方法:

由于宽度很大,我们不推荐添加1 图片,至少添加 2 个,所以只能通过直接添加广告代码。

2个图片:宽度为 728px,建议所有图片高度相同,使用类似下面的代码即可:

1
2
3
4
5
6
7
8
9
10
<div class="span6">
	<a href="https://www.wpdaxue.com/" title="WordPress大学" target="_blank" rel="nofollow">
		<img src="https://static.wpdaxue.com/img/2013/12/728.png" alt="WordPress大学">
	</a>
</div>
<div class="span6">
	<a href="https://www.wpdaxue.com/" title="WordPress大学" target="_blank" rel="nofollow">
		<img src="https://static.wpdaxue.com/img/2013/12/728.png" alt="WordPress大学">
	</a>
</div>

从上面的代码可以看到,使用了 <div class="span6"> </div> ,span6 这个类是二分之一宽度,这样就添加了2个广告。图片会自适应的。

3个图片:宽度为 465px,建议所有图片高度相同,使用类似下面的代码即可:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
<div class="span4">
	<a href="https://www.wpdaxue.com/" title="WordPress大学" target="_blank" rel="nofollow">
		<img src="https://static.wpdaxue.com/img/2013/12/728.png" alt="WordPress大学">
	</a>
</div>
<div class="span4">
	<a href="https://www.wpdaxue.com/" title="WordPress大学" target="_blank" rel="nofollow">
		<img src="https://static.wpdaxue.com/img/2013/12/728.png" alt="WordPress大学">
	</a>
</div>
<div class="span4">
	<a href="https://www.wpdaxue.com/" title="WordPress大学" target="_blank" rel="nofollow">
		<img src="https://static.wpdaxue.com/img/2013/12/728.png" alt="WordPress大学">
	</a>
</div>

使用了 <div class="span4"> </div> ,span4 这个类是三分之一宽度,这样就添加了3个广告。

右上角广告

只有在【样式设置】的“主题布局”中选择了“垂直布局”时才可以使用这个广告位

只能放一张图片:宽度为 470px,高度为 60px,直接使用上传功能即可添加。

首页幻灯右边广告

只有当【幻灯设置】的幻灯样式选择“幻灯+广告”时才显示。

1张图片:宽度为 430px,高度为 330px,直接使用上传功能即可添加。

2张图片:使用代码添加,宽度为 430px 高度为160px,使用类似下面的代码添加:

1
2
3
4
5
6
<a href="https://www.wpdaxue.com" target="_blank" title="WordPress大学">
	<img class="gg430" src="https://static.wpdaxue.com/img/2013/12/wpdx430.png" alt="WordPress大学">
</a> 
<a href="https://www.wpdaxue.com" target="_blank" title="WordPress大学">
	<img class="gg430 mt10" src="https://static.wpdaxue.com/img/2013/12/wpdx430.png" alt="WordPress大学">
</a>

注意看上面的 img 标签,两个都添加了 gg430 类,是为了使用预设的样式;第二个多加了一个 mt10 类,用途是让第二个图片顶部空出 10px 的高度。

侧边栏广告

侧边栏可以使用“文本或HTML”这个小工具添加广告代码,图片宽度也是 430px。代码和上面的类似:

1个图片:

1
2
3
<a href="https://www.wpdaxue.com" target="_blank" title="WordPress大学">
	<img class="gg430" src="https://static.wpdaxue.com/img/2013/12/wpdx430.png" alt="WordPress大学">
</a>

2个以上图片:

1
2
3
4
5
6
<a href="https://www.wpdaxue.com" target="_blank" title="WordPress大学">
	<img class="gg430" src="https://static.wpdaxue.com/img/2013/12/wpdx430.png" alt="WordPress大学">
</a> 
<a href="https://www.wpdaxue.com" target="_blank" title="WordPress大学">
	<img class="gg430 mt10" src="https://static.wpdaxue.com/img/2013/12/wpdx430.png" alt="WordPress大学">
</a>

从第二个图片开始,就要多加一个 mt10 类,也即是说,除了第一张图片,下面的都建议添加一个 mt10 类,为的就是在上方添加点间隙。

文章顶部和底部广告

直接使用后台的上传功能添加图片,或者直接添加广告代码即可。

评论表单顶部和底部

直接使用后台的上传功能添加图片,或者直接添加广告代码即可。

该文章对您有帮助吗? 2 1