统计
  • 建站日期:2022-01-17
  • 文章总数:5910 篇
  • 评论总数:62630条
  • 分类总数:43 个
  • 最后更新:3天前

WordPress B2主题页眉下方添加顶部通栏广告

作者头像
首页 建站技术 正文
广告
广告

B2主题默认没有设置页眉下方的顶部通栏广告位,但是预留了一个钩子 b2_content_before,我们可以通过该钩子插入广告代码。

image.png

B2主题提供了子主题,建议采用子主题方式来添加自定义代码

代码示例如下,请根据自己的需要修改,将代码添加到当前激活主题的 functions.php:

/**
 * 添加图片广告到B2主题页眉下方
 */
add_action('b2_content_before', function(){
    echo '<div class="dddd ads-after-header">
            <div class="wrapper">
                    <a target="_blank" href="https://www.aybk.cn/">
                            <img width="598" height="80" alt="点击查看广告位详情" src="https://www.aybk.cn/content/uploadfile/202304/b8f51681450097.gif" >
                    </a>
                    <a target="_blank" href="https://www.aybk.cn/">
                            <img width="598" height="80" alt="阿影博客" src="https://www.aybk.cn/content/uploadfile/202304/b8f51681450097.gif" >
                    </a>
            </div>
    </div>';
});

样式代码参考如下,根据自己的需要调整,可以添加到主题的 style.css:

.vips .ads-after-header {
    display: none;
}
.ads-after-header {
    margin-bottom: 16px;
}
.ads-after-header a {
    display: inline-block;
    width: 49.8%;
    max-width: 598px;
}
.ads-after-header a:first-child {
    margin-right: 0.4%;
}
.ads-after-content {
    margin-top: 16px;
}
.post-style-5 .ads-after-header {
    display: none;
}
@media screen and (max-width: 768px){
    .ads-after-header {
        margin-bottom: 4px;
    }
    .ads-after-header a {
        width: 100%;
        max-width: 768px;
        margin-bottom: 2px;
    }
    .ads-after-header a:first-child {
        margin-right: 0;
    }
}

版权说明
文章采用: 《署名-非商业性使用-相同方式共享 4.0 国际 (CC BY-NC-SA 4.0)》许可协议授权。
版权声明:本站资源来自互联网收集,仅供用于学习和交流,请勿用于商业用途。如有侵权、不妥之处,请联系客服并出示版权证明以便删除!
新手操作抖音壁纸号的详细流程
« 上一篇 05-05
Emlog PRO模板:Mould简影视主题模板
下一篇 » 05-05