海洋 CMS 模板怎么添加广告位代码
海洋 CMS 添加广告位有两条路:后台「广告管理」粘贴广告代码,或直接编辑模板文件插入 HTML/JS 代码;无论走哪条,改完必须清缓存并重新生成静态页,否则前台看不到变化。
海洋 CMS 加广告位,改后台还是改模板?
结论:位置固定的广告(全站头部、播放器上方、列表页间隔)直接改模板最快,按时间段投放的广告用后台广告管理更省事。
海洋 CMS 属于影视类 CMS,模板输出的是静态 HTML,页面上每一块可见内容都对应模板文件里的一段代码。后台广告管理适合运营人员操作——填名称、选类型(文字/图片/代码)、设置起止时间,把代码粘进去就行,不用碰文件。改模板适合开发人员——广告位要精确落在某个 DOM 节点之间,比如播放器 div 的下方,后台模块往往没有这个钩子。
如果你的版本后台没有广告管理模块,不用纠结,全部用模板方式实现即可,效果一样。
广告代码应该插到模板的哪个文件?
结论:全站出现的广告放公共模板,只在某类页面出现的广告放对应页面模板。
进入服务器上站点的 template/ 目录,里面按模板名分文件夹,例如 template/default/。常见文件职责:
head.html:全站头部,广告插这里每一页都会出现foot.html:全站底部,适合放友链下方横幅index.html:首页vod/目录下的detail.html、play.html:影片详情页、播放页art/目录:文章页模板
这些文件之间常用 {include file="xxx"} 互相引用,所以改了 head.html 可能全站页面同时生效,改之前先想清楚影响范围。
直接改模板的具体步骤
结论:备份 → 定位 → 插入 → 保存为 UTF-8 无 BOM → 清缓存 → 重新生成,六步缺一不可。
- 用 FTP 或面板文件管理器下载要改的模板文件,复制一份改名
.bak存好。 - 用支持语法高亮的编辑器(VS Code、Notepad++)打开,搜索播放器容器或列表循环的位置。
- 在目标标签的下一行插入广告代码,例如一段固定高度的容器加脚本:
<div class="ad-slot" style="min-height:90px">
<script src="//example.com/ad.js"></script>
</div>
- 保存时编码选
UTF-8 无 BOM。带 BOM 会导致页面顶部出现空白行甚至乱码。 - 进后台清空缓存,然后执行「生成」——首页、列表页、内容页、播放页各生成一次。
- 前台按
Ctrl+F5强刷验证。
模板里已有的变量写法(形如 {$maccms.xxx})不要照抄网上的教程,各版本变量名有差异,最稳的做法是把模板中已有的一段广告代码复制过来改链接和尺寸。
代码加进去了,前台为什么不显示?
结论:九成是静态页没重新生成,其次是缓存和混合内容拦截。
按这个顺序排查:
- 看源文件是否真的发布到了服务器(FTP 上传有延迟或路径放错)
- 后台重新生成静态页,静态站点不会自动跟着模板变
- 清浏览器缓存和 CDN 缓存
- 关闭广告拦截插件再试,很多拦截规则会把
ad、ads这类 class 名直接屏蔽 - 站点是
https而广告脚本是http,会被浏览器当作混合内容拦掉,把脚本地址改成https或协议相对写法// - 检查代码是否被包在
{if}条件里,只有满足条件的分支才输出
PC 端和手机端要分别加吗?
结论:要,两套模板各自处理一次。
海洋 CMS 通常提供 PC 模板和手机模板两套目录,前台按 UA 判断走哪一套。PC 模板里加的广告不会自动出现在手机模板。如果不想维护两份代码,可以用一条 CSS 媒体查询控制显示,但前提是两套模板引用的是同一个公共文件。
加广告位要注意什么
结论:给广告位预留固定高度,避免页面加载时布局抖动。
容器写死 min-height 或用 aspect-ratio 占位,广告加载后不会把正文往下顶,这也是 Google 衡量 CLS(累积布局偏移)的指标之一。另外播放页广告别盖住播放器控制条,移动端弹窗不要超过一屏,否则用户会直接关掉页面。
总结:全站广告改 head.html、foot.html,单页广告改对应页面模板,能用后台广告管理就用后台;改完统一走「清缓存 + 重新生成」两步,PC 和手机模板各做一遍,广告容器预留高度。
原文链接:https://www.gj0.com/thread-678.html
转载请注明出处并保留本声明;内容仅代表作者观点,与本站立场无关。若本文涉嫌侵权,请联系本站处理。