终于还是没忍住，要向MediaWiki下手了。一来测试下如何插入谷歌广告，二来看看作为流量最大的子站点，心百科是否能比其他几个站获得更多的广告费。

插件

目前从官方的资料来看，支持谷歌广告的扩展不多，其中仍在更新的为ShoutWiki Ads和WimaAdvertising，前者支持的皮肤（skin）较少，常用的Timeless和Vector2022都不支持。后者相对来说使用范围更宽泛一些，主流皮肤都支持，而且除了谷歌广告外还支持自定义广告。它可以在四个不同位置插入广告，页面上下的横幅广告以及左右侧边栏的单元广告。
下面简单介绍一下该扩展的设置（官网的文档有部分错误，从讨论中作者也坦诚没有谷歌广告账号，所以没办法测试）。示意代码如下：

$wgGoogleAdSense = true;//开启谷歌广告（必填）
$wgGoogleAdSenseAnonOnly = true;//只对匿名用户显示广告（可选，默认为false）
$wgGoogleAdSenseClient = 'xxxxxx'; //谷歌广告的发布商ID，即`ca-pub-`后面的一串数字（必填）
$wgGoogleAdSenseSrc = 'https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-xxxxxxx';//调用谷歌广告的源，建议写全（必填）
$wgGoogleAdSenseMode = 'responsive';//广告模式（建议填写，默认为normal）
$wgGoogleAdSenseEncoding = "utf8";//广告字符编码（选填，默认为utf8）
$wgGoogleAdSenseLanguage = "zh";//广告语言（选填，默认为$wgLanguageCode变量）
$wgGoogleAdSenseID = 'MS 001';//广告id（选填，默认为none）
$wgGoogleAdSense_AD1 = [ 'slotid 1', 145, 260 ];//侧边栏广告
$wgGoogleAdSense_AD2 = [ 'slotid 2', 145, 260 ];//侧边栏广告
$wgGoogleAdSense_Top = [ 'slotid 3', 145, 260 ];//顶部广告
$wgGoogleAdSense_Bottom = [ 'slotid 4', 145, 260 ];//底部广告
$wgDefaultSkin = 'monobook'; // 指定默认皮肤（选填）

说明：

  • 广告位不一定要全填，可以只选择其中一项。侧边栏广告可能需要对MediaWiki:Sidebar进行设置。
  • 四个广告位中的slotid指的是谷歌广告单元的id，后面的数字代表高度和宽度，但更建议使用auto代替（记得加单引号），例如：$wgGoogleAdSense_Bottom = [ 'slotid 4', 'auto', 'auto' ];
  • 该扩展版本不同使用的变量名也有所不同，从2.8.5之后，作者将谷歌广告部分的前缀由wm改为了wg，所以不管是从低版本升级过来的还是新安装都要注意变量名的问题，否则不会有任何显示。
  • 在填写$wgGoogleAdSenseClient时使用的是ca-pub-后面的一串数字，而不是完整的ca-pub-xxxxxxx。
  • 注释掉$wgGoogleAdSenseMode = 'responsive';后广告可能不显示，建议开启。
  • 如果不填写$wgGoogleAdSenseClient但设置了$wgGoogleAdSenseSrc = 'https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-xxxxx';，页面仍然会显示部分广告（页面最下方），但广告框部分一片空白。
  • 广告部分由方框包围并在上方显示Advertising:字样，因为翻译问题，中文版也只能显示英文。

WimaAdvertising.png
如果想要改成中文，可以在插件目录下的i18n中新建zh.json的文件，代码如下：

