huyuanxiang
/
official-website-abroad
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

[add]改版首页、添加加入我们、产品列表页面

Browse Source
dev
huyuanxiang 3 weeks ago
parent d46195d9f4
commit 5519bdf676
9 changed files with 517 additions and 120 deletions
Show Stats Download Patch File Download Diff File

14
.htaccess
Unescape View File

@ -8,4 +8,18 @@ RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . /index.php [L]
</IfModule>
# BEGIN WordPress
# The directives (lines) between "BEGIN WordPress" and "END WordPress" are
# dynamically generated, and should only be modified via WordPress filters.
# Any changes to the directives between these markers will be overwritten.
<IfModule mod_rewrite.c>
RewriteEngine On
RewriteRule .* - [E=HTTP_AUTHORIZATION:%{HTTP:Authorization}]
RewriteBase /
RewriteRule ^index\.php$ - [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . /index.php [L]
</IfModule>
# END WordPress

2
wp-content/themes/nenghui-energy-theme-4/assets/css/feature-module.css
Unescape View File

@ -2,7 +2,7 @@
/* feature-module 模块 */
.feature-module {
width: 100%;
max-width: 1300px;
max-width: 1320px;
margin: 40px auto;
overflow: hidden;
background-color: #fff;

67
wp-content/themes/nenghui-energy-theme-4/assets/css/index.css
Unescape View File

@ -4,7 +4,7 @@
margin: 0;
padding: 0;
box-sizing: border-box;
font-family: "calibri","PingFang SC", Arial, sans-serif;
/* font-family: "calibri","PingFang SC", Arial, sans-serif; */
}
/* 链接样式 */
@ -800,15 +800,15 @@ img {
}
.footer-container {
max-width: 1300px;
max-width: 1320px;
margin: 0 auto;
padding: 0 20px;
}
.footer-main {
display: grid;
grid-template-columns: 1fr 3fr 1fr;
gap: 0;
grid-template-columns: 1fr auto;
gap: 10px;
margin-bottom: 40px;
}
@ -834,6 +834,65 @@ img {
display: flex;
gap: 15px;
}
/* 社交图标基础样式 (适配浅色背景) */
.social-btn {
position: relative;
width: 42px;
height: 42px;
display: flex;
align-items: center;
justify-content: center;
border-radius: 50%;
/* 默认状态：深色图标，浅色背景 */
background: #ffffff; /* 纯白背景 */
border: 1px solid rgba(13, 27, 23, 0.1); /* 极淡的深色边框 */
color: #0d1b17; /* 深绿色/黑色图标，确保可见性 */
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.05); /* 轻微阴影增加层次感 */
transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
cursor: pointer;
overflow: hidden;
}
/* --- 悬停通用效果 --- */
.social-btn:hover {
transform: translateY(-4px); /* 上浮 */
color: #ffffff; /* 图标反白 */
border-color: transparent;
}
/* --- 品牌色定义 (悬停时触发) --- */
/* LinkedIn Blue */
.social-btn.linkedin:hover {
background: #0077b5;
box-shadow: 0 10px 20px -5px rgba(0, 119, 181, 0.4);
}
/* Facebook Blue */
.social-btn.facebook:hover {
background: #1877f2;
box-shadow: 0 10px 20px -5px rgba(24, 119, 242, 0.4);
}
/* X (Twitter) Black */
.social-btn.twitter:hover {
background: #000000;
box-shadow: 0 10px 20px -5px rgba(0, 0, 0, 0.3);
}
/* YouTube Red */
.social-btn.youtube:hover {
background: #ff0000;
box-shadow: 0 10px 20px -5px rgba(255, 0, 0, 0.4);
}
/* --- 点击反馈 --- */
.social-btn:active {
transform: translateY(-1px);
box-shadow: 0 2px 5px rgba(0,0,0,0.1);
}
.social-link {
display: flex;

232
wp-content/themes/nenghui-energy-theme-4/assets/js/index.js
Unescape View File

@ -1,6 +1,120 @@
// 这是自定义JS文件，用于覆盖主题默认JS文件
/**
* AdvancedImageLoader
* 通用图片加载管理器：支持懒加载、预加载、骨架屏控制
*/
class AdvancedImageLoader {
constructor(options = {}) {
this.options = Object.assign({
rootMargin: '200px 0px', // 提前 200px 开始加载
threshold: 0.01, // 只要露出 1% 就加载
selector: '.lazy-target',// 需要懒加载的目标选择器
skeletonClass: 'skeleton-pulse', // 骨架屏动画类名
loadedClass: 'loaded', // 加载完成后的 CSS 类名
}, options);
this.observer = null;
this.init();
}
init() {
if ('IntersectionObserver' in window) {
this.observer = new IntersectionObserver((entries, observer) => {
entries.forEach(entry => {
if (entry.isIntersecting) {
this.loadImage(entry.target);
observer.unobserve(entry.target);
}
});
}, {
rootMargin: this.options.rootMargin,
threshold: this.options.threshold
});
}
this.scan();
}
/**
* 扫描 DOM，寻找未加载的图片并加入观察队列
* 注意：在动态渲染（如搜索、翻页）后必须调用此方法
*/
scan() {
const elements = document.querySelectorAll(`${this.options.selector}:not(.${this.options.loadedClass})`);
elements.forEach(el => {
// 如果浏览器不支持 Observer，直接加载
if (!this.observer) {
this.loadImage(el);
} else {
this.observer.observe(el);
}
});
}
/**
* 核心加载逻辑
* @param {HTMLElement} el 目标 DOM 元素
*/
loadImage(el) {
const bgSrc = el.getAttribute('data-bg');
const imgSrc = el.getAttribute('data-src');
// 寻找外层包裹的骨架屏容器（如果有）
const skeleton = el.closest('.skeleton-wrapper');
if (!bgSrc && !imgSrc) return;
// 1. 创建内存对象进行预加载 (Preload)
const loader = new Image();
loader.onload = () => {
// 2. 图片下载完毕，更新 DOM
if (bgSrc) {
el.style.backgroundImage = `url("${bgSrc}")`;
}
if (imgSrc) {
el.setAttribute('src', imgSrc);
}
// 3. 触发 CSS 动画 (Fade-in)
// 使用 requestAnimationFrame 确保样式重绘顺滑
requestAnimationFrame(() => {
el.classList.add(this.options.loadedClass);
});
// 4. 关闭骨架屏动画
if (skeleton) {
skeleton.classList.remove(this.options.skeletonClass);
// 可选：加载完成后移除背景色，或者保留作为底色
// skeleton.style.backgroundColor = 'transparent';
}
};
loader.onerror = () => {
console.warn('Image load failed:', bgSrc || imgSrc);
// 即使失败也移除动画，避免一直闪烁
if (skeleton) skeleton.classList.remove(this.options.skeletonClass);
};
// 开始下载
loader.src = bgSrc || imgSrc;
}
/**
* 手动强制预加载一组图片（不等待进入视口）
* 适用于：轮播图的首屏图片、模态框弹出前的图片
* @param {Array} urls 图片链接数组
*/
static preloadBatch(urls) {
urls.forEach(url => {
const img = new Image();
img.src = url;
});
}
}
document.addEventListener('DOMContentLoaded', function() {
// 加载图片，支持懒加载、预加载、骨架屏控制
window.ImageLoader = new AdvancedImageLoader();
// 菜单切换
const menuToggle = document.querySelector('.menu-toggle');
const navMenu = document.querySelector('.nav-menu');
@ -122,67 +236,67 @@ document.addEventListener('DOMContentLoaded', function() {
let lastScroll = 0;
const nav = document.querySelector('.main-nav');
window.addEventListener('scroll', function() {
const currentScroll = window.pageYOffset;
// window.addEventListener('scroll', function() {
// const currentScroll = window.pageYOffset;
// 到顶部时显示导航栏并清除背景和阴影
if (currentScroll <= 0) {
nav.classList.remove('scrolled');
nav.style.transform = 'translateY(0)';
nav.style.backgroundColor = '';
nav.style.boxShadow = '';
// 设置主菜单项颜色为白色
const menuLinks = nav.querySelectorAll('.menu-items > li > a');
menuLinks.forEach(link => {
link.style.color = '#333';
});
// 确保下拉菜单项保持黑色
const subMenuLinks = nav.querySelectorAll('.sub-menu li a');
subMenuLinks.forEach(link => {
link.style.color = '#333';
});
} else if (currentScroll > 80) {
// 滚动超过80px时添加背景和阴影
nav.classList.add('scrolled');
nav.style.backgroundColor = '#fff';
nav.style.boxShadow = '0 2px 10px rgba(0, 0, 0, 1)';
// 设置主菜单项颜色为黑色
const menuLinks = nav.querySelectorAll('.menu-items > li > a');
menuLinks.forEach(link => {
link.style.color = '#000';
});
// 确保下拉菜单项保持黑色
const subMenuLinks = nav.querySelectorAll('.sub-menu li a');
subMenuLinks.forEach(link => {
link.style.color = '#333';
});
if (currentScroll > lastScroll) {
// 向下滚动时显示导航栏
nav.style.transform = 'translateY(0)';
} else {
// 向上滚动时隐藏导航栏
nav.style.transform = 'translateY(-100%)';
}
} else {
// 滚动在0-80px之间时清除背景和阴影
nav.classList.remove('scrolled');
nav.style.backgroundColor = '';
nav.style.boxShadow = '';
nav.style.transform = 'translateY(0)';
// 设置主菜单项颜色为白色
const menuLinks = nav.querySelectorAll('.menu-items > li > a');
menuLinks.forEach(link => {
link.style.color = '#333';
});
// 确保下拉菜单项保持黑色
const subMenuLinks = nav.querySelectorAll('.sub-menu li a');
subMenuLinks.forEach(link => {
link.style.color = '#333';
});
}
// // 到顶部时显示导航栏并清除背景和阴影
// if (currentScroll <= 0) {
// nav.classList.remove('scrolled');
// nav.style.transform = 'translateY(0)';
// nav.style.backgroundColor = '';
// nav.style.boxShadow = '';
// // 设置主菜单项颜色为白色
// const menuLinks = nav.querySelectorAll('.menu-items > li > a');
// menuLinks.forEach(link => {
// link.style.color = '#333';
// });
// // 确保下拉菜单项保持黑色
// const subMenuLinks = nav.querySelectorAll('.sub-menu li a');
// subMenuLinks.forEach(link => {
// link.style.color = '#333';
// });
// } else if (currentScroll > 80) {
// // 滚动超过80px时添加背景和阴影
// nav.classList.add('scrolled');
// nav.style.backgroundColor = '#fff';
// nav.style.boxShadow = '0 2px 10px rgba(0, 0, 0, 1)';
// // 设置主菜单项颜色为黑色
// const menuLinks = nav.querySelectorAll('.menu-items > li > a');
// menuLinks.forEach(link => {
// link.style.color = '#000';
// });
// // 确保下拉菜单项保持黑色
// const subMenuLinks = nav.querySelectorAll('.sub-menu li a');
// subMenuLinks.forEach(link => {
// link.style.color = '#333';
// });
// if (currentScroll > lastScroll) {
// // 向下滚动时显示导航栏
// nav.style.transform = 'translateY(0)';
// } else {
// // 向上滚动时隐藏导航栏
// nav.style.transform = 'translateY(-100%)';
// }
// } else {
// // 滚动在0-80px之间时清除背景和阴影
// nav.classList.remove('scrolled');
// nav.style.backgroundColor = '';
// nav.style.boxShadow = '';
// nav.style.transform = 'translateY(0)';
// // 设置主菜单项颜色为白色
// const menuLinks = nav.querySelectorAll('.menu-items > li > a');
// menuLinks.forEach(link => {
// link.style.color = '#333';
// });
// // 确保下拉菜单项保持黑色
// const subMenuLinks = nav.querySelectorAll('.sub-menu li a');
// subMenuLinks.forEach(link => {
// link.style.color = '#333';
// });
// }
lastScroll = currentScroll;
});
// lastScroll = currentScroll;
// });
// 鼠标移入移出导航栏效果
nav.addEventListener('mouseenter', function() {

247
wp-content/themes/nenghui-energy-theme-4/footer.php
Unescape View File

@ -5,73 +5,84 @@
<!-- Logo 和公司信息 -->
<div class="footer-brand">
<div class="footer-logo">
<img src="https://nenghui.com/wp-content/uploads/2025/11/logo-2.png" alt="<?php bloginfo('name'); ?>" style=" height: 32px;" class="logo-img">
</div>
<div class="footer-social">
<a href="https://www.linkedin.com/company/nenghuitech" class="social-link linkedin" aria-label="LinkedIn">
<svg width="20" height="20" viewBox="0 0 24 24" fill="currentColor">
<path d="M20.447 20.452h-3.554v-5.569c0-1.328-.027-3.037-1.852-3.037-1.853 0-2.136 1.445-2.136 2.939v5.667H9.351V9h3.414v1.561h.046c.477-.9 1.637-1.85 3.37-1.85 3.601 0 4.267 2.37 4.267 5.455v6.286zM5.337 7.433c-1.144 0-2.063-.926-2.063-2.065 0-1.138.92-2.063 2.063-2.063 1.14 0 2.064.925 2.064 2.063 0 1.139-.925 2.065-2.064 2.065zm1.782 13.019H3.555V9h3.564v11.452zM22.225 0H1.771C.792 0 0 .774 0 1.729v20.542C0 23.227.792 24 1.771 24h20.451C23.2 24 24 23.227 24 22.271V1.729C24 .774 23.2 0 22.222 0h.003z"/>
</svg>
</a>
<a href="https://www.facebook.com/nenghuitech" class="social-link facebook" aria-label="Facebook">
<svg width="20" height="20" viewBox="0 0 24 24" fill="currentColor">
<path d="M24 12.073c0-6.627-5.373-12-12-12s-12 5.373-12 12c0 5.99 4.388 10.954 10.125 11.854v-8.385H7.078v-3.47h3.047V9.43c0-3.007 1.792-4.669 4.533-4.669 1.312 0 2.686.235 2.686.235v2.953H15.83c-1.491 0-1.956.925-1.956 1.874v2.25h3.328l-.532 3.47h-2.796v8.385C19.612 23.027 24 18.062 24 12.073z"/>
</svg>
</a>
<a href="https://x.com/NenghuiTech" class="social-link twitter" aria-label="Twitter">
<svg width="20" height="20" viewBox="0 0 24 24" fill="currentColor">
<path d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z"/>
</svg>
</a>
<h3 class="font-display text-[#111318] dark:text-white text-3xl md:text-2xl font-black leading-tight tracking-tight mb-4 bg-clip-text text-transparent bg-gradient-to-r from-gray-900 to-gray-600 dark:from-white dark:to-gray-400"> Follow NENGHUI</h3>
<!-- <img src="https://nenghui.com/wp-content/uploads/2025/11/logo-2.png" alt="<?php bloginfo('name'); ?>" style=" height: 32px;" class="logo-img"> -->
</div>
<div class="footer-social flex items-center gap-4">
<!-- LinkedIn -->
<a href="https://www.linkedin.com/company/nenghuitech" class="social-btn group linkedin" aria-label="LinkedIn">
<svg width="20" height="20" viewBox="0 0 24 24" fill="currentColor">
<path d="M20.447 20.452h-3.554v-5.569c0-1.328-.027-3.037-1.852-3.037-1.853 0-2.136 1.445-2.136 2.939v5.667H9.351V9h3.414v1.561h.046c.477-.9 1.637-1.85 3.37-1.85 3.601 0 4.267 2.37 4.267 5.455v6.286zM5.337 7.433c-1.144 0-2.063-.926-2.063-2.065 0-1.138.92-2.063 2.063-2.063 1.14 0 2.064.925 2.064 2.063 0 1.139-.925 2.065-2.064 2.065zm1.782 13.019H3.555V9h3.564v11.452zM22.225 0H1.771C.792 0 0 .774 0 1.729v20.542C0 23.227.792 24 1.771 24h20.451C23.2 24 24 23.227 24 22.271V1.729C24 .774 23.2 0 22.222 0h.003z"/>
</svg>
</a>
<!-- Facebook -->
<a href="https://www.facebook.com/nenghuitech" class="social-btn group facebook" aria-label="Facebook">
<svg width="20" height="20" viewBox="0 0 24 24" fill="currentColor">
<path d="M24 12.073c0-6.627-5.373-12-12-12s-12 5.373-12 12c0 5.99 4.388 10.954 10.125 11.854v-8.385H7.078v-3.47h3.047V9.43c0-3.007 1.792-4.669 4.533-4.669 1.312 0 2.686.235 2.686.235v2.953H15.83c-1.491 0-1.956.925-1.956 1.874v2.25h3.328l-.532 3.47h-2.796v8.385C19.612 23.027 24 18.062 24 12.073z"/>
</svg>
</a>
<!-- X (Twitter) -->
<a href="https://x.com/NenghuiTech" class="social-btn group twitter" aria-label="Twitter">
<svg width="20" height="20" viewBox="0 0 24 24" fill="currentColor">
<path d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z"/>
</svg>
</a>
<!-- YouTube -->
<a href="https://www.youtube.com/@NenghuiTech" class="social-btn group youtube" aria-label="YouTube">
<svg width="20" height="20" viewBox="0 0 24 24" fill="currentColor">
<path d="M23.498 6.186a3.016 3.016 0 0 0-2.122-2.136C19.505 3.545 12 3.545 12 3.545s-7.505 0-9.377.505A3.017 3.017 0 0 0 .502 6.186C0 8.07 0 12 0 12s0 3.93.502 5.814a3.016 3.016 0 0 0 2.122 2.136c1.871.505 9.376.505 9.376.505s7.505 0 9.377-.505a3.015 3.015 0 0 0 2.122-2.136C24 15.93 24 12 24 12s0-3.93-.502-5.814zM9.545 15.568V8.432L15.818 12l-6.273 3.568z"/>
</svg>
</a>
</div>
</div>
<!-- 导航菜单区域 -->
<div class="footer-nav">
<div class="footer-nav-column">
<h3 class="footer-nav-title">Products</h3>
<h3 class="footer-nav-title">ABOUT US</h3>
<ul class="footer-nav-list">
<li><a href="https://nenghui.com/products/ne418l/">NB418L</a></li>
<li><a href="https://nenghui.com/products/ne233l/">NE233L</a></li>
<li><a href="https://nenghui.com/products/ne261l/">NE261L</a></li>
<li><a href="https://nenghui.com/products/n20hc5000/">N20HC5000</a></li>
<li><a href="https://nenghui.com/products/nh-ics180-261/">NH-ICS180-261</a></li>
<li><a href="/about-us">Company Profile</a></li>
<li><a href="/honor">Certifications & Accreditations</a></li>
<li><a href="/cases">Cases</a></li>
<li><a href="/news">News</a></li>
</ul>
</div>
<div class="footer-nav-column">
<h3 class="footer-nav-title">Support</h3>
<h3 class="footer-nav-title">PRODUCTS & SOLUTIONNS</h3>
<ul class="footer-nav-list">
<li><a href="https://nenghui.com/download-center/">Download Center</a></li>
<li><a href="https://nenghui.com/support/">Service</a></li>
<li><a href="https://nenghui.com/faq/">FAQ</a></li>
<li><a href="/pros/">Products</a></li>
<li><a href="/epc-solutions">EPC & Energy Solutions</a></li>
</ul>
</div>
<div class="footer-nav-column">
<h3 class="footer-nav-title">ABOUT US</h3>
<h3 class="footer-nav-title">CONTACT US</h3>
<ul class="footer-nav-list">
<li><a href="https://nenghui.com/about-us/">Company Profile</a></li>
<li><a href="https://nenghui.com/honor/">Certifications & Accreditations</a></li>
<li><a href="https://nenghui.com/oem/">OEM</a></li>
<li><a href="/contact-us">Contact Us</a></li>
<li><a href="/join-us/">Join Us</a></li>
</ul>
</div>
<div class="footer-nav-column">
<h3 class="footer-nav-title">Contact us</h3>
<div class="footer-nav-column">
<h3 class="footer-nav-title">SERVICE & SUPPURT</h3>
<ul class="footer-nav-list">
<li><a href="https://nenghui.com/contact-us/">Contact us</a></li>
<li><a href="/download-center/">Download Center</a></li>
<li><a href="/support/">Service</a></li>
<li><a href="/faq/">FAQ</a></li>
</ul>
</div>
</div>
<!-- 订阅区域 -->
<div class="footer-subscribe">
<!-- <div class="footer-subscribe">
<?php echo do_shortcode('[fluentform id="3"]'); ?>
</div>
</div> -->
</div>
<!-- 分隔线 -->
@ -111,5 +122,157 @@
});
</script>
</footer>
<!--
核心修复 1: 外层容器添加 pointer-events-none
这确保了容器本身不会阻挡鼠标，鼠标可以穿透空白区域点击到底层页面
-->
<div class="fixed bottom-8 right-8 z-[90] flex flex-col-reverse items-end gap-4 group/widget pointer-events-none">
<!-- 1. Toggle Button -->
<!--
核心修复 2: 按钮添加 pointer-events-auto
因为外层禁用了交互，这里必须显式开启，否则按钮也点不动了
-->
<button id="support-btn" onclick="toggleSupportMenu()" class="pointer-events-auto relative size-16 bg-primary text-[#0d1b17] rounded-full shadow-[0_10px_30px_rgba(19,236,164,0.3)] flex items-center justify-center transition-all duration-500 hover:scale-110 hover:shadow-[0_0_40px_rgba(19,236,164,0.5)] z-50 border border-white/20 cursor-pointer">
<div class="absolute inset-0 rounded-full border border-white/40 opacity-0 scale-50 transition-all duration-1000 ease-out group-hover/widget:scale-150 group-hover/widget:opacity-100 animate-[ping_2s_infinite]"></div>
<div class="relative w-full h-full flex items-center justify-center">
<span id="icon-chat" translate="no" class="material-symbols-outlined notranslate text-3xl transition-all duration-300 rotate-0 opacity-100 absolute">&#xf0e2;</span>
<span id="icon-close" translate="no" class="material-symbols-outlined notranslate text-3xl transition-all duration-300 absolute text-white opacity-0 -rotate-90 scale-50">&#xe5cd;</span>
</div>
</button>
<!-- 2. Menu Items -->
<!--
核心修复 3: 菜单容器默认 pointer-events-none
这样在隐藏状态下，它完全不可点击，不会遮挡。
JS 打开时会动态改为 pointer-events-auto
-->
<div id="support-menu" class="flex flex-col gap-3 items-end pointer-events-none">
<!-- Live Chat -->
<!-- <a href="#" class="menu-item-card flex items-center gap-3 bg-white/90 backdrop-blur-xl pl-6 pr-2 py-2 rounded-full shadow-[0_10px_40px_rgba(0,0,0,0.1)] border border-white hover:bg-primary hover:border-primary hover:text-[#0d1b17] group/item transition-all duration-300 origin-bottom-right opacity-0 translate-y-4 translate-x-4 scale-90">
<span class="text-xs font-bold text-[#0d1b17] uppercase tracking-wider group-hover/item:text-[#0d1b17]">Live Chat</span>
<div class="size-10 rounded-full bg-[#13eca4]/20 text-[#00a884] group-hover/item:bg-white group-hover/item:text-[#0d1b17] flex items-center justify-center transition-colors">
<span class="material-symbols-outlined text-xl">&#xe0b7;</span>
</div>
</a> -->
<!-- WhatsApp -->
<a href="javascript:void(0);" class="menu-item-card flex items-center gap-3 bg-white/90 backdrop-blur-xl pl-6 pr-2 py-2 rounded-full shadow-[0_10px_40px_rgba(0,0,0,0.1)] border border-white hover:bg-[#07C160] hover:border-[#07C160] hover:text-white group/item transition-all duration-300 origin-bottom-right opacity-0 translate-y-4 translate-x-4 scale-90">
<div class="flex flex-col items-end leading-tight">
<span class="text-[10px] font-bold text-[#0d1b17]/50 uppercase tracking-widest group-hover/item:text-white/70">WHATSAPP</span>
<span class="text-sm font-bold text-[#0d1b17] group-hover/item:text-white">13718570501</span>
</div>
<div class="size-10 rounded-full bg-[#07C160]/10 text-[#07C160] group-hover/item:bg-white/20 group-hover/item:text-white flex items-center justify-center transition-colors">
<svg viewBox="0 0 24 24" fill="currentColor" class="w-5 h-5">
<path d="M18.8 13.9c-.3-.1-.5-.2-.7-.3.7-1.1 1.2-2.3 1.2-3.6 0-3.6-3.4-6.5-7.6-6.5S4 6.4 4 10c0 2.2 1.3 4.2 3.4 5.4-.1.6-.4 1.4-1 2.2 1.5.1 2.8-.5 3.6-1.1.6.2 1.2.3 1.8.3.1 3.2 3 5.8 6.6 5.8 1.5 0 2.9-.5 4.1-1.3.7.5 1.8 1 3.1.9-.5-.7-.8-1.5-.9-2 .9-1 1.4-2.1 1.4-3.4 0-1.2-.6-2.4-1.9-3.4-.6.3-1.2.5-1.8.5z"></path>
</svg>
</div>
</a>
<!-- Email -->
<a href="mailto:info@nenghui.com" class="menu-item-card flex items-center gap-3 bg-white/90 backdrop-blur-xl pl-6 pr-2 py-2 rounded-full shadow-[0_10px_40px_rgba(0,0,0,0.1)] border border-white hover:bg-blue-500 hover:border-blue-500 hover:text-white group/item transition-all duration-300 origin-bottom-right opacity-0 translate-y-4 translate-x-4 scale-90">
<div class="flex flex-col items-end leading-tight">
<span class="text-[10px] font-bold text-[#0d1b17]/50 uppercase tracking-widest group-hover/item:text-white/70">Email Us</span>
<span class="text-sm font-bold text-[#0d1b17] group-hover/item:text-white">contact@nenghui.com</span>
</div>
<div class="size-10 rounded-full bg-blue-100 text-blue-600 group-hover/item:bg-white/20 group-hover/item:text-white flex items-center justify-center transition-colors">
<span class="material-symbols-outlined text-xl">&#xe158;</span>
</div>
</a>
<!-- Phone -->
<a href="tel:+867561234567" class="menu-item-card flex items-center gap-3 bg-white/90 backdrop-blur-xl pl-6 pr-2 py-2 rounded-full shadow-[0_10px_40px_rgba(0,0,0,0.1)] border border-white hover:bg-[#0d1b17] hover:border-[#0d1b17] hover:text-white group/item transition-all duration-300 origin-bottom-right opacity-0 translate-y-4 translate-x-4 scale-90">
<div class="flex flex-col items-end leading-tight">
<span class="text-[10px] font-bold text-[#0d1b17]/50 uppercase tracking-widest group-hover/item:text-white/70">Call Now</span>
<span class="text-sm font-bold text-[#0d1b17] group-hover/item:text-white">+86 02150896255</span>
</div>
<div class="size-10 rounded-full bg-gray-100 text-gray-600 group-hover/item:bg-white/20 group-hover/item:text-white flex items-center justify-center transition-colors">
<span class="material-symbols-outlined text-xl">&#xe0b0;</span>
</div>
</a>
</div>
</div>
<script>
let isMenuOpen = false;
function toggleSupportMenu() {
isMenuOpen = !isMenuOpen;
const menu = document.getElementById('support-menu');
const items = document.querySelectorAll('.menu-item-card');
const iconChat = document.getElementById('icon-chat');
const iconClose = document.getElementById('icon-close');
const btn = document.getElementById('support-btn');
if (isMenuOpen) {
// 打开时：启用菜单点击
menu.classList.remove('pointer-events-none');
menu.classList.add('pointer-events-auto');
// 按钮动画
iconChat.classList.add('opacity-0', 'rotate-90', 'scale-50');
iconClose.classList.remove('opacity-0', '-rotate-90', 'scale-50');
iconClose.classList.add('rotate-0', 'scale-100');
btn.classList.add('bg-[#0d1b17]', 'rotate-90');
btn.classList.remove('bg-primary');
// 菜单项动画
items.forEach((item, index) => {
setTimeout(() => {
item.classList.remove('opacity-0', 'translate-y-4', 'translate-x-4', 'scale-90');
}, index * 60);
});
} else {
// 关闭时：禁用菜单点击（核心！）
menu.classList.remove('pointer-events-auto');
menu.classList.add('pointer-events-none');
// 按钮动画复原
iconChat.classList.remove('opacity-0', 'rotate-90', 'scale-50');
iconClose.classList.add('opacity-0', '-rotate-90', 'scale-50');
iconClose.classList.remove('rotate-0', 'scale-100');
btn.classList.remove('bg-[#0d1b17]', 'rotate-90');
btn.classList.add('bg-primary');
// 菜单项隐藏
items.forEach((item, index) => {
item.classList.add('opacity-0', 'translate-y-4', 'translate-x-4', 'scale-90');
});
}
}
</script>
<script>
document.addEventListener('DOMContentLoaded', function() {
// 设定目标网址
var targetUrl = "https://cn.nenghui.com";
// 设定中文语言的代码 (通常是 zh_CN 或 zh，请根据你的设置调整)
// 你可以在 TranslatePress 设置 -> Advanced 标签页中查看 Language Code
var langCode = "zh";
// 查找所有 TranslatePress 语言切换器中的中文链接
// 这涵盖了浮动栏、菜单和短代码形式的切换器
var cnLinks = document.querySelectorAll('a[href*="/' + langCode + '/"], a[data-trp-untranslated-slug="' + langCode + '"]');
console.log(cnLinks);
cnLinks.forEach(function(link) {
// // 方法 A: 直接修改 href 属性 (鼠标悬停时左下角会显示新地址)
// link.href = targetUrl;
// // 方法 B (可选): 如果 TranslatePress 强制通过 JS 跳转，可以使用点击事件拦截
link.addEventListener('click', function(e) {
e.preventDefault();
e.stopPropagation();
window.location.href = targetUrl;
});
});
});
</script>
</body>
</html>

7
wp-content/themes/nenghui-energy-theme-4/header.php
Unescape View File

@ -10,7 +10,7 @@
<link href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:wght,FILL@100..700,0..1&amp;display=swap" rel="stylesheet"/>
<link href="https://fonts.googleapis.com" rel="preconnect"/>
<link crossorigin="" href="https://fonts.gstatic.com" rel="preconnect"/>
<link href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@300;400;500;700&amp;display=swap" rel="stylesheet"/>
<link href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@300;400;500;700&family=Inter:wght@400;500;700;800;900&family=JetBrains+Mono:wght@500&&amp;display=swap" rel="stylesheet"/>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/Swiper/11.0.5/swiper-bundle.min.css" />
<!-- AOS Animation Library -->
<link href="https://cdnjs.cloudflare.com/ajax/libs/aos/2.3.4/aos.css" rel="stylesheet">
@ -32,6 +32,8 @@
fontFamily: {
"display": ["Space Grotesk", "sans-serif"],
"sans": ["Space Grotesk", "sans-serif"],
"mono": ["JetBrains Mono", "monospace"],
"inter": ["Inter", "monospace"],
},
borderRadius: {
"DEFAULT": "0.5rem",
@ -86,7 +88,7 @@
<nav class="main-nav">
<div class="nav-container">
<div class="nav-logo">
<a href="<?php echo home_url(); ?>">
<a class="flex flex-col" href="<?php echo home_url(); ?>">
<?php
$logo = get_theme_mod('site_logo');
if ($logo): ?>
@ -94,6 +96,7 @@
<?php else: ?>
<img src="https://nenghui.com/wp-content/uploads/2025/11/logo-2.png" alt="logo">
<?php endif; ?>
<p class="text-[12px] text-[#517bb9] text-justify pl-1">Smart Energy, Digital Future </p>
</a>
</div>

62
wp-content/themes/nenghui-energy-theme-4/style.css
Unescape View File

@ -14,16 +14,59 @@
* {
margin:0;
padding:0;
font-family: "PingFang SC", "Helvetica Neue", Helvetica, Arial, sans-serif;
font-family: "Space Grotesk", "Inter", "JetBrains Mono", "PingFang SC", "Helvetica Neue", Helvetica, Arial, sans-serif;
box-sizing: border-box;
}
::-webkit-scrollbar { width: 6px; height: 6px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: rgba(19, 236, 164, 0.2); border-radius: 10px; }
::-webkit-scrollbar-thumb:hover { background: rgba(19, 236, 164, 0.4); }
.hide-scrollbar { -ms-overflow-style: none; scrollbar-width: none; }
.hide-scrollbar::-webkit-scrollbar { display: none; }
/* 懒加载图 */
/* 1. 图片初始状态：透明 */
.lazy-target {
opacity: 0;
transition: opacity 0.6s cubic-bezier(0.4, 0, 0.2, 1); /* 平滑淡入 */
will-change: opacity;
}
/* 2. 加载完成状态：不透明 (由 JS 添加 .loaded 类) */
.lazy-target.loaded {
opacity: 1;
}
/* 3. 骨架屏容器：灰色背景 */
.skeleton-wrapper {
background-color: #13eca4; /* Tailwind gray-200 */
position: relative;
overflow: hidden;
/* 确保容器有高度，否则图片没加载时高度为0 */
min-height: 100px;
}
.dark .skeleton-wrapper {
background-color: #374151; /* Tailwind gray-700 */
}
/* 4. 骨架屏呼吸动画 */
.skeleton-pulse {
animation: pulse-bg 1.5s cubic-bezier(0.4, 0, 0.6, 1) infinite;
}
@keyframes pulse-bg {
0%, 100% { opacity: 1; }
50% { opacity: 0.5; }
}
table{
width: 100%!important;
max-width: 100%!important;
}
/* 防止横向滚动条 */
html, body {
overflow-x: hidden;
/* overflow-x: hidden; */
overflow: initial;
max-width: 100%;
}
body {
@ -92,7 +135,7 @@
/* 导航菜单样式 */
.main-nav {
position: fixed;
position: sticky;
top: 0;
left: 0;
right: 0;
@ -104,7 +147,7 @@
}
.nav-container {
max-width: 80%;
max-width: 1320px;
margin: 0 auto;
padding: 0 20px;
height: 100%;
@ -117,13 +160,13 @@
display: flex;
align-items: center;
height: 100%;
padding: 10px;
border-radius: 0 0 10px 10px;
/* padding: 10px; */
/* border-radius: 0 0 10px 10px; */
}
.nav-logo a {
display: flex;
align-items: center;
align-items: flex-start;
text-decoration: none;
}
@ -184,6 +227,7 @@
.menu-items li.menu-item-has-children > a .dropdown-arrow {
font-size: 0.7rem;
margin-left: 8px;
padding: 10px 0 10px 20px;
transition: transform 0.3s ease;
display: inline-block;
color: inherit;
@ -306,7 +350,7 @@
display: block;
width: 25px;
height: 2px;
background: #fff;
background: #333;
margin: 5px 0;
transition: all 0.3s ease;
}
@ -430,7 +474,7 @@
}
.menu-items li.menu-item-has-children > a .dropdown-arrow {
transform: rotate(0deg);
/* transform: rotate(0deg); */
}
.menu-items li.menu-item-has-children.mobile-open > a .dropdown-arrow {

2
wp-content/themes/nenghui-energy-theme-4/template-parts/blocks/block-about-company.php
Unescape View File

@ -102,7 +102,7 @@ for ($i = 0; $i < 4; $i++) {
align-items: flex-start;
gap: 60px;
width: 100%;
max-width: 1300px;
max-width: 1320px;
margin: 0 auto;
padding: 0 20px;
justify-content: space-between;

4
wp-content/themes/nenghui-energy-theme-4/template-parts/blocks/block-banner-title.php
Unescape View File

@ -267,7 +267,7 @@ $overlay_opacity = is_numeric($overlay_opacity) ? $overlay_opacity : '0.4';
position: relative;
z-index: 3;
width: 100%;
max-width: 1300px;
max-width: 1320px;
padding: 0 20px;
}
@ -293,7 +293,7 @@ $overlay_opacity = is_numeric($overlay_opacity) ? $overlay_opacity : '0.4';
color: #ffffff;
text-shadow: 1px 1px 4px rgba(0, 0, 0, 0.5);
font-weight: 300;
max-width: 1300px;
max-width: 1320px;
}
/* 动画效果 */
.nenghui-banner-title.has-animation {

Write Preview
Loading…
Cancel
Save