wordpress程序投放广告样式修改设置有妙招

  • A+
所属分类:网站建设

近日,seo阿伟在博客网站上测试一系列的广告投放的方式,其中在投放京东联盟商品推广的时候,为了在网站上展示的样式不太美观做了一些操作,(不知道是不是因为博主自己的小强迫症又来了,总是感觉样式的投放是怪怪的),怎么在wordpress程序上投放完美样式的广告?看小编的这个小技巧!

目前在博客网站上测试投放广告的类型主要有"百度联盟广告 、京东联盟广告、淘宝联盟广告"测试投放广告不是为了赢利让网站变现(几种seo技能快速变现的方式),就目前来看网站的整体的流量的就不足以支撑起有效的赢利的,(此处广告,还请认真的看一下! 动动点击一下网站上的广告,您的支持就是对博主最好的感谢了,资源您拿走,点广告是顺手的事,何乐而不为)

wordpress程序投放广告样式修改:

在wordpress程序上投放广告的方式通常会有这么几种的形式:

01.在网站后台可视化曹组来到网站前端的样式上,可以看到侧边工具栏中的可以投放广告的样式的代码。

02.在wordpress的后台中网站编辑中直接开启网站的广告位,头部广告区 ,列表页广告区,详情页广告区 其中在详情页面的广告区位置可以开启在文章结尾处和在 评论区的上方的广告。

03.直接在wordpress模板中代码位置加上广告代码(seo阿伟不推荐使用这种当时来操作,广告更改不方便,操作需要一定的技术)

由于在网站上广告的投放的位置均已经被上面01的方式占用,顾中能开启在网站上评论区 和网站的文章末的广告区。注意此时在在这两个位置加入京东联盟广告若是选择的广告的尺寸不是通栏的类型尺寸的话,同时投放两条的广告的话就会出现广告显示位置错乱。

想要实现的样式是选择两组广告尺寸为258*110的尺寸的关高显示在同一行位置上,然而在wp后台中开启网站文章结尾处广告区的位置的话却做不到这样的展现形式,在经过简单的样式修改之后才算是将位置的广告区显示为在同一行上显示两条广告(如下图样式) 。

京东联盟

wordpress程序投放京东联盟广告的样式设置有妙招:

上图中的广告样式展现的实现其实很简单,(注意:此处所说的主要针对为京东商品推广的广告样式的展示,若是使用百度联盟广告则不需要这样的操作)。

我们只需要在后台中该位置的广告区投放的 js代码上加入 适当的样式就可以实现,(注意布局的样式代码是继承使用 文章结尾处的“上一篇 ,下一篇” 的样式)

代码段详解:

01.前端布局样式左右两个位置的广告互不影响 ,正是我想要的广告的展现的样式

02. 代码获取打开F12开发者工具 查看该位置的 代码如下

<span class="meta-nav"><span class="post-nav"><i class="be be-arrowleft"></i> 上一篇</span><br>百度竞价中的知识营销是什么?</span>

  1. .meta-nav {
  2. background: #fff;
  3. float: left;
  4. width: 50%;
  5. text-align: center;
  6. margin-right: -1px;
  7. padding: 10px 20px;
  8. white-space: nowrap;
  9. word-wrap: normal;
  10. text-overflow: ellipsis;
  11. overflow: hidden;
  12. border: 1px solid #ddd;
  13. box-shadow: 0 1px 1px rgba(0000.04);
  14. border-radius: 2px;
  15. }

上面的代码段就是 使用span 标签在前端显示布局,而下面.mets-nav 中的就是使用class名 写出 span标签中内容的展现样式。

我们在处理上面文章末尾处的广告的时候只需要在 js代码段前面使用 <span class=".mets-nav"> </span>包裹 即可实现该样式。

写在最后:至此完成了广告样式的布局修改,需要提醒大家的是广告的投放在百度搜索引擎优化白皮书中 对于网站上的着陆页面的广告的投放有着明确的规定,这一点在网站上接入百度熊掌号中对于着陆页面的上的广告的投放 将关系着页面的收录。

发表评论

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen: