『原创』『教程』首页及文章页滚动广告栏
Brains - 灵感乌托邦

『原创』『教程』首页及文章页滚动广告栏

六六丶
2021-10-15 / 41 评论 / 23,364 阅读 / 收录检测中...
广告
温馨提示:
本文最后更新于2022年12月27日,已超过35天没有更新,若内容或图片失效,请留言反馈。

前言

因为之前在很多网站上都能看到广告,虽然但是,这对很多博主来说也是一笔额外的收入,我一直是入不敷出!表情

然后我看到了执念博客的首页广告栏,虽然曝光确实大,但是用户体验极其不好,因为要翻很多广告才能翻到文章,就像这样:

6357585980235.png

所以我就想到了滚动广告,一个广告的位置,能够显示多条广告

成果展示

教程开始

灵感及相关代码来自于Joe主题的首页轮播图

一、添加后台

打开 functions.php 添加以下代码

这是文章页的代码,因为首页广告主题自带了

635758cda794f.png

二、添加滚动广告栏

三、修改广告栏样式

四、添加滚动效果

教程结束

大功告成,快刷新你的网站看看效果吧!

891
打赏
gzh

评论 (41)

语录
图片
取消
  1. 头像
    互联
    Windows 10 · Google Chrome

    QQ表情牛逼

    回复
  2. 头像
    十五
    Windows 10 · Google Chrome

    阔以阔以很nice

    回复
  3. 头像
    tc
    Android Oreo · Google Chrome

    表情

    回复
  4. 头像
    Windows 10 · Google Chrome

    发的发的广泛地被

    回复
  5. 头像
    火喵
    Windows 10 · Google Chrome

    参考一下

    回复
    1. 头像
      火喵
      Windows 10 · Google Chrome
      @ 火喵

      可惜高度值是固定的,没法用

      回复
      1. 头像
        六六丶 作者
        Windows 10 · Google Chrome
        @ 火喵

        你可以修改样式来改变高度

        回复
        1. 头像
          火喵
          Android · Google Chrome
          @ 六六丶

          我的意思是不能设置成图片大小

          回复
          1. 头像
            六六丶 作者
            Android · QQ Browser
            @ 火喵

            可以的,你修改css就行

            回复
      2. 头像
        Fuuuy
        Windows 10 · Google Chrome
        @ 火喵

        你可以自己修改呀

        回复
  6. 头像
    游客432432
    Windows 10 · QQ Browser

    画图

    回复
  7. 头像
    游客432432
    Windows 10 · QQ Browser

    感谢分享

    回复
  8. 头像
    茗总
    Windows 10 · Google Chrome

    博主666666666666

    回复
  9. 头像
    茗总
    Windows X64 · Google Chrome

    感谢分享666

    回复
  10. 头像
    qwer
    Windows 10 · Google Chrome

    qwer

    回复
  11. 头像
    六六丶 作者
    Windows 7 · Google Chrome

    画图

    回复
  12. 头像
    ZMR
    Windows 10 · Google Chrome

    66

    回复
  13. 头像
    六六丶 作者
    Windows 10 · Google Chrome

    画图

    回复
  14. 头像
    撒旦撒旦
    Windows 10 · Google Chrome

    白嫖文章了

    回复
  15. 头像
    Android · Google Chrome

    白嫖文章了

    回复
文章目录