Blogger添加文件复制按钮，经过两年的折腾，最近终于明白是什么原因！

视频地址：https://youtu.be/ntkKznLtYzo

第一步： 打开编辑主题，

第二步：在代码框中点击一下，按 Ctrl + F 搜索 </body>。

将以下代码紧贴着粘贴在 </body> 标签的上方：

复制下面的HTML代码后，放入你的主题模板即可：

<style>
/* 1. 容器样式：模拟 macOS 终端窗口 */
pre {
    background: #1e1e2e !important;
    color: #cdd6f4 !important;
    padding: 45px 20px 20px 20px !important; 
    border-radius: 12px !important;
    position: relative !important;
    overflow-x: auto !important;
    font-family: 'Fira Code', 'Cascadia Code', monospace !important;
    font-size: 14px !important;
    line-height: 1.6 !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
    margin: 25px 0 !important;
    box-shadow: 0 15px 35px rgba(0,0,0,0.4) !important;
}

/* 2. 窗口装饰：左上角红黄绿三色圆点 */
pre::before {
    content: '';
    position: absolute;
    top: 16px;
    left: 20px;
    width: 9px;
    height: 9px;
    background: #ff5f56;
    border-radius: 50%;
    box-shadow: 15px 0 0 #ffbd2e, 30px 0 0 #27c93f;
    opacity: 0.6;
}

/* 3. Gemini 风格复制按钮 */
.copy-btn-gemini {
    position: absolute;
    top: 10px;
    right: 12px;
    padding: 6px 12px;
    background: rgba(255, 255, 255, 0.05);
    color: #89b4fa;
    border: 1px solid rgba(137, 180, 250, 0.2);
    border-radius: 8px;
    cursor: pointer;
    font-size: 11px;
    font-weight: 600;
    transition: all 0.2s ease;
    z-index: 5;
}

.copy-btn-gemini:hover {
    background: rgba(137, 180, 250, 0.15);
    border-color: #89b4fa;
}

.copy-btn-gemini.copied {
    background: #a6e3a1 !important;
    color: #11111b !important;
    border-color: #a6e3a1 !important;
}
</style>

<script>
document.addEventListener("DOMContentLoaded", function() {
    const blocks = document.querySelectorAll('pre');
    blocks.forEach((block) => {
        const button = document.createElement('button');
        button.className = 'copy-btn-gemini';
        button.type = 'button';
        button.innerText = 'COPY';
        block.appendChild(button);

        button.addEventListener('click', () => {
            const tempBlock = block.cloneNode(true);
            const btnInTemp = tempBlock.querySelector('.copy-btn-gemini');
            if (btnInTemp) btnInTemp.remove();
            const textToCopy = tempBlock.innerText.trim();

            navigator.clipboard.writeText(textToCopy).then(() => {
                button.innerText = 'COPIED!';
                button.classList.add('copied');
                setTimeout(() => {
                    button.innerText = 'COPY';
                    button.classList.remove('copied');
                }, 2000);
            });
        });
    });
});
</script>

第三步：Blogger编辑内容时，切换一下HTML 视图：

第四步：以后在撰写博文时，切换到 HTML 视图，使用以下结构包裹你的命令：

<p>代码的说明，比如系统更新命令：</p>
<pre>
apt update -y&&apt install -y curl&&apt install -y socat（替换成为需要文本）
</pre>