建站/WIKI功能/样式优化

来自Wired
跳转到导航 跳转到搜索

移动及PC端分别使用皮肤

默认随账户设置应用于全局，PC端我更喜欢默认的Vector(2010)，简约又不古朴，但移动端适配很差（尤其是可视化编辑界面），阅读都费力更别提编辑，而monobook移动端适配至少能正常使用，可UI明显是00年代的产物，实在过于古朴不适合应用于全局，故使用拓展在PC及移动端分别使用两种皮肤。

下载拓展：Extension:MobileFrontend

  • 注意兼容性问题，截止2024-12-22的最新版本不兼容MediaWiki 1.42.*，请升级Mediawiki版本或使用旧版本拓展，例如：git clone -b REL1_42 https://gerrit.wikimedia.org/r/mediawiki/extensions/MobileFrontend /var/www/html/wired/extensions/MobileFrontend

配置文件添加：

  • wfLoadExtension( 'MobileFrontend' );
  • $wgDefaultMobileSkin = 'monobook';
    • 设置移动端皮肤（不要大写），桌面端仍旧使用配置文件设定的默认皮肤($wgDefaultSkin = 'vector';行)；
    • 注意登陆用户在控制台修改皮肤的优先级大于该拓展，会使设置失效。

其实我很喜欢vector2022的左侧边栏折叠目录树，但以我的水平想在vector2010复刻是无望了，它主要是有两个硬伤，一是文本区域宽度，二是UI的塑料感。前者有开关可取消限制，后者没办法，白的一塌糊涂；元素间距越来越大，长赐号当年从这走也不至于堵苏伊士运河了；2010我就诟病做侧边栏太大无意义空区太多但moonbook又有些紧凑，2022宽了更多，多少内容啊占那么大空间，右侧边栏不打开的话视觉中心就乱了，打开的话有侧边栏更是一堆与日用无关的选项，浪费更多空间。

编辑LocalSettings.php配置文件：

$wgLogos = [
'1x' => "$wgResourceBasePath/resources/assets/logo.png",
'icon' => "$wgResourceBasePath/resources/assets/ico.png",
];

将要设定为logo的图片(不限格式)放置于该目录下，并修改配置文件中的图像名（或修改图像名使其与配置文件指向的一致）即可。

原则上路径什么的都可以自定义（在配置文件中，$wgResourceBasePath参数指向了$wgScriptPath，而这个参数指向了空值，也就等同于网站根目录），但为未来维护的便携性计，不建议动参数。

对于网站图标（网页标题栏左上角），直接在根目录下放置：favicon.ico文件即可。

　

首页

MediaWiki:Mainpage

若“首页”页面已有内容，将其移动到设定的页面即可，不必保留重定向。

　

左侧边栏

MediaWiki:Sidebar，参考：Manual:Interface/Sidebar

* 要显示的目录名
** 页面标题或url|要显示的文本

※ 查阅Category:Menu_extensions了解侧边栏的高级样式及实现方式。

　

浮动目录

MediaWiki:Common.css

代码是网上抄的，来源忘了，加了一句“z-index: 999;”不然会被代码框等样式盖住。

/*启用可折叠的浮动目录树 开始*/
#toc{
    display: block;
    position: fixed;
    top: 100px;
    right: 0px;
    min-width: 100px;
    max-width: 350px;
    max-height: 500px;
    overflow-y: scroll;
    border: 1px solid #aaa;
    border-radius: 0 0 1px 1px;
    -moz-border-radius: 0 0 1px 1px;
    background: rgba(249,249,249,0.75);
    padding: 12px;
    box-shadow: 0 1px 8px #000;
    -webkit-box-shadow: 0 1px 8px #000;
    -moz-box-shadow: 0 1px 8px #000;
    z-index: 999;
    }