{
    "@metadata": {
        "authors": [
            "WikiMANNia"
        ]
    },
    "wimaadvertising-msg": "Wima广告",
    "wimaadvertising-desc": "通过配置LocalSettings.php文件可以为[https://www.mediawiki.org/wiki/Skin:Citizen Citizen]、[https://www.mediawiki.org/wiki/Skin:Cologne_Blue Cologne Blue]、[https://www.mediawiki.org/wiki/Skin:Modern Modern]、[https://www.mediawiki.org/wiki/Skin:Monaco Monaco]、[https://www.mediawiki.org/wiki/Skin:MonoBook MonoBook]、[https://www.mediawiki.org/wiki/Skin:Timeless Timeless]和[https://www.mediawiki.org/wiki/Skin:Vector Vector]等皮肤提供四个部位的广告。",
    "wimaadvertising-advertising": "广告",
    "wimaadvertising-blank": "",
    "wimaadvertising-eventnote": "事件",
    "wimaadvertising-hint": "提示",
    "wimaadvertising-advertising2": "广告",
    "wimaadvertising-blank2": "",
    "wimaadvertising-eventnote2": "事件",
    "wimaadvertising-hint2": "提示"
}

不过感觉还是通过CSS将它隐藏起来效果更好。

微件

另外还有一种方式是通过微件（Widget）AdSense，但该方法只能在单页面中插入广告，而无法直接全局开启。当然通过模板的方式还是有可能实现自动插入的，就是相对麻烦一点，调试起来也不方便。

代码

如果不想使用插件或微件的话，也可以通过修改配置文件LocalSettings.php实现目的。下面就展开说一下。

在MediaWiki页面顶部插入广告

打开LocalSettings.php文件并在底部加入以下代码：

$wgHooks['SiteNoticeAfter'][] = function(&$siteNotice, $skin) {
        $siteNotice .= <<< EOT
<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<ins class="adsbygoogle"
     style="display:block"
     data-ad-client="ca-pub-xxxxxx"
     data-ad-slot="xxxxxx"
     data-ad-format="auto"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>
EOT;
        return true;
};

上述代码将使用SiteNoticeAfter钩子，然后在文章内容上方显示广告。
注意：<script>部分请复制自己从谷歌广告中获取的代码，并且建议使用自适应的AdSense代码（下同）。

在MediaWiki页面底部插入广告

打开LocalSettings.php文件并在底部加入以下代码：

$wgHooks['SkinAfterContent'][] = function(&$data, $skin) {
        global $myAdCode;
        $data .= '<div style="text-align:center;">';
        $data .= <<< EOT
<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<ins class="adsbygoogle"
     style="display:block"
     data-ad-client="ca-pub-xxxxxx"
     data-ad-slot="xxxxxx"
     data-ad-format="auto"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>
EOT;
        $data .= '</div>';
        return true;
};

上述代码将使用SkinAfterContent钩子，然后在文章内容下方显示广告。
mediawiki-google-adsense-footer.png

在MediaWiki侧边栏插入广告

由于侧边栏呈现的方式不同，因此在插入广告时应注意皮肤间的差异。
首先需要编辑侧边栏的样式表，比如MediaWiki:Vector.css，在其中加入：

/* increase Vector sidebar width to accommodate ads */
div#mw-panel { width: 12em; }
div#p-Ads div.body {margin: 0em !important; }
div#footer, #mw-head-base, div#content { margin-left: 12em; }
#left-navigation { margin-left: 12em; }

然后打开LocalSettings.php文件并在底部加入以下代码：

$wgHooks['SkinBuildSidebar'][] = function($skin, &$bar) {
        $out = <<< EOT
<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<ins class="adsbygoogle"
     style="display:block"
     data-ad-client="ca-pub-"
     data-ad-slot=""
     data-ad-format="auto"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>
EOT;
        $out .= "<script>$('#p-Ads').addClass('persistent');</script>";
        $bar['Ads'] = $out;
        return true;
};

时间有限，仅测试了底部插入广告的代码。
以上代码对所有用户均有效，也就是无论是否匿名都会显示广告。

最后

无论使用何种方法，可能都不会马上显示广告，但从网页代码中可以看到已经加载了谷歌广告。因此，多刷新几次页面即可显示（尤其是通过代码的方式）。
另外，加载的谷歌广告在页面尺寸变化时并不会跟随动态变化，所以在改变浏览器窗口大小的过程中，广告可能会溢出屏幕。

参考资料

https://becomethesolution.com/how-to-add-google-adsense-to-your-mediawiki-site

最后修改：2025 年 02 月 02 日
© 允许规范转载
如果觉得我的文章对你有用，请随意赞赏