File: /www/wwwroot/www.byte123.top/wp-content/themes/sUx/front-page.php
<?php
/**
* 首页模板 (front-page.php)
*
* 这是WordPress网站的专用首页模板
* 包含：
* - 英雄横幅区域 (Hero Section)
* - 特色服务展示区域
* - 商品展示区域
* - 最新文章/新闻区域
* - 客户评价/推荐区域
*
* @package sUx
*/
get_header(); // 加载网站头部
?>
<div class="site-container">
<!-- 英雄横幅区域 -->
<section class="hero-section">
<div class="hero-content">
<h1 class="hero-title">
<?php
// 检查是否有自定义的首页标题
$hero_title = get_theme_mod('sux_hero_title', get_bloginfo('name'));
echo esc_html($hero_title);
?>
</h1>
<p class="hero-subtitle">
<?php
// 检查是否有自定义的首页副标题
$hero_subtitle = get_theme_mod('sux_hero_subtitle', get_bloginfo('description'));
echo esc_html($hero_subtitle);
?>
</p>
<div class="hero-buttons">
<?php if (get_theme_mod('sux_hero_button1_text')) : ?>
<a href="<?php echo esc_url(get_theme_mod('sux_hero_button1_url', '#products')); ?>"
class="btn-hero btn-primary">
<?php echo esc_html(get_theme_mod('sux_hero_button1_text')); ?>
</a>
<?php endif; ?>
<?php if (get_theme_mod('sux_hero_button2_text')) : ?>
<a href="<?php echo esc_url(get_theme_mod('sux_hero_button2_url', '#contact')); ?>"
class="btn-hero btn-secondary">
<?php echo esc_html(get_theme_mod('sux_hero_button2_text')); ?>
</a>
<?php endif; ?>
<!-- 如果没有设置自定义按钮，显示默认按钮 -->
<?php if (!get_theme_mod('sux_hero_button1_text') && !get_theme_mod('sux_hero_button2_text')) : ?>
<a href="#products" class="btn-hero btn-primary">
<?php _e('查看产品', 'sux'); ?>
</a>
<a href="#contact" class="btn-hero btn-secondary">
<?php _e('联系我们', 'sux'); ?>
</a>
<?php endif; ?>
</div>
</div>
<!-- 背景装饰元素（可选） -->
<div class="hero-decorations">
<div class="decoration decoration-1"></div>
<div class="decoration decoration-2"></div>
<div class="decoration decoration-3"></div>
</div>
</section>
<!-- 特色服务展示区域 -->
<section id="features" class="features-section">
<div class="site-container">
<div class="section-header text-center">
<h2 class="section-title sux-primary-color">
<?php
// 特色服务标题
$features_title = get_theme_mod('sux_features_title', __('我们的优势', 'sux'));
echo esc_html($features_title);
?>
</h2>
<p class="section-subtitle">
<?php
// 特色服务副标题
$features_subtitle = get_theme_mod('sux_features_subtitle', __('我们为您提供专业的服务，帮助您实现商业目标', 'sux'));
echo esc_html($features_subtitle);
?>
</p>
</div>
<div class="features-grid">
<?php
/**
* 获取特色服务项目
* 可以通过主题自定义器或后台选项设置
*/
$features = get_theme_mod('sux_features', array());
// 如果没有设置特色服务，显示默认内容
if (empty($features)) :
// 默认特色服务
$default_features = array(
array(
'icon' => 'fa-truck',
'title' => __('全球配送', 'sux'),
'description' => __('覆盖全球的物流网络，确保您的货物安全快速送达', 'sux')
),
array(
'icon' => 'fa-shield-alt',
'title' => __('品质保证', 'sux'),
'description' => __('严格的质量控制体系，提供高品质的产品', 'sux')
),
array(
'icon' => 'fa-headset',
'title' => __('专业客服', 'sux'),
'description' => __('24小时在线客服，随时为您解答疑问', 'sux')
),
array(
'icon' => 'fa-chart-line',
'title' => __('市场分析', 'sux'),
'description' => __('深入的市场分析，为您制定最优策略', 'sux')
),
array(
'icon' => 'fa-handshake',
'title' => __('可靠合作', 'sux'),
'description' => __('诚信经营，建立长期稳定的合作关系', 'sux')
),
array(
'icon' => 'fa-lightbulb',
'title' => __('创新解决方案', 'sux'),
'description' => __('根据客户需求提供个性化的解决方案', 'sux')
)
);
foreach ($default_features as $feature) :
?>
<div class="feature-item">
<div class="feature-icon">
<i class="fas <?php echo esc_attr($feature['icon']); ?>"></i>
</div>
<h3 class="feature-title"><?php echo esc_html($feature['title']); ?></h3>
<p class="feature-description"><?php echo esc_html($feature['description']); ?></p>
</div>
<?php
endforeach;
else :
// 显示自定义特色服务
foreach ($features as $feature) :
?>
<div class="feature-item">
<div class="feature-icon">
<?php if (!empty($feature['icon'])) : ?>
<i class="<?php echo esc_attr($feature['icon']); ?>"></i>
<?php elseif (!empty($feature['icon_image'])) : ?>
<img src="<?php echo esc_url($feature['icon_image']); ?>" alt="<?php echo esc_attr($feature['title']); ?>">
<?php endif; ?>
</div>
<h3 class="feature-title"><?php echo esc_html($feature['title']); ?></h3>
<p class="feature-description"><?php echo esc_html($feature['description']); ?></p>
</div>
<?php
endforeach;
endif;
?>
</div>
</div>
</section>
<!-- 商品展示区域 -->
<section id="products" class="products-section">
<div class="site-container">
<div class="section-header text-center">
<h2 class="section-title sux-primary-color">
<?php
// 商品展示标题
$products_title = get_theme_mod('sux_products_title', __('热门产品', 'sux'));
echo esc_html($products_title);
?>
</h2>
<p class="section-subtitle">
<?php
// 商品展示副标题
$products_subtitle = get_theme_mod('sux_products_subtitle', __('展示我们最受欢迎的产品系列', 'sux'));
echo esc_html($products_subtitle);
?>
</p>
</div>
<div class="products-grid">
<?php
/**
* 获取要展示的商品
* 这里可以从自定义文章类型获取，或者从特定分类获取
*/
$products_query = new WP_Query(array(
'post_type' => 'product', // 假设有自定义的product文章类型
'posts_per_page' => 6,
'post_status' => 'publish',
'orderby' => 'date',
'order' => 'DESC',
'meta_key' => '_sux_featured_product',
'meta_value' => '1'
));
// 如果没有自定义商品类型，则从文章获取
if ($products_query->found_posts === 0) :
$products_query = new WP_Query(array(
'post_type' => 'post',
'posts_per_page' => 6,
'post_status' => 'publish',
'orderby' => 'date',
'order' => 'DESC',
'category_name' => 'products' // 从名为"products"的分类获取
));
endif;
if ($products_query->have_posts()) :
while ($products_query->have_posts()) :
$products_query->the_post();
// 获取商品相关信息
$product_price = get_post_meta(get_the_ID(), '_sux_product_price', true);
$product_badge = get_post_meta(get_the_ID(), '_sux_product_badge', true);
$product_link = get_post_meta(get_the_ID(), '_sux_product_link', true);
?>
<article class="product-item">
<div class="product-image">
<?php if (has_post_thumbnail()) : ?>
<a href="<?php echo esc_url($product_link ?: get_permalink()); ?>">
<?php the_post_thumbnail('medium', array('alt' => get_the_title())); ?>
</a>
<?php else : ?>
<a href="<?php echo esc_url($product_link ?: get_permalink()); ?>">
<img src="<?php echo esc_url(get_theme_file_uri('/assets/images/product-placeholder.jpg')); ?>"
alt="<?php echo esc_attr(get_the_title()); ?>">
</a>
<?php endif; ?>
<?php if ($product_badge) : ?>
<span class="product-badge"><?php echo esc_html($product_badge); ?></span>
<?php endif; ?>
</div>
<div class="product-content">
<h3 class="product-title">
<a href="<?php echo esc_url($product_link ?: get_permalink()); ?>">
<?php the_title(); ?>
</a>
</h3>
<div class="product-description">
<?php the_excerpt(); ?>
</div>
<?php if ($product_price) : ?>
<div class="product-price sux-primary-color">
<span class="price-label"><?php _e('价格：', 'sux'); ?></span>
<span class="price-value"><?php echo esc_html($product_price); ?></span>
</div>
<?php endif; ?>
<div class="product-actions">
<a href="<?php echo esc_url($product_link ?: get_permalink()); ?>"
class="product-link">
<?php _e('了解详情', 'sux'); ?>
</a>
<?php if (get_theme_mod('sux_show_inquiry_button', true)) : ?>
<a href="#contact" class="inquiry-btn sux-secondary-bg">
<?php _e('询价', 'sux'); ?>
</a>
<?php endif; ?>
</div>
</div>
</article>
<?php
endwhile;
wp_reset_postdata();
else :
// 如果没有找到商品，显示提示信息
?>
<div class="no-products-found">
<h3><?php _e('暂无展示产品', 'sux'); ?></h3>
<p><?php _e('请联系我们了解更多产品信息', 'sux'); ?></p>
<a href="#contact" class="btn-hero btn-primary">
<?php _e('立即联系', 'sux'); ?>
</a>
</div>
<?php endif; ?>
</div>
<?php if ($products_query->found_posts > 6) : ?>
<div class="products-more text-center">
<a href="<?php echo esc_url(get_theme_mod('sux_products_page_url', get_home_url() . '/products')); ?>"
class="btn-hero btn-primary">
<?php _e('查看更多产品', 'sux'); ?>
</a>
</div>
<?php endif; ?>
</div>
</section>
<!-- 最新文章/新闻区域 -->
<?php if (get_theme_mod('sux_show_home_blog', true)) : ?>
<section id="news" class="news-section">
<div class="site-container">
<div class="section-header text-center">
<h2 class="section-title sux-primary-color">
<?php
// 新闻区域标题
$news_title = get_theme_mod('sux_news_title', __('最新资讯', 'sux'));
echo esc_html($news_title);
?>
</h2>
<p class="section-subtitle">
<?php
// 新闻区域副标题
$news_subtitle = get_theme_mod('sux_news_subtitle', __('了解行业动态和公司新闻', 'sux'));
echo esc_html($news_subtitle);
?>
</p>
</div>
<div class="news-grid">
<?php
// 获取最新文章
$news_query = new WP_Query(array(
'post_type' => 'post',
'posts_per_page' => 3,
'post_status' => 'publish',
'orderby' => 'date',
'order' => 'DESC',
'category__not_in' => array(get_category_by_slug('products')->term_id) // 排除产品分类
));
if ($news_query->have_posts()) :
while ($news_query->have_posts()) :
$news_query->the_post();
?>
<article class="news-item">
<?php if (has_post_thumbnail()) : ?>
<div class="news-thumbnail">
<a href="<?php the_permalink(); ?>">
<?php the_post_thumbnail('thumbnail'); ?>
</a>
</div>
<?php endif; ?>
<div class="news-content">
<h3 class="news-title">
<a href="<?php the_permalink(); ?>">
<?php the_title(); ?>
</a>
</h3>
<div class="news-meta">
<time datetime="<?php echo get_the_date('c'); ?>">
<?php echo get_the_date('Y-m-d'); ?>
</time>
</div>
<div class="news-excerpt">
<?php the_excerpt(); ?>
</div>
</div>
</article>
<?php
endwhile;
wp_reset_postdata();
endif;
?>
</div>
<?php if (get_theme_mod('sux_news_page_url')) : ?>
<div class="news-more text-center">
<a href="<?php echo esc_url(get_theme_mod('sux_news_page_url', get_home_url() . '/news')); ?>"
class="btn-hero btn-primary">
<?php _e('查看更多资讯', 'sux'); ?>
</a>
</div>
<?php endif; ?>
</div>
</section>
<?php endif; ?>
<!-- 客户评价/推荐区域 -->
<?php if (get_theme_mod('sux_show_testimonials', true)) : ?>
<section id="testimonials" class="testimonials-section">
<div class="site-container">
<div class="section-header text-center">
<h2 class="section-title sux-primary-color">
<?php
// 客户评价标题
$testimonials_title = get_theme_mod('sux_testimonials_title', __('客户评价', 'sux'));
echo esc_html($testimonials_title);
?>
</h2>
<p class="section-subtitle">
<?php
// 客户评价副标题
$testimonials_subtitle = get_theme_mod('sux_testimonials_subtitle', __('听听客户对我们的评价', 'sux'));
echo esc_html($testimonials_subtitle);
?>
</p>
</div>
<div class="testimonials-grid">
<?php
// 获取客户评价
$testimonials_query = new WP_Query(array(
'post_type' => 'testimonial', // 假设有自定义的testimonial文章类型
'posts_per_page' => 3,
'post_status' => 'publish',
'orderby' => 'date',
'order' => 'DESC'
));
if ($testimonials_query->have_posts()) :
while ($testimonials_query->have_posts()) :
$testimonials_query->the_post();
// 获取评价者信息
$testimonial_client = get_post_meta(get_the_ID(), '_sux_testimonial_client', true);
$testimonial_company = get_post_meta(get_the_ID(), '_sux_testimonial_company', true);
$testimonial_rating = get_post_meta(get_the_ID(), '_sux_testimonial_rating', true);
?>
<div class="testimonial-item">
<div class="testimonial-content">
<blockquote>
<?php the_content(); ?>
</blockquote>
<?php if ($testimonial_rating) : ?>
<div class="testimonial-rating">
<?php
// 显示星级评分
for ($i = 1; $i <= 5; $i++) :
if ($i <= $testimonial_rating) :
echo '<i class="fas fa-star sux-secondary-color"></i>';
else :
echo '<i class="far fa-star sux-secondary-color"></i>';
endif;
endfor;
?>
</div>
<?php endif; ?>
</div>
<div class="testimonial-author">
<div class="author-info">
<strong class="author-name"><?php echo esc_html($testimonial_client ?: get_the_title()); ?></strong>
<?php if ($testimonial_company) : ?>
<span class="author-company"><?php echo esc_html($testimonial_company); ?></span>
<?php endif; ?>
</div>
</div>
</div>
<?php
endwhile;
wp_reset_postdata();
else :
// 显示默认客户评价
$default_testimonials = array(
array(
'content' => __('优质的产品和服务，非常专业的团队！', 'sux'),
'client' => __('张总', 'sux'),
'company' => __('ABC贸易公司', 'sux'),
'rating' => 5
),
array(
'content' => __('与sUx合作多年，一直很满意他们的产品质量和服务态度。', 'sux'),
'client' => __('李经理', 'sux'),
'company' => __('XYZ进出口公司', 'sux'),
'rating' => 5
),
array(
'content' => __('物流速度快，产品质量好，值得信赖的合作伙伴。', 'sux'),
'client' => __('王总监', 'sux'),
'company' => __('DEF国际贸易公司', 'sux'),
'rating' => 4
)
);
foreach ($default_testimonials as $testimonial) :
?>
<div class="testimonial-item">
<div class="testimonial-content">
<blockquote>
<?php echo esc_html($testimonial['content']); ?>
</blockquote>
<div class="testimonial-rating">
<?php
for ($i = 1; $i <= 5; $i++) :
if ($i <= $testimonial['rating']) :
echo '<i class="fas fa-star sux-secondary-color"></i>';
else :
echo '<i class="far fa-star sux-secondary-color"></i>';
endif;
endfor;
?>
</div>
</div>
<div class="testimonial-author">
<div class="author-info">
<strong class="author-name"><?php echo esc_html($testimonial['client']); ?></strong>
<span class="author-company"><?php echo esc_html($testimonial['company']); ?></span>
</div>
</div>
</div>
<?php
endforeach;
endif;
?>
</div>
</div>
</section>
<?php endif; ?>
<!-- 行动召唤区域 -->
<?php if (get_theme_mod('sux_show_home_cta', true)) : ?>
<section id="cta" class="cta-section sux-primary-bg">
<div class="site-container">
<div class="cta-content text-center">
<h2 class="cta-title">
<?php
// CTA标题
$cta_title = get_theme_mod('sux_cta_title', __('准备开始合作了吗？', 'sux'));
echo esc_html($cta_title);
?>
</h2>
<p class="cta-subtitle">
<?php
// CTA副标题
$cta_subtitle = get_theme_mod('sux_cta_subtitle', __('立即联系我们，了解更多关于我们产品和服务的详细信息', 'sux'));
echo esc_html($cta_subtitle);
?>
</p>
<div class="cta-buttons">
<a href="#contact" class="btn-hero btn-secondary">
<?php _e('立即联系', 'sux'); ?>
</a>
<?php if (get_theme_mod('sux_cta_button_text')) : ?>
<a href="<?php echo esc_url(get_theme_mod('sux_cta_button_url')); ?>"
class="btn-hero" style="background-color: #ffffff; color: var(--sux-primary-color);">
<?php echo esc_html(get_theme_mod('sux_cta_button_text')); ?>
</a>
<?php endif; ?>
</div>
</div>
</div>
</section>
<?php endif; ?>
</div>
<?php get_footer(); // 加载网站页脚 ?>