【自定义】GM左侧背景+自定义头条图片
本帖最后由 Hadley0T 于 2026-2-18 11:51 编辑看黑色的男人看腻了（没有说BOOW不好的意思，也没有说头条不好看，现在我已经看腻了关了脚本了），就找AI跑了一下替换掉这两个图片的脚本。虽然AI总是给我出一点奇怪的乱子。
使用方法很简单，将需要的图片链接在代码里替换一下就行了。
如图所示，需要注意下图片的尺寸大小。
左侧背景为620*1135
头条图为1500*338
最终效果展示如图，可能会非常花里胡俏。如果马老师可以出个简化首页的脚本就更好了。主页的黑色配色其实我一直觉得看着有点难受不够简洁来着（虽然自定义图片后看起来更像是某种GV网站了）。无奈主题的黑暗模式也不是反色，而是更暗。
因为是本地的所以你自己用更黄更暴力的图都没问题。
后面一堆有的没的应该可以直接优化下，大佬们就可以自己动手了。或者直接在帖子里帮我优化下也行。白嫖下大佬（X
<div>// ==UserScript==
// @Name GameMale 左侧背景+头图双自定义
// @namespace https://www.gamemale.com/
// @version 2.0
// @description同时自定义左侧 wp-bg 背景和 portal_block_summary 头图，独立配置无冲突
// @author You
// @Match https://www.gamemale.com/*
// @grant none
// ==/UserScript==
(function() {
'use strict';
// ====================== 自定义配置区（修改这里即可）======================
// 1. 左侧背景（wp-bg）配置
const CUSTOM_BG_URL = "图片直链"; // 620*1135 外链
const ENABLE_CUSTOM_BG = true; // true=启用，false=恢复默认
// 2. 头图（portal_block_summary）配置
const CUSTOM_IMG_URL = "图片直链"; // 建议1500*338 外链
const ENABLE_CUSTOM_IMG = true; // true=启用，false=恢复默认
// ======================================================================
// ------------------------------ 左侧背景（wp-bg）替换逻辑 ------------------------------
// 注入左侧背景样式（保持原布局兼容）
const bgStyle = document.createElement('style');
bgStyle.textContent = `
.wp-bg {
position: fixed !important;
top: 0 !important;
overflow: hidden !important;
margin-left: -502px !important;
width: 620px !important;
height: 100% !important;
min-height: 700px !important;
background-size: auto 100% !important;
background-repeat: no-repeat !important;
background-position: top left !important;
background-color: #0C0C0E !important;
}
`;
document.head.appendChild(bgStyle);
// 左侧背景核心替换函数
function setCustomBackground() {
let wpBgElement = document.querySelector('.wp-bg');
// 未找到元素时自动创建适配结构
if (!wpBgElement) {
wpBgElement = document.createElement('div');
wpBgElement.className = 'wp-bg';
wpBgElement.innerHTML = '<span></span><div></div>';
const wrapperBody = document.querySelector('.wrapper-body');
if (wrapperBody) {
wrapperBody.parentNode.insertBefore(wpBgElement, wrapperBody);
} else {
document.body.insertBefore(wpBgElement, document.body.firstChild);
}
}
// 保存默认背景（避免重复覆盖）
if (!window.defaultWpBgStyle) {
window.defaultWpBgStyle = {
backgroundImage: wpBgElement.style.backgroundImage || 'url(./template/mwt2/extend/img/hdbg.jpg)',
backgroundColor: wpBgElement.style.backgroundColor || '#0C0C0E'
};
}
// 根据配置设置背景
if (ENABLE_CUSTOM_BG && CUSTOM_BG_URL) {
const urlRegex = /^(https?:\/\/)?([\da-z.-]+)\.({2,6})([\/\w.-]*)*\/?$/;
if (urlRegex.test(CUSTOM_BG_URL)) {
wpBgElement.style.backgroundImage = `url(${CUSTOM_BG_URL})`;
} else {
console.warn('左侧背景脚本：外链格式错误，已恢复默认');
wpBgElement.style.backgroundImage = window.defaultWpBgStyle.backgroundImage;
}
} else {
wpBgElement.style.backgroundImage = window.defaultWpBgStyle.backgroundImage;
wpBgElement.style.backgroundColor = window.defaultWpBgStyle.backgroundColor;
}
}
// ------------------------------ 头图（portal_block_summary）替换逻辑 ------------------------------
// 注入头图样式（自适应缩放）
const imgStyle = document.createElement('style');
imgStyle.textContent = `
.portal_block_summary > img {
width: 100% !important;
height: auto !important;
object-fit: contain !important;
max-width: 100% !important;
border: none !important;
outline: none !important;
}
.portal_block_summary {
position: relative !important;
overflow: hidden !important;
}
`;
document.head.appendChild(imgStyle);
// 头图核心替换函数
function replacePortalImgOnly() {
const targetImgs = document.querySelectorAll('.portal_block_summary > img');
if (!targetImgs.length) {
console.warn('头图脚本：未找到目标 img 元素，暂不生效');
return;
}
targetImgs.forEach(img => {
// 保存原图 src（仅首次记录）
if (!window.defaultPortalImgSrc) {
window.defaultPortalImgSrc = img.src;
}
// 根据配置替换 src
if (ENABLE_CUSTOM_IMG && CUSTOM_IMG_URL) {
const urlRegex = /^(https?:\/\/)?([\da-z.-]+)\.({2,6})([\/\w.-]*\/?)$/;
if (urlRegex.test(CUSTOM_IMG_URL)) {
img.src = CUSTOM_IMG_URL;
img.dataset.customSrc = CUSTOM_IMG_URL; // 标记自定义状态
} else {
console.warn('头图脚本：外链格式错误，已恢复默认');
restorePortalImg(img);
}
} else {
restorePortalImg(img);
}
});
}
// 头图恢复默认函数
function restorePortalImg(img) {
if (window.defaultPortalImgSrc) {
img.src = window.defaultPortalImgSrc;
img.removeAttribute('data-custom-src');
}
}
// ------------------------------ 统一执行与监听逻辑（避免冲突） ------------------------------
// 页面加载完成后执行双替换
function initAllReplace() {
setCustomBackground();
replacePortalImgOnly();
}
if (document.readyState === "complete" || document.readyState === "interactive") {
initAllReplace();
} else {
document.addEventListener('DOMContentLoaded', initAllReplace);
}
// 统一监听页面变化（轻量化，避免重复监听）
const observer = new MutationObserver((mutations) => {
mutations.forEach(mutation => {
// 监听左侧背景相关变化
if (mutation.addedNodes.length > 0 && ENABLE_CUSTOM_BG) {
const wpBg = document.querySelector('.wp-bg');
if (wpBg && !wpBg.style.backgroundImage.includes(CUSTOM_BG_URL)) {
setCustomBackground();
}
}
// 监听头图相关变化
if (ENABLE_CUSTOM_IMG) {
const isTargetImgChange = mutation.type === 'attributes' &&
mutation.target.tagName === 'IMG' &&
mutation.target.closest('.portal_block_summary') &&
mutation.attributeName === 'src';
const isTargetBlockAdded = mutation.addedNodes.length > 0 &&
mutation.target.classList.contains('portal_block_summary');
if (isTargetImgChange || isTargetBlockAdded) {
const targetImg = mutation.target.tagName === 'IMG' ? mutation.target : mutation.target.querySelector('img');
if (targetImg && targetImg.dataset.customSrc !== CUSTOM_IMG_URL) {
replacePortalImgOnly();
}
}
}
});
});
// 启动监听（仅监听必要事件，最小化性能影响）
observer.observe(document.body, {
childList: true,
subtree: true,
attributes: true,
attributeFilter: ['src']
});
})();</div>
赶上热乎的了，对我这种超级喜欢倒腾各种主题背景装扮的有福了{:4_86:} 惹～这下更不敢在外面打开泥潭了（）就是估计会错过头条的活动预告咯，不过后面会有活动预热帖，问题也不大 不是一个人住的坛友还是要注意不要换上大尺度图片，要不然就是马上公开出柜了{:6_188:} 这个脚本功能我可太需要了，能自定义就很舒服了:$ 可以自定义还是很不错的惹，可以换成自己喜欢的:$ 玛雅，被泥潭通讯录吓鼠了，得多去小广场看点戏剧缓一缓{:6_169:} 能自定义头条的脚本，功能看着好方便呢。 确实很不错惹，可以在首页狠狠吸入老公了{:6_172:} 学会了 下次就用这个 自定义背景与图片 非常好，自己更换超级色情男人来了！（色鬼牢D 好东西啊这是，以后喜欢的图就可以直接放在GM上一直看见了，感觉你坛真的快变成泥潭暖暖;P 感谢分享~有了自定义，使用起来就能更舒服惹
（看起来gm网页的布局和浏览器还有显示器分辨率真的有很大关系，我这里的黑色男人背景只有窄窄一条边，注册了好久才发现不是随意的花纹而是一堆男人 感觉用了后，可能我就不敢随便打开泥潭了，哈哈哈:D https://i.111666.best/image/MtO5qRUlauMHu8JyhSflPi.jpg
很好用的东西，我将把眼睛图片贴满侧边栏{:4_86:}
但感觉过段时间还是会回归经典款，不过用着先噜 因為習慣把頁面放大所以沒怎麼注意到那一塊呢./w\ 这个好，但是用了恐怕不能在公众场合打开论坛了 关键点应该是从哪偷性感男人的图库吧 感觉不错呢，就是觉得泥潭更加NSFW了hhhh 学费了，马上就试试换上自己喜欢的