WordPress相关功能实现

𝐢𝐭𝐞𝐲𝐮 丨2025年03月18日丨57阅读丨0评论

WordPress文章更新时间调用方法

这个方法的主要功能是，文章内容具有时效性，提醒用户注意文章最新的修改更新时间，如果是更新时间过于久远，说明这篇文章的价值不高~

在主题根目录下的functions.php文件添加如下代码，我的是子比主题，根据主题functions.php文件提示，您可以在当前目录下新建一个 func.php 的文件，然后在最顶部写上 <?php ，再写入您的php代码，主题会自动判断文件进行引入~

function last_modified_shortcode() {
    // 获取当前文章的最后更新时间
    if (is_single()) { // 确保只在文章页面生效
        $last_modified = get_the_modified_time('Y-m-d H:i:s');

        // 输出带样式的 HTML 结构
        return '
        <div class="last-modified-box">
        ⚠️注：某些资源具有时效性，请留意本文最后更新时间: ' . $last_modified . '
        </div>';
    }
    return '';
}
add_shortcode('last_modified', 'last_modified_shortcode');

调用方法

[last_modified]

除此之外还需要定义last-modified-box的CSS样式，以下是我的样式

/* 自定义 文章时效提醒样式 */
.last-modified-box {
    background: rgba(255, 188, 68, 0.38);
    background-image: url(/lmcms/img/2210123621994.png);
    background-clip: padding-box;
    background-size: cover; /* 背景图片覆盖整个容器 */
    background-repeat: no-repeat;
    background-position: center; /* 背景图片居中 */
    background-blend-mode: normal;
    border-radius: 8px;
    min-height: 50px; /* 使用 min-height 替代固定高度 */
    width: 100%; /* 宽度自适应 */
    display: flex;
    align-items: center;
    padding: 3px; /* 统一内边距 */
    font-family: Arial, sans-serif;
    font-size: 16px; /* PC 端默认字体大小 */
    color: #856404;
    border: 1px solid #ffeeba;
    font-weight: bold;
    box-sizing: border-box; /* 确保 padding 和 border 不增加容器宽度 */
    margin-bottom: 20px; /* 添加底部间距 */
}

/* 响应式调整 */
@media (max-width: 768px) {
    .last-modified-box {
        font-size: 14px; /* 平板端字体大小 */
        padding: 8px; /* 平板端内边距 */
        min-height: 40px; /* 平板端高度 */
    }
}

@media (max-width: 480px) {
    .last-modified-box {
        font-size: 12px; /* 移动端字体大小 */
        padding: 6px; /* 移动端内边距 */
        min-height: 30px; /* 移动端高度 */
    }
}

注：我的是子比主题，所以我在后台设置界面引入了自己的lm_style.css文件，css就写在这里，你自己根据需求添加修改自己样式即可~

全站禁止右键与调试

我的是子比主题，直接在自定义代码处加上以下代码即可实现

    //按键触发
    document.onkeydown = function(){
    //禁止ctrl+u
    if (event.ctrlKey && window.event.keyCode==85){
    notyf("嘿！别瞎按，老弟，在干嘛呢？已记录你的IP！", "warning");
    return false;
    }
    //禁止 F12
    if (window.event && window.event.keyCode == 123) {
    notyf("嘿！Bingo~老弟，试试 Alt+Shift+Fn+F4！", "warning");
    event.keyCode = 0;
    event.returnValue = false;
    }
    //禁止 CTRL+SHIFT+I
    if (window.event && window.event.keyCode == 73) {
    notyf("嘿！哈哈哈，老弟，调试方法也得换换哟~", "warning");
    event.keyCode = 0;
    event.returnValue = false;
    }
    //禁止ctrl+s
    if (event.ctrlKey && window.event.keyCode==83){
    notyf("当前页面不能使用CTRL+S！", "warning");
    return false;
    }
    //禁止 F5 
    if (window.event && window.event.keyCode == 116) {
    notyf("当前页面不能使用F5！", "warning");
    event.keyCode = 0;
    event.returnValue = false;
    }
    }
    //网站禁止右键
    document.body.oncontextmenu = function() {
    notyf("嘿！没有右键菜单，复制请用键盘快捷键 Ctrl+C！", "warning");
    self.event.returnValue=false
};
    //网站禁止选择文字
    //document.body.onselectstart = function() {
    //notyf("当前页面禁止选择文字！", "warning");
    //self.event.returnValue=false
//};
    //复制成功
    document.body.oncopy = function() {
    notyf("嘿！复制成功，若要转载请务必保留原文链接！");
};

//F12禁用提醒禁止调试-->
(function noDebuger() {
    function testDebuger() {
        var d = new Date();
        debugger;
        if (new Date() - d > 10) {
            document.body.innerHTML = '<div style="width: 100%;height: 50px;font-size: 30px;text-align: center;font-weight: bold;">小子你要干什么？</br><a href="https://lmcms.com/" target="_blank" style="color:#4285f4;">点击返回</a></div>';
            return true;
        }
        return false;
    }
    function start() {
        while (testDebuger()) {
            testDebuger();
        }
    }
    if (!testDebuger()) {
        window.onblur = function () {
            setTimeout(function () {
                start();
            }, 500)
        }
    }else {
        start();
    }
})();
 
//F12禁用提醒禁止调试结束-->

子比主题网站底部添加滚动波浪手机端PC端自适应

1.把下面代码放到主题设置里的自定义CSS代码里。

/*网站底部波浪*/
.waves {
  position: relative;
  width: 100%;
  height: 15vh;
  margin-bottom: -7px;
  min-height: 50px;
  max-height: 80px;
}

.parallax>use {
  animation: move-forever 25s cubic-bezier(.55, .5, .45, .5)infinite;
}

.parallax>use:nth-child(1) {
  animation-delay: -2s;
  animation-duration: 7s;
}

.parallax>use:nth-child(2) {
  animation-delay: -3s;
  animation-duration: 10s;
}

.parallax>use:nth-child(3) {
  animation-delay: -4s;
  animation-duration: 13s;
}

.parallax>use:nth-child(4) {
  animation-delay: -5s;
  animation-duration: 20s;
}

@keyframes move-forever {
  0% {
    transform: translate3d(-90px, 0, 0);
  }

  100% {
    transform: translate3d(85px, 0, 0);
  }
}


@media (max-width:768px) {
  .waves {
    height: 40px;
    min-height: 40px;
  }

  .waves-inner {
    padding-top: 50px;
  }

  .mg-b {
    margin-bottom: 0;
  }

  .home_row {
    padding: 0px !important;
  }
}

.apply_link {
  float: right;
}

2.然后打开子比主题文件夹的footer.php文件，把下面的代码放到 <footer class="footer"> 标签的前面即可。

<svg class="waves" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 24 150 28" preserveAspectRatio="none" shape-rendering="auto"style="bottom: 4px;">
    <defs>
        <path id="gentle-wave" d="M-160 44c30 0 58-18 88-18s 58 18 88 18 58-18 88-18 58 18 88 18 v44h-352z"></path>
    </defs>
    <g class="parallax">
        <use xlink:href="#gentle-wave" x="48" y="0" fill="var(--float-btn-bg)"></use>
        <use xlink:href="#gentle-wave" x="48" y="3" fill="var(--main-shadow)"></use>
        <use xlink:href="#gentle-wave" x="48" y="5" fill="var(--main-border-color)"></use>
        <use xlink:href="#gentle-wave" x="48" y="7" fill="var(--main-bg-color)"></use>
    </g>
</svg>

0赞

暂无标签