一为（onenav）主题导航 – 导航条弹出 最近访问 记录源码添加教程

一为（onenav）主题导航 – 导航条弹出 最近访问 记录源码添加教程

效果演示站：https://www.weixii.com/

1.添加代码文件 wp-content/themes/onenav/inc/functions/io-header.php

放在 用户按钮 前面

// 最近访问按钮 
echo '<li class="header-icon-btn" style="background:none;border:none;box-shadow:none;cursor:pointer;">
<a href="javascript:;" onclick="toggleEyePop()" 
style="font-size:20px;color:#26b99a;text-decoration:none;display:inline-block;
transition:all 0.3s ease;animation:eyeBreath 3s infinite ease-in-out;line-height:1;"
onmouseover="this.style.transform=\'scale(1.2)\'"
onmouseout="this.style.transform=\'scale(1)\'"
onmousedown="this.style.transform=\'scale(0.92)\'"
onmouseup="this.style.transform=\'scale(1.2)\';">
<svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="#26b99a" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<circle cx="12" cy="12" r="10" stroke-dasharray="1 2" />
<polyline points="12 6 12 12 16 14"></polyline>
</svg>
</a>
</li>';

2.放在io-header.php 文件最后面 另外记的把里面的域名 www.weixii.com搜索换成你自己的

// 最近访问弹框代码
add_action(‘wp_footer’, ‘io_visit_history_html’);
function io_visit_history_html() {
if (is_admin()) return;
?>
<style>@keyframes eyeBreath{0%{opacity:.75}50%{opacity:1}100%{opacity:.75}}.drag-eye-wrap{position:fixed;right:15px;top:55px;z-index:999999;user-select:none}.eye-pop{position:absolute;right:0;top:0;width:300px;background:#fff;border-radius:10px;box-shadow:0 2px 12px rgba(0,0,0,.12);display:none;overflow:hidden;border:1px solid #e8e8e8}.eye-hd{display:flex;justify-content:space-between;align-items:center;padding:10px 14px;border-bottom:1px solid #f2f2f2}.eye-hd h5{margin:0;font-size:14px;font-weight:500;color:#333}.eye-close{border:none;background:none;font-size:18px;cursor:pointer;color:#999;padding:0;line-height:1}.eye-list{margin:0;padding:0;list-style:none;max-height:280px;overflow:auto}.eye-item{display:flex;align-items:center;padding:8px 12px;border-bottom:1px solid #f7f7f7;gap:8px}.eye-ico{width:28px;height:28px;border-radius:50%;flex-shrink:0;overflow:hidden;background:#f5f5f5}.eye-name{flex:1;font-size:13px;color:#333;cursor:pointer;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.eye-name:hover{color:#26b99a}.eye-count{font-size:11px;background:#36cfa0;color:#fff;padding:2px 6px;border-radius:10px;flex-shrink:0}.eye-del{border:none;background:none;color:#bbb;cursor:pointer;font-size:14px;flex-shrink:0;padding:0 4px}.eye-clear{width:calc(100% – 20px);margin:8px 10px 10px;border:1px solid #eee;padding:6px;background:#fff;cursor:pointer;font-size:13px;border-radius:6px;color:#666}.eye-empty{text-align:center;padding:25px 10px;color:#999;font-size:13px}.eye-list::-webkit-scrollbar{width:4px}.eye-list::-webkit-scrollbar-thumb{background:#ddd;border-radius:2px}.eye-list::-webkit-scrollbar-track{transparent}@media (max-width:768px){.drag-eye-wrap{right:8px;top:50px}.eye-pop{width:calc(100vw – 20px);right:0}}</style>
<div class=”drag-eye-wrap”><div class=”eye-pop” id=”eyePop”><div class=”eye-hd”><h5>最近访问</h5><span class=”eye-close” onclick=”closeEyePop()”>×</span></div><ul class=”eye-list” id=”eyeList”></ul><button class=”eye-clear” onclick=”clearEyeAll()”>清空全部历史</button></div></div>
<script>
const STORAGE_KEY=”visit_history_data”,siteHost=”www.8nav.com”,maxHistory=25;
const eyePop=document.getElementById(“eyePop”),eyeList=document.getElementById(“eyeList”);
let popStatus=!1;

const Storage={get:()=>{try{return JSON.parse(localStorage.getItem(STORAGE_KEY))||[]}catch{return[]}},set:d=>localStorage.setItem(STORAGE_KEY,JSON.stringify(d))};
const cutName=n=>n?.length>18?n.slice(0,18)+”…”:n||”未知页面”;
const isBanUrl=u=>{try{const o=new URL(u);return o.host!==siteHost||!o.pathname.startsWith(“/sites”)}catch{return!0}};

function renderList(){const d=Storage.get();eyeList.innerHTML=d.length?d.map((i,n)=>(`<li class=”eye-item”>${i.ico?`<img class=”eye-ico” src=”${i.ico}” onerror=”this.style.display=’none'”>`:'<div class=”eye-ico”></div>’}<div class=”eye-name” data-url=”${i.url}” title=”${i.name}”>${cutName(i.name)}</div><span class=”eye-count”>${i.n}次</span><span class=”eye-del” data-i=”${n}”>×</span></li>`)).join(“”):'<li class=”eye-empty”>暂无访问记录</li>’}

eyeList.onclick=e=>{e.stopPropagation();const t=e.target.closest(“.eye-name”);t&&window.open(t.dataset.url,”_blank”);const d=e.target.closest(“.eye-del”);if(d){const t=Storage.get();t.splice(+d.dataset.i,1),Storage.set(t),renderList()}};

const toggleEyePop=()=>{popStatus=!popStatus,eyePop.style.display=popStatus?”block”:”none”,popStatus&&renderList()};
const closeEyePop=()=>{popStatus=!1,eyePop.style.display=”none”};
const clearEyeAll=()=>{Storage.set([]),renderList()};

function addVisit(t,o,e){if(!t||isBanUrl(t))return;const d=Storage.get(),n=d.findIndex(i=>i.url===t);n>-1?(i=d.splice(n,1)[0],i.n++,d.unshift(i)):(d.length>=maxHistory&&d.pop(),d.unshift({url:t,name:o,n:1,ico:e||””})),Storage.set(d)}

document.addEventListener(“click”,t=>{const o=t.target.closest(“a”);o?.href&&addVisit(o.href,o.innerText||document.title,o.querySelector(“img”)?.src);const e=t.target.closest(“.site-item”);e?.dataset.href&&addVisit(e.dataset.href,e.querySelector(“.site-name”)?.innerText||””,””);popStatus&&!eyePop.contains(t.target)&&!t.target.closest(“.header-icon-btn”)&&closeEyePop()});
</script>
<?php
}