#toc:hover{
    display: block;
    position: fixed;
    top: 100px;
    right: 0px;
    min-width: 100px;
    max-width: 350px;
    max-height: 500px;
    overflow-y: scroll;
    border: 1px solid #aaa;
    border-radius: 0 0 1px 1px;
    -moz-border-radius: 0 0 1px 1px;
    background: rgba(249,249,249,0.75);
    padding: 12px;
    box-shadow: 0 1px 8px #000;
    -webkit-box-shadow: 0 1px 8px #000;
    -moz-box-shadow: 0 1px 8px #000;
    z-index: 999;
    }
body { overflow-x: hidden;}
/*启用可折叠的浮动目录树 结束*/

　

隐藏“讨论”选项卡

MediaWiki:Common.css

反正这个功能对于我来说除了难看没啥效果，同理也可以查找其他元素的属性名并设为不显示：

/* 隐藏“讨论”选项卡 */
#ca-talk { display: none !important; }

　

隐藏分类

部分功能(如#选项卡)会自动给调用它的页面添加一个分类，用以标识这个页面使用了该功能。这就导致两个问题：

  • 一是美观上，页面底部会有非我们自定义的分类存在，尤其是该分类为创建时的红色文本甚是难看；
  • 二是组织内容上，不存在的分类会显示在：特殊:需要的分类 中，而给其创建分类页，又会多出非内容需求的冗余页面。

目前有两种解决方案：

  • 隐藏分类：就是建立该分类并在分类源代码中插入：__HIDDENCAT__，如此能在页面不显示分类。但分类页自然也会出现于“特殊:所有页面”中，其还归属于“分类:隐藏分类”，如此一来需求较小的情况下产生了更多无用的数据。
  • 特殊:追踪分类：在该页面的“消息名称”列找到该扩展对应的追踪分类(都有扩展名，对不上见：#Tracking_categories)，点击进去并编辑源代码，删掉其中的文本即可。这样它就不会自动建立分类，如果想知道哪里用了它们，可以通过特殊:替换文本搜对应功能的标签关键词。

如果只是想从外观上隐藏分类，比如某个页面使用了自定义的css时，分类栏或会显得十分突兀，则在：Mediawiki:common.css 添加：

/* 不显示“老婆墙”页面的类别 */
body.page-老婆墙 #catlinks { display : none }
  • 在目标页面查看源代码/控制台审查元素，body标签中的class属性有参数：page-xxxx(通常为页面标题)。
  • 这样的好处是其分类设定仍旧有效，只是从渲染的html页面中屏蔽了而已。

　

公告

※ 作用于所有页面，因此无特殊需求不建议使用，比较影响阅读体验，要对单个页面添加公告，除对单个页面进行编辑外，可用#页面横幅曲线救国。

编辑：MediaWiki:Sitenotice，参考：Manual:Interface/Sitenotice

默认文本是居中显示，可以使用部分html标签来设定样式，支持wikitext语法：

<p align="Left">公告（2024-04-20）：WIKI现嵌入了51.la的[https://v6.51.la/s/6Zm4k1Na7UXbXaE 分析脚本]，预期1个月。若您不喜可用[https://github.com/gorhill/uBlock|uBlock Origin]等拓展工具屏蔽，但建议添加白名单，因为此举(包括前几日的[[记一次站点访客量的分析(2024-03-22)|站内流量分析]])意在获悉系列站点客流量，以便于制定相关政策（因为WIKI的本意是“关于我”，但现在怕是其他用意的访客更多，我须用访客数据做参考以便在便捷与混沌的访客中做抉择）。</p>
<p align="Left">本声明近似于通知、免责声明，因为就预估体量来说还不到为了提纯内容与用户而放弃便捷的程度(主要服务器配置太低也吃消不起)，但我需要知道目前的访客趋势又不想手动筛查log文件中的无效/垃圾ip，预计维持一个月或我去打工。</p>

还有个仅面对匿名用户(未注册及未登陆用户)的公告：MediaWiki:Anonnotice（若设置了内容，则未登陆用户只能看到该公告而看不到sitenoeice的公告）

检索自“https://wired.scio.icu/index.php?title=建站/WIKI功能/样式优化&oldid=89”