移动端隐藏Widgetbot脚本求助（基于Flarum论坛）

针对你遇到的Widgetbot图标在移动端遮挡内容、且无法修改论坛根文件的情况，提供两种可行方案：

方案一：仅在非移动端加载并初始化Widgetbot #

你之前的代码失效是因为未定义mobilecheck()函数，且异步脚本的执行顺序存在问题。改用以下脚本，通过动态创建脚本的方式，仅在非移动端加载Widgetbot：

<script>
// 判断是否为移动端（可根据需求调整断点宽度）
function isMobile() {
    return window.innerWidth <= 768;
}

if (!isMobile()) {
    const widgetScript = document.createElement('script');
    widgetScript.src = 'https://cdn.jsdelivr.net/npm/@widgetbot/crate@3';
    widgetScript.async = true;
    widgetScript.defer = true;
    widgetScript.onload = function() {
        // 初始化Widgetbot
        new Crate({
            server: 'XXXXXXXXXXXXXXXXXXX', // 你的Discord服务器ID
            channel: 'XXXXXXXXXXXXXXX' // 你的Discord频道ID
        });
        // 原代码中的button.notify调用可能存在错误，若不需要可直接注释
        // 如需使用通知，请确认Widgetbot的正确调用方式
        // const crateInstance = new Crate({...});
        // crateInstance.notify({ content: 'Background updated', timeout: 1000 });
    };
    document.head.appendChild(widgetScript);
}
</script>

将这段代码替换你原来的脚本，添加到论坛管理面板的页面头部即可。这种方式从根源避免移动端加载Widgetbot，自然不会出现图标。

方案二：用CSS媒体查询强制隐藏图标 #

如果方案一不符合需求，或者你需要保留Widgetbot功能仅隐藏图标，可以在Flarum后台的外观设置中添加自定义CSS：

首先打开论坛移动端页面，用浏览器开发者工具（F12）找到Widgetbot图标的元素，查看它的类名（比如常见的.widgetbot-crate-button），然后添加以下CSS：

/* 屏幕宽度≤768px时隐藏Widgetbot图标 */
@media (max-width: 768px) {
    .widgetbot-crate-button { /* 替换为实际找到的类名 */
        display: none !important;
    }
}

!important用于强制覆盖Widgetbot自带的样式，确保生效。如果找不到类名，也可以用属性选择器，比如元素带有data-widgetbot属性的话，写成[data-widgetbot] { display: none !important; }。

补充：你之前代码无效的原因 #

1. 未实现mobilecheck()函数，浏览器无法识别该判断逻辑；
2. 原脚本使用async defer导致函数定义和执行顺序混乱，判断逻辑未生效；
3. button.notify调用错误，Widgetbot的通知方法需通过Crate实例调用，而非直接使用button对象。

内容的提问来源于stack exchange，提问作者treyb