标签: functions功能

  • 文章内页下载按钮

    由于B2主题可能已经不再维护,同时B2主题的下载模块与文章内容分离,难以迁移主题

    所以我打算将所有下载模块的链接填入到我自定义的下载按钮中,如果需要积分获取/隐藏的,只需要用短代码包裹按钮即可

    这样一来,以后更换主题就不需要考虑如何将B2下载模块的链接一并提取出来了,只需要配合我整的下载按钮即可随意迁移站内文章

    图示

    文章内页下载按钮

    代码原理

    三种不同的按钮方式:

    • 链接按钮 – 用于在线工具等分享工具网站用的按钮
    • 软件按钮 – 用于分享软件、网盘链接等(自动识别天翼、123盘、百度盘分享链接)
    • 固定按钮 – 用于分享固定地址的静态html结构按钮,有利于B2主题的隐藏标签包裹

    填入地址自动解析链接地址,然后点击插入按钮,将按钮代码/短代码,插入到文章底部以生成访问按钮

    通过地址加密的方法,加密按钮地址,避免采集工具一键搬空网站

    源代码

    [content_hide]

    📦 资源下载
    🔐 提取码:
    5mwpm



    立即下载

    [/content_hide]

  • 自动清理下载模块并提取链接

    不得不说AI的强大,由于我网站有将近400篇下载模块的链接需要提取出来,然后配合我的下载按钮

    [b2_insert_post id=”1942″]

    本来感觉要折腾两三天才能整理完,突发奇想用AI做半自动的操作代码,没想到十几分钟就搞完了。。

    代码逻辑

    提取下载模块编辑框中的地址链接 → 将链接填入下载按钮设置中 → 自动点击下载按钮的插入按钮 → 关闭下载模块 → 删除下载模块的列表 → 点击更新文章

    好家伙一套小连招,一会就整完了,如果搭配自动点开编辑页面,和自动切换文章列表页,我可能什么都不用干了,不过我还是手动打开文章了,想着看一眼别有什么差错

    相关代码

    [content_hide]

     /**
     * B2主题下载模块链接自动迁移
     * 最终版:支持批量打开+自动更新保存+防重复执行
     */
    function b2_auto_migrate_download_link() {
        // 只在文章编辑页面执行
        global $pagenow, $post;
        if ($pagenow !== 'post.php' && $pagenow !== 'post-new.php') {
            return;
        }
        
        // 获取当前文章ID(用于标记执行状态)
        $post_id = isset($post->ID) ? $post->ID : 0;
        ?>
        <script type="text/javascript">
        jQuery(document).ready(function($) {
            // ========== 核心保护机制 ==========
            // 1. 检查当前文章是否已执行过迁移(通过localStorage标记)
            var postId = <?php echo $post_id; ?>;
            var executedKey = 'b2_download_migrate_' + postId;
            
            // 如果已执行过,直接退出
            if (localStorage.getItem(executedKey)) {
                console.log('文章ID ' + postId + ' 已执行过链接迁移,跳过');
                return;
            }
    
            // 2. 增加随机延迟(避免多个标签页同时执行)
            var randomDelay = 1500 + Math.floor(Math.random() * 2000); // 1.5-3.5秒随机延迟
            
            // 等待页面完全加载(确保所有元素都已渲染)
            setTimeout(function() {
                try {
                    // ========== 步骤1:检查是否有可迁移的资源(提前过滤) ==========
                    var downloadUrlTextarea = $('#b2_single_post_download_group_0_url');
                    var deleteBtn = $('.cmb-remove-group-row.dashicons-no-alt');
                    
                    // 如果没有资源链接或没有删除按钮,直接标记为已执行并退出
                    if (!downloadUrlTextarea.length || !deleteBtn.length) {
                        localStorage.setItem(executedKey, 'done');
                        console.log('文章ID ' + postId + ' 无迁移资源,标记为已处理');
                        return;
                    }
                    
                    // ========== 步骤2:提取下载设置中的第一条资源链接 ==========
                    var rawContent = downloadUrlTextarea.val().trim();
                    var extractedUrl = '';
                    
                    if (rawContent) {
                        // 按换行分割内容,只处理第一行
                        var lines = rawContent.split(/\r?\n/);
                        var firstLine = lines[0].trim(); // 只取第一行
                        
                        // 解析第一行内容中的链接
                        if (firstLine.indexOf('|') !== -1) {
                            var parts = firstLine.split('|');
                            // 遍历第一行的所有部分找URL
                            parts.forEach(function(part) {
                                if (part.match(/https?:\/\/[^\s]+/i) && !extractedUrl) {
                                    extractedUrl = part.trim();
                                }
                            });
                        } else {
                            // 直接匹配第一行中的URL
                            var urlMatch = firstLine.match(/https?:\/\/[^\s]+/i);
                            if (urlMatch) {
                                extractedUrl = urlMatch[0];
                            }
                        }
                    }
                    
                    if (!extractedUrl) {
                        localStorage.setItem(executedKey, 'no_url');
                        console.log('文章ID ' + postId + ' 未提取到有效链接,标记为已检查');
                        return;
                    }
                    console.log('文章ID ' + postId + ' 提取到的第一条链接:', extractedUrl);
    
                    // ========== 步骤3:选择Linkdown类型 ==========
                    var linkdownRadio = $('input[name="download_type"][value="linkdown"]');
                    if (linkdownRadio.length) {
                        linkdownRadio.prop('checked', true);
                        linkdownRadio.trigger('change');
                    }
    
                    // ========== 步骤4:填入Linkdown输入框 ==========
                    var linkdownInput = $('#linkdown_url');
                    if (linkdownInput.length) {
                        linkdownInput.val(extractedUrl);
                    }
    
                    // ========== 步骤5:点击插入访问按钮 ==========
                    var insertBtn = $('#insert-linkdown-btn');
                    if (insertBtn.length) {
                        insertBtn.trigger('click');
                        console.log('文章ID ' + postId + ' 已插入访问按钮短代码');
                    }
    
                    // ========== 步骤6:删除原下载设置中的资源项 ==========
                    if (deleteBtn.length) {
                        window.confirm = function() { return true; };
                        deleteBtn.trigger('click');
                        delete window.confirm;
                        console.log('文章ID ' + postId + ' 已删除原下载设置中的资源项');
                    }
    
                    // ========== 步骤7:自动更新保存文章(核心新增功能) ==========
                    // 生成2-4秒的随机延迟,避免批量更新服务器压力
                    var saveDelay = 2000 + Math.floor(Math.random() * 2000); 
                    setTimeout(function() {
                        // 找到更新按钮并点击
                        var updateBtn = $('#publish');
                        if (updateBtn.length && updateBtn.val() === '更新') {
                            console.log('文章ID ' + postId + ' 开始自动保存更新');
                            updateBtn.trigger('click');
                            
                            // 标记为已完成(包含更新)
                            localStorage.setItem(executedKey, 'updated');
                            console.log('文章ID ' + postId + ' 自动更新完成,标记为已处理');
                        } else {
                            // 兼容新建文章的"发布"按钮(可选)
                            if (updateBtn.length && updateBtn.val() === '发布') {
                                console.log('文章ID ' + postId + ' 是新建文章,跳过自动发布');
                                localStorage.setItem(executedKey, 'draft_skipped');
                            } else {
                                console.log('文章ID ' + postId + ' 未找到更新按钮');
                                localStorage.setItem(executedKey, 'no_update_btn');
                            }
                        }
                    }, saveDelay);
    
                } catch (e) {
                    console.error('文章ID ' + postId + ' 自动迁移下载链接出错:', e);
                    // 出错也标记为已检查,避免重复报错
                    localStorage.setItem(executedKey, 'error');
                }
            }, randomDelay); // 初始随机延迟,分散执行压力
        });
        </script>
        <?php
    }
    add_action('admin_footer', 'b2_auto_migrate_download_link');
    
    /**
     * 可选:添加后台清理标记的功能(在工具菜单显示)
     */
    function b2_clear_download_migrate_marks() {
        add_management_page(
            '清理下载迁移标记',
            '清理下载迁移标记',
            'manage_options',
            'b2-clear-migrate-marks',
            function() {
                ?>
                <div class="wrap">
                    <h1>清理下载迁移标记</h1>
                    <p>点击下方按钮可清理浏览器中记录的文章迁移标记,让所有文章重新执行迁移逻辑。</p>
                    <button id="clear-marks-btn" class="button button-primary">清理所有标记</button>
                    <p id="clear-result" style="margin-top: 10px; color: green; display: none;">标记已清理完成!</p>
                </div>
                <script>
                jQuery('#clear-marks-btn').click(function() {
                    // 遍历localStorage删除所有迁移标记
                    for (var i = 0; i < localStorage.length; i++) {
                        var key = localStorage.key(i);
                        if (key.indexOf('b2_download_migrate_') === 0) {
                            localStorage.removeItem(key);
                        }
                    }
                    jQuery('#clear-result').show();
                    setTimeout(function() {
                        jQuery('#clear-result').hide();
                    }, 3000);
                });
                </script>
                <?php
            }
        );
    }
    add_action('admin_menu', 'b2_clear_download_migrate_marks');

     

    [/content_hide]

  • 新建文章自动勾选下载模块选项

    新建资源下载文章,每次都要复设置开启下载 / 游客权限、选择预设模板,大量整理文章时,每次都要重新选择就会很头大,于是整了个自动选择的代码

    1、代码不懂可以让ai解释给你

    2、代码直接放到functions.php中刷新页面即可使用

    3、代码为前端操作DOM,不操作数据库,也不与数据库进行交互,放心使用

    代码解释:

    1、当【是否开启下载功能】为 0 (关闭)时,自动修改为 1 (开启),反之不做任何修改

    2、当【是否允许游客购买】为 0 (禁止)时,自动修改为 1 (允许),反之不做任何修改

    3、当【选择模版】为 0 (不选择)时,自动修改为 1 (下载模板1),反之不做任何修改。(预设的下载模板如果有多个,在控制台查看模板序号,如图)

    新建文章自动勾选下载模块选项

    如果你不需要某个自动选择功能,也不会代码,可以用ai帮你删掉或禁止。

    都有详细的注释,你也可以通过这个功能,填充更多的默认信息到下载模块的文本框,将文本框id交给AI帮你改即可。

    [content_hide]

    /**
     * 后台自动修正下载相关下拉框默认值
     * 执行顺序:
     * 1. 下载功能开关(b2_open_download):关闭 → 开启
     * 2. 游客购买权限(b2_down_guest_buy):禁止 → 允许
     * 3. 下载模板选择(b2_single_post_download_group_0_template):不选择 → 下载模板1
     */
    function b2_auto_select_download_option() {
        // 安全校验:仅在WordPress后台执行,避免影响前端页面
        if (!is_admin()) {
            return;
        }
    
        // 内联JS脚本(原生JS,无依赖,避免冲突)
        $js_code = <<<JS
    // 等待DOM完全加载后执行(确保能找到所有下拉框元素)
    document.addEventListener('DOMContentLoaded', function() {
        /**************************
         * 第1步:处理「下载功能开关」下拉框
         * 元素ID:b2_open_download(可修改)
         * 逻辑:当前值为0(关闭)→ 改为1(开启);已为1则不操作
         **************************/
        // 1.1 定位下拉框(通过ID精准匹配,修改ID需同步改这里)
        const downloadSwitch = document.getElementById('b2_open_download');
        if (downloadSwitch) {
            // 1.2 判断当前值(0=关闭,1=开启,可根据实际值修改)
            if (downloadSwitch.value === '0') {
                downloadSwitch.value = '1'; // 改为「开启」
                // 触发change事件(确保联动逻辑生效,比如显示/隐藏相关配置,可选保留)
                downloadSwitch.dispatchEvent(new Event('change'));
            }
        }
    
        /**************************
         * 第2步:处理「游客购买权限」下拉框
         * 元素ID:b2_down_guest_buy(可修改)
         * 逻辑:当前值为0(禁止)→ 改为1(允许);已为1则不操作
         **************************/
        // 2.1 定位下拉框(修改ID需同步改这里)
        const guestBuyPerm = document.getElementById('b2_down_guest_buy');
        if (guestBuyPerm) {
            // 2.2 判断当前值(0=禁止,1=允许,可根据实际值修改)
            if (guestBuyPerm.value === '0') {
                guestBuyPerm.value = '1'; // 改为「允许」
                guestBuyPerm.dispatchEvent(new Event('change')); // 触发联动事件
            }
        }
    
        /**************************
         * 第3步:处理「下载模板选择」下拉框
         * 元素ID:b2_single_post_download_group_0_template(可修改)
         * 逻辑:当前值为0(不选择)→ 改为1(下载模板1);已为1则不操作
         **************************/
        // 3.1 定位下拉框(修改ID需同步改这里)
        const downloadTemplate = document.getElementById('b2_single_post_download_group_0_template');
        if (downloadTemplate) {
            // 3.2 判断当前值(0=不选择,1=下载模板1,可根据实际值修改)
            if (downloadTemplate.value === '0') {
                downloadTemplate.value = '1'; // 改为「下载模板1」
                downloadTemplate.dispatchEvent(new Event('change')); // 触发联动事件
            }
        }
    });
    JS;
    
        // 将JS脚本添加到后台页面底部(依赖jquery-core确保加载时机,无需修改)
        wp_add_inline_script('jquery-core', $js_code);
    }
    // 挂载到WordPress后台脚本加载钩子(无需修改)
    add_action('admin_enqueue_scripts', 'b2_auto_select_download_option');

    仅需要关闭下载模块的【是否开启下载功能】,如果监测到下载模块为开启,改为关闭(主要为了配合)以下文章

    [b2_insert_post id=”1940″]

    相关代码

    /**
     * 后台自动关闭下载功能开关
     * 核心逻辑:检测到下载功能开关(b2_open_download)为开启(值=1)→ 自动改为关闭(值=0)
     */
    function b2_auto_close_download_switch() {
        // 安全校验:仅在WordPress后台执行,避免影响前端页面
        if (!is_admin()) {
            return;
        }
    
        // 内联JS脚本(原生JS,无依赖,避免冲突)
        $js_code = <<<JS
    document.addEventListener('DOMContentLoaded', function() {
        /**************************
         * 处理「下载功能开关」下拉框
         * 元素ID:b2_open_download(请核对后台实际ID)
         * 逻辑:当前值为1(开启)→ 改为0(关闭);已为0则不操作
         **************************/
        // 1. 定位下拉框(通过ID精准匹配)
        const downloadSwitch = document.getElementById('b2_open_download');
        if (downloadSwitch) {
            // 2. 判断当前值:1=开启,0=关闭(请核对后台实际值)
            if (downloadSwitch.value === '1') {
                downloadSwitch.value = '0'; // 改为「关闭」
                // 触发change事件(确保后台联动逻辑生效,比如隐藏下载相关配置)
                downloadSwitch.dispatchEvent(new Event('change', { bubbles: true }));
                console.log('下载功能开关已自动关闭(原值为开启)'); // 调试用,可删除
            } else {
                console.log('下载功能开关已是关闭状态,无需操作'); // 调试用,可删除
            }
        } else {
            console.log('未找到下载功能开关下拉框(ID:b2_open_download),请核对ID'); // 调试用,可删除
        }
    });
    JS;
    
        // 将JS脚本添加到后台页面(挂载到jquery-core确保加载时机,原生JS无依赖)
        wp_add_inline_script('jquery-core', $js_code);
    }
    // 挂载到WordPress后台脚本加载钩子
    add_action('admin_enqueue_scripts', 'b2_auto_close_download_switch');

    [/content_hide]

  • 给后台添加自定义按钮

    给后台添加自定义按钮

    代码效果

    为WordPress的文本编辑器添加一些自定义按钮。这些按钮可以插入特定的短代码或HTML标签,从而方便用户在编辑器中快速插入常用的内容格式。

    视频介绍

    代码放置位置

    子主题或父主题的functions.php中

    代码查看

    [content_hide]

    add_action('after_wp_tiny_mce', 'bolo_after_wp_tiny_mce');
     
    function bolo_after_wp_tiny_mce($mce_settings) {
        ?>
    <script type="text/javascript">
        QTags.addButton('custom_tag_1', '按钮 1【按钮名称】', '<div class="custom">', '</div>');
        QTags.addButton('custom_tag_2', '按钮 2【按钮名称】', '<span class="highlight">', '</span>');
        QTags.addButton('custom_tag_3', '按钮 3【按钮名称】', '<p class="note">', '</p>');
    </script>
    <?php
     }

    [/content_hide]

  • 写文章自动选择上次勾选的分类

    写文章自动选择上次勾选的分类

    代码效果

    当你在后台编辑或新建文章时,页面会自动选择之前保存的分类,可以快速继续编辑而不需要重新选择分类。

    这段代码有效地增强了用户体验,确保在编辑文章时能够保留和自动选择用户上次选择的分类。

    视频介绍

    代码放置位置

    子主题或父主题的functions.php中

    2025-11-24 更新两个功能:新版自动勾选,新版强制自动勾选

    [content_hide]

    📦 资源下载
    🔐 提取码:
    grE3C



    立即下载

    [/content_hide]

  • 在functions中全局输出js和css文件

    在functions中全局输出js和css文件

    代码效果

    在你的 WordPress 上,通过 wp_enqueue_scripts 钩子自动全局加载指定路径的 CSS 和 JavaScript 文件

    视频介绍

    代码放置位置

    子主题或父主题的functions.php中

    代码查看

    function bber_css_js() {
        // 输出其他路径的 CSS 文件
        wp_enqueue_style( '唯一标识符', get_stylesheet_directory_uri() . '文件路径', array(), '1.0' );
    
        // 输出其他路径的 JS 文件
        wp_enqueue_script( '唯一标识符', get_stylesheet_directory_uri() . '文件路径', array(), '1.0', true );
    }
    
    add_action( 'wp_enqueue_scripts', 'bber_css_js' );

     

  • 网站顶部动态跑马灯特效

    网站顶部动态跑马灯特效

    资源介绍给网站顶部添加一个动态的跑马灯效果,也是N年前的老特效了,不过还是蛮好看的。

    WordPress&B2主题使用方法

    方法一:将代码放入functions.php中:

    function horseracelamp() {
        echo '<style>#top-grrk{background:url(https://i.ibb.co/ZWNJRZq/image.gif);height:2px;position:fixed;width:100%;Z-index:10000}</style><div id="top-grrk"></div>';
        }
    add_action( 'wp_head', 'horseracelamp', 100 );

    方法二:将代码入header.php中,不要放到head标签内,放在它下面即可。

    <style>
    #header-pmd{
        background:url(https://i.ibb.co/ZWNJRZq/image.gif);
        height:2px;//跑马灯高度
        position:fixed;
        width:100%;
        Z-index:9999;
    }
    </style>    
    <div id="header-pmd"></div>

    [content_hide]

    📦 资源下载
    🔐 提取码:
    w2RRT



    立即下载

    [/content_hide]

  • 文章内容高亮样式代码

    文章内容高亮样式代码

    本文分享了哔哔一二自用的一些文章美化代码,主要是给指定文字内容添加一些样式,以高亮突出重要性。

    这是一段黑色文字的代码效果

    这是一段蓝色文字的代码效果

    这是一段红色文字的代码效果

    这是一段? 链接文字的代码效果

    红色提醒框

    绿色提醒框

    浅色提醒框

    紫色提醒框

    资源介绍文章介绍内容

    代码使用方法

    步骤一:在functions.php中添加按钮代码,添加按钮代码的方法自行查看之前发布的文章。

    [b2_insert_post id=”77″]

    相关按钮代码如下,自行取舍你需要的按钮代码,并不一定要全部复制。代码放置位置参考上方的相关文章自行了解

    add_action('after_wp_tiny_mce', 'bolo_after_wp_tiny_mce');
     
     function bolo_after_wp_tiny_mce($mce_settings) {
         ?>
         <script type="text/javascript">
             QTags.addButton( 'blackfont', '黑色文字', '<span class="blackfont">','</span>');
             QTags.addButton( 'bluefont', '蓝色文字', '<span class="bluefont">','</span>' );
             QTags.addButton( 'redfont', '红色文字', '<span class="redfont">','</span>' );
             QTags.addButton( 'linkfont', '链接文字', '<span class="linkfont">? ','</span>' );
             QTags.addButton( 'tipqian', '浅色提醒', '<span id="tip-qian">','</span>' );
             QTags.addButton( 'tiphong', '红色提醒', '<span id="tip-hong">','</span>' );
             QTags.addButton( 'tiplv', '绿色提醒', '<span id="tip-lv">','</span>' );
             QTags.addButton( 'tipzi', '紫色提醒', '<span id="tip-zi">','</span>' );
             QTags.addButton( 'tipjianjie', '文章介绍', '<span id="diy-tip-jieshao"><span id="tip-title">资源介绍</span><span id="tip-content">资源内容</span></span>' );
         </script>
         <?php
     }

     

    相关样式代码如下,自行取舍你需要的代码。样式代码放到style.css中即可,自己做好注释,方便后续查找

     

    /*黑色文字*/
    .blackfont {
        color: #ffffff;
        padding: 2px 5px;
        background-color: #222528eb;
        border-radius: 3px;
        font-size: 14px;
        margin: 0 3px;
        font-weight: 600;
    }
    
    /*蓝色文字*/
    .bluefont {
        color: #4c4cff;
        padding: 2px 5px;
        background-color: #0000FF26;
        border-radius: 3px;
        font-size: 14px;
        margin: 0 3px;
        font-weight: 600;
    }
    
    /*链接文字*/
    .linkfont {
        color: #4c4cff;
        padding: 2px 5px;
        background-color: #0000FF26;
        border-radius: 3px;
        font-size: 14px;
        margin: 0 3px;
        font-weight: 600;
        transition: all .4s ease-out;
    }
    
    .linkfont:hover {
    
        background-color: #0000ff80;
        transition: all .4s ease-out;
    }
    
    .linkfont:hover a {
        color: #f4f4f4 !important;
        transition: all .4s ease-out;
    }
    
    /*红色文字*/
    .redfont {
        color: #ffffff;
        padding: 2px 5px;
        background-color: #f71a12d4;
        border-radius: 3px;
        font-size: 14px;
        margin: 0 3px;
        font-weight: 600;
    }
    
    /* 浅色提醒 */
    #tip-qian {
        background-color: #FFDEE9;
        background-image: linear-gradient(0deg, #ffdee9c4 0%, #b5fffc8f 100%);
        padding: 10px;
        border-radius: 3px;
        display: inline-block;
        margin: 0px 0 10px 0;
    }
    
    /* 红色提醒 */
    #tip-hong {
        background-color: #ff9a8b66;
        background-image: linear-gradient(220deg, #FF9A8B 0%, #ff6a8838 55%, #FF99AC 100%);
        padding: 10px;
        border-radius: 3px;
        display: inline-block;
        margin: 0px 0 10px 0;
    }
    
    /* 绿色提醒 */
    #tip-lv {
        color: #eeeeee;
        /* 绿色提醒的文字颜色 */
        box-shadow: 6px 0 12px -5px rgb(68, 110, 92), -6px 0 12px -5px rgb(204, 212, 163);
        background-image: linear-gradient(102deg, rgba(68, 110, 92, 1) 17.4%, rgba(107, 156, 120, 1) 49.3%, rgba(154, 183, 130, 1) 83.4%, rgba(247, 237, 191, 1) 110.3%);
        padding: 10px;
        border-radius: 3px;
        display: inline-block;
        margin: 0px 0 10px 0;
    }
    
    /* 紫色提醒 */
    #tip-zi {
        color: #ffffff;
        box-shadow: 6px 0 12px -5px rgb(175, 160, 208), -6px 0 12px -5px rgba(177, 161, 207, 0);
        background-image: radial-gradient(circle farthest-corner at 10% 20%, rgba(95, 117, 227, 1) 0%, rgba(188, 167, 205, 1) 90%);
        padding: 10px;
        border-radius: 3px;
        display: inline-block;
        margin: 0px 0 10px 0;
    }
    
    /*文章简介介绍专用*/
    #diy-tip-jieshao {
        background-color: #FFDEE9;
        background-image: linear-gradient(344deg, #ffdee9c4 0%, #17cd688f 100%);
        color: #393535;
        overflow: hidden;
        border-radius: 3px;
        padding: 8px 15px;
        box-shadow: 6px 0 6px -1px rgba(0, 0, 0, 0.1), -6px 0 6px -1px rgba(0, 0, 0, 0.1);
        width: 100%;
        height: auto;
        display: flex;
        flex-direction: column;
    }
    
    #tip-title {
        font-size: 18px;
        font-weight: 600;
        margin-bottom: 10px;
    }
    
    #tip-content {
        text-indent: 18px;
    }
    
  • 彩色文字框效果

    彩色文字框效果

    彩色代码框介绍本文分享几个彩色文字提醒框,这个代码最早我是在云落作者的网站看到的。时隔多年,再次看这个代码,依然感觉不是很落伍。
    应该是10年前了,如果有老站长应该都知道云落和他的Git主题,虽然也是基于另一个作者的主题修改的,但是Git主题是我正式入坑站长的第一个主题。
    当时云落整天给衡天服务器打广告,最后我买了感觉不好用,用了两天直接送给云落了。他还给我优化了一下网站,也算是我第一次知道网站还要优化。
    现在想想,其实就是做缓存、cdn、减少图片体积以及减少请求次数。但在当时,这些东西对我来说比登天还难……

    效果演示

    绿色提示框
    红色提示框
    黄色提示框
    灰色提示框
    蓝色提示框
    黑色提示框
    虚线提示框
    绿边提示框
    红边提示框

    相关代码,首先要添加按钮。如果你不知到如何添加按钮,可以查看下方的文章

    [b2_insert_post id=”77″]

    在functions.php粘贴彩色框相关代码,这段代码不是按钮代码,需要放在functions.php的其他地方,一般放按钮代码上面即可

    /*彩色文本框 开始*/
    function toz($atts, $content=null){
     return '<div id="sc_notice">'.$content.'</div>';
    }
    add_shortcode('v_notice','toz');
    function toa($atts, $content=null){
     return '<div id="sc_error">'.$content.'</div>';
    }
    add_shortcode('v_error','toa');
    function toc($atts, $content=null){
     return '<div id="sc_warn">'.$content.'</div>';
    }
    add_shortcode('v_warn','toc');
    function tob($atts, $content=null){
     return '<div id="sc_tips">'.$content.'</div>';
    }
    add_shortcode('v_tips','tob');
    function tod($atts, $content=null){
     return '<div id="sc_blue">'.$content.'</div>';
    }
    add_shortcode('v_blue','tod');
    function toe($atts, $content=null){
     return '<div id="sc_black">'.$content.'</div>';
    }
    add_shortcode('v_black','toe');
    function tof($atts, $content=null){
     return '<div id="sc_xuk">'.$content.'</div>';
    }
    add_shortcode('v_xuk','tof');
    function tog($atts, $content=null){
     return '<div id="sc_lvb">'.$content.'</div>';
    }
    add_shortcode('v_lvb','tog');
    function toh($atts, $content=null){
     return '<div id="sc_redb">'.$content.'</div>';
    }
    add_shortcode('v_redb','toh');
    function toi($atts, $content=null){
     return '<div id="sc_orange">'.$content.'</div>';
    }
    add_shortcode('v_orange','toi');
    /*彩色文本框 结束*/

     

    2、按钮相关代码,你可以按需拿取你所需要的代码。

     

    add_action('after_wp_tiny_mce', 'bolo_after_wp_tiny_mce');
     
     function bolo_after_wp_tiny_mce($mce_settings) {
         ?>
         <script type="text/javascript">
             QTags.addButton( 'v_notice', '绿框对勾', '<div id="sc_notice">绿色提示框</div>\n', "" );
             QTags.addButton( 'v_error', '红框禁止', '<div id="sc_error">红色提示框</div>\n', "" );
             QTags.addButton( 'v_warn', '黄框感叹号', '<div id="sc_warn">黄色提示框</div>\n', "" );
             QTags.addButton( 'v_tips', '灰框图钉', '<div id="sc_tips">灰色提示框</div>\n', "" );
             QTags.addButton( 'v_blue', '蓝框小鸟', '<div id="sc_blue">蓝色提示框</div>\n', "" );
             QTags.addButton( 'v_black', '黑框', '<div id="sc_black">黑色提示框</div>\n', "" );
             QTags.addButton( 'v_xuk', '虚线', '<div id="sc_xuk">虚线提示框</div>\n', "" );
             QTags.addButton( 'v_lvb', '绿边', '<div id="sc_lvb">绿边提示框</div>\n', "" );
             QTags.addButton( 'v_redb', '红边', '<div id="sc_redb">红边提示框</div>\n', "" );
         </script>
         <?php
     }

     

    3、提示框相关样式,你可以按需取舍你想要的代码

     

    /*****************彩色代码框样式开始*******/
        #sc_notice {
            color: #7da33c;
            background: #ecf2d6 url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABoAAAAaCAIAAAAmKNuZAAABXklEQVR42u2U2UrDQBSG+8K+heKC653bE/Ra9EZb04CmooI32aABk2C1bRprFibbxB/HNqUpJIHoVeEPzHLmyzlnzpxG826tRjXwXYvrtWiFy3TfO361BJcMExpDbjDSra7QO6mMa0lbxviR0iRNU5pSEn1BGLCpOX6CQVlcS9q0XA0nSeRI/UtO2WPrt8oupiScYMv2jba8XQqnWw848OmbnLKfdwF029NhYNrPxTjki0XXWcZiwhbzsaudFeCQe9jJ/auloBej2VEPMBDfLmCGOApwDhnAu1m+5sUQ2pDHuC3v4KK8wCrARQkJImfmizANh7HeJ+KNuMFW/NAGsQLOIR9h7IGYZzFcnIQVguXVQy8Y4Qd5FgsWhV3qKlBfbMqrR0jQAqvCVeQLBdW7wOKyQjn/3zKu/5FlLYC9eZr8toBpR6jWAubziI6E6wMINeGSwU+DOl019z/D1ahv/4DCs72FOK8AAAAASUVORK5CYII=') -1px -1px no-repeat;
            /*绿框图标链接*/
            border: 1px solid #aac66d;
            overflow: hidden;
            margin: 10px 0;
            padding: 15px 15px 15px 35px;
        }
    
        #sc_warn {
            color: #ad9948;
            background: #fff4b9 url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABoAAAAaCAIAAAAmKNuZAAAA6UlEQVRIx+2UvQ6CMBSFmUicTFx8AV2Q5+DxgAES30J3HVzZjYAS3BnKgCTWAMfcjZRGftLEhZNvIWm/pNzTallgKUTLAguRpoRZ1yI1wGzwEM2b4Df6TI3xulhH7gE1JKmR7xEvButiHeUJv1OeadkgXe6Lm5lNCMm9AbrnDqjEnY8VIaaixT065kiOdl8S3TCnT8fDEToe9ukaPkLX8Em6ZE1IOlNMOmx5Ibp5XyeNgj/wSWSjcHuLYkqKkm6QbmVFMSfVuDigOHZq7P/lkil+AtoXjrngEZoP6hfNkbnC/5ofd6U6hXwBuEe/1fg+Wb0AAAAASUVORK5CYII=') -1px -1px no-repeat;
            /*黄框图标链接*/
            border: 1px solid #eac946;
            overflow: hidden;
            margin: 10px 0;
            padding: 15px 15px 15px 35px;
        }
    
        #sc_error {
            color: #c66;
            background: #ffecea url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABoAAAAaCAIAAAAmKNuZAAABP0lEQVR42u2UzWrCQBSFfVoX/oDGB1DRF1GCOxHX/ruuaRY1GxUqVO0koAZLTGIy6ZGU0VLsjDDtSjgJTGbmm7n33NyE1W5LVALPUzIpRQ/cRS/F4nunc1yv6ekEHTcb0u1OS6W7cVo6bQ4GNAyjKMLb3+2geBhRao5GWCCKm6RStmFgo7/fL1VVz+fj78+5HIbedoupw3yuZTJCONLvY8PHYqErys8rgH6YzbDAGo/5OOQrjk4vFG7lCFPnO1JqVCocHHKPk5eNxu8mvtbrWEZ6PQ7OWa1wLMvXLWnZLIJwCeHgAsfxbZulCf4iR0xvrRZb6VoWiHfgYKU5HH7DNZvXuNDzZAaLwhazQlU5VtRqQlYIFYqifBVKtfq/ZSz/J2MtAOFIaAHXeURHgn00CELXhennBlUuP5r7n+Ek6hNJm/hQEU50HAAAAABJRU5ErkJggg==') -1px -1px no-repeat;
            /*红框图标链接*/
            border: 1px solid #ebb1b1;
            overflow: hidden;
            margin: 10px 0;
            padding: 15px 15px 15px 35px;
        }
    
        #sc_tips {
            color: #777;
            background: #eaeaea url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABoAAAAaCAAAAACMIRMSAAAAkUlEQVQoz73SQQuCQBCGYf//X3Jd7NCh0qgUiigTEiRbKCjRWJa3e80c67s+l/lmJsrURFms5Ne088dEoQMMhUxp0cNVInsfyr1/CGQ6oLaJQCeAzfcYdWhzB16YsIdQrZ+N0Gs1AmM5kSrbKgA3qbJp8haYCbTExXN3NgJd+lRZb/qaapvf5upRFv9+gA9S8wZGXgP/uZcaJgAAAABJRU5ErkJggg==') -1px -1px no-repeat;
            /*灰框图标链接*/
            border: 1px solid #ccc;
            overflow: hidden;
            margin: 10px 0;
            padding: 15px 15px 15px 35px;
        }
    
        #sc_blue {
            color: #1ba1e2;
            background: rgba(27, 161, 226, 0.26) url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABoAAAAaCAIAAAAmKNuZAAAACXBIWXMAAAsTAAALEwEAmpwYAAAABGdBTUEAALGOfPtRkwAAACBjSFJNAAB6JQAAgIMAAPn/AACA6QAAdTAAAOpgAAA6mAAAF2+SX8VGAAACgUlEQVR42mKMmPz0689/DNQA3OxMAAHE8un73x+//1PFuL///gMEEBMzEyMDlQDQKIAAYmKgKgAIICobBxBAVDYOIIBYyNDz/z/Drz////7/z8bMyMKMEvQAAcRCnlnhlnzMTAwHr3979v4PGwvCRIAAIs24f/8Zvv36F23Fn+smCORGWPBN2/N+z5Wv8OQBEEBEGfcfnKZ+/v7PwsTob8yb4yoAFHz6/s+03e9vPv/Fysz07z805QIEEAuhlAnyGpAhKcBiqMjhrMVlqcoJkVp3+vO2i18EuJhBwQfLBwABhNM4oCm///4X5GY2VeKw1eCy0+AE6oTLvvv6b/+1r3wcIF/++4fIVAABxILLd1rSbCZKnK463AqirJgKtp7/AowEYCZFEwcIICzGAR0FdJqHHk+gKS+uvLnv6ldWZiy5EyCAWDBC6p8wD4ujFpeeHAeucNhy/sudl79YWbAYBxBALMgJSoCLycuQL9iUV5gHFEwfv/1lYGTkYmMERigjWO/5hz/WnPx84s53kAg2mwACiAVuFlDeWJHdUZPrybvf609/vv7s552Xv4Hi3ByMcTYC+vLsvdvenb//4/uvfxxsTEw4MidAACFcBwyLR2/+1K158+Ljn28//wGjnxUck68+MSw//omBge/Npz8///wHmYW7SAMIIKhxQKf9+vv/5otfQJVA5TwcTEhlLMOD1783n/tirsIJjEpg6v30/R8uEwECCOE6RrADsSpiY2a48/Ln7Rc/OVgZf4HCE6frAAKI2Ez25y+I8fUnMIwZ8BTfAAFEbBHASFwVABBAVC4+AQKIysYBBBDT33//qWUW0CiAAGLh42QGllfUqrYBAgwAUQrczQJMgSUAAAAASUVORK5CYII=') -1px -1px no-repeat;
            /*蓝框图标链接*/
            border: 1px solid #1ba1e2;
            overflow: hidden;
            margin: 10px 0;
            padding: 15px 15px 15px 35px;
        }
    
        #sc_black {
            border-width: 1px 4px 4px 1px;
            border-style: solid;
            border-color: #3e3e3e;
            margin: 10px 0;
            padding: 15px 15px 15px 35px;
        }
    
        #sc_xuk {
            border: 2px dashed rgb(41, 170, 227);
            background-color: rgb(248, 247, 245);
            margin: 10px 0;
            padding: 15px 15px 15px 35px;
        }
    
        #sc_lvb {
            margin: 10px 0;
            padding: 10px 15px;
            border: 1px solid #e3e3e3;
            border-left: 2px solid #05B536;
            background: #FFF;
        }
    
        #sc_redb {
            margin: 10px 0;
            padding: 10px 15px;
            border: 1px solid #e3e3e3;
            border-left: 2px solid #ED0505;
            background: #FFF;
        }
    
        #sc_organge {
            margin: 10px 0;
            padding: 10px 15px;
            border: 1px solid #e3e3e3;
            border-left: 2px solid #EC8006;
            background: #FFF;
        }

     

  • 一个文件让你的网页丝滑起来

    文件介绍如果你觉得我的网站滚动起来滑滑的,那么就归功于这个JS文件了。由于是古老备份,已经不记得这个文件的出处了,知道的小伙伴可以告知我一下。

    使用方法

    全局引用

    这是一个js文件,应当整站引用。比如放到header.php、footer.php中,全局引用。js文件的引用方法不再多说

    functions.php中全局引用,详细说明可查看下方文章

    [b2_insert_post id=”104″]

    function.php相关代码,将/diy/sihua.js修改为你的文件路径

    // 自定义全局输出文件****************************************
    function bber_css_js() {
        // 输出其他路径的 CSS 文件
        //wp_enqueue_style( '唯一标识符', get_stylesheet_directory_uri() . '文件路径', array(), '1.0' );
    
        // 输出其他路径的 JS 文件
        wp_enqueue_script( 'sihua', get_stylesheet_directory_uri() . '/diy/sihua.js', array(), '1.0', true );
    }
    
    add_action( 'wp_enqueue_scripts', 'bber_css_js' );
    
    

     
    [content_hide]

    📦 资源下载
    🔐 提取码:
    hrIrn



    立即下载

    [/content_hide]