子主题之域名销售模板

域名展示列表

<?php
/*
Template Name: 域名出售列表（带右侧边栏版）
*/
get_header(); ?>
<style>
/* 全局重置 */
* {
box-sizing: border-box;
margin: 0;
padding: 0;
}
body {
background-color: #f5f7fa;
font-family: "Microsoft Yahei", Arial, sans-serif;
}
/* 页面总容器：1200px（主内容+侧边栏） */
.domain-page-container {
max-width: 1200px;
margin: 0 auto;
padding: 0 20px;
display: flex;
flex-wrap: wrap;
gap: 25px; /* 主内容与侧边栏间距 */
}
/* 主内容区域：850px（核心内容） */
.domain-main-wrap {
flex: 1;
min-width: 700px;
width: 850px;
}
/* 右侧边栏：300px（辅助信息） */
.domain-sidebar {
width: 300px;
flex-shrink: 0;
margin-top: 30px;
}
/* 精品域名Banner */
.domain-banner {
width: 100%;
height: 180px;
background: linear-gradient(135deg, #2d5afe 0%, #1a46e0 100%);
border-radius: 12px;
margin: 25px 0;
display: flex;
align-items: center;
justify-content: center;
position: relative;
overflow: hidden;
}
.domain-banner::before {
content: "";
position: absolute;
width: 350px;
height: 350px;
background: rgba(255,255,255,0.1);
border-radius: 50%;
top: -90px;
right: -90px;
}
.domain-banner::after {
content: "";
position: absolute;
width: 250px;
height: 250px;
background: rgba(255,255,255,0.08);
border-radius: 50%;
bottom: -90px;
left: -90px;
}
.banner-content {
text-align: center;
color: #fff;
z-index: 1;
}
.banner-title {
font-size: 32px;
font-weight: 700;
margin-bottom: 12px;
letter-spacing: 1px;
}
.banner-subtitle {
font-size: 16px;
opacity: 0.9;
}
/* 搜索筛选区域（适配主内容宽度） */
.domain-search-wrap {
background: #fff;
padding: 20px 25px;
border-radius: 12px;
box-shadow: 0 2px 8px rgba(0,0,0,0.06);
margin-bottom: 25px;
}
.search-form {
display: flex;
flex-wrap: wrap;
gap: 15px;
align-items: center;
}
.search-input-group {
flex: 1;
min-width: 280px;
}
.search-input {
width: 100%;
padding: 12px 18px;
border: 1px solid #e0e6ed;
border-radius: 8px;
font-size: 15px;
outline: none;
transition: all 0.2s ease;
}
.search-input:focus {
border-color: #2d5afe;
box-shadow: 0 0 0 3px rgba(45,90,254,0.1);
}
.search-select-group {
display: flex;
gap: 12px;
flex-wrap: wrap;
}
.search-select {
padding: 12px 15px;
border: 1px solid #e0e6ed;
border-radius: 8px;
font-size: 15px;
outline: none;
background: #fff;
min-width: 120px;
}
.search-btn {
padding: 12px 25px;
background: #2d5afe;
color: #fff;
border: none;
border-radius: 8px;
font-size: 15px;
font-weight: 600;
cursor: pointer;
transition: all 0.2s ease;
white-space: nowrap;
}
.search-btn:hover {
background: #1a46e0;
transform: translateY(-2px);
box-shadow: 0 4px 8px rgba(45,90,254,0.2);
}
/* 域名列表样式 */
.domain-list-header {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 18px;
}
.domain-list-count {
font-size: 16px;
color: #333;
font-weight: 600;
}
.domain-sort {
display: flex;
align-items: center;
gap: 12px;
color: #666;
}
.domain-sort select {
padding: 6px 12px;
border: 1px solid #eee;
border-radius: 6px;
font-size: 15px;
}
.domain-card {
display: flex;
align-items: center;
padding: 22px 20px;
margin-bottom: 18px;
background: #fff;
border: 1px solid #f0f2f5;
border-radius: 12px;
box-shadow: 0 2px 4px rgba(0,0,0,0.03);
transition: all 0.3s ease;
flex-wrap: nowrap;
width: 100%;
}
.domain-card:hover {
box-shadow: 0 8px 16px rgba(0,0,0,0.08);
transform: translateY(-2px);
border-color: #e8f0fe;
}
.domain-name {
font-size: 20px;
font-weight: 600;
color: #2d5afe;
letter-spacing: 0.5px;
width: 180px;
flex-shrink: 0;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
/* 元信息（紧凑版） */
.domain-meta {
display: flex;
gap: 15px;
color: #666;
flex: 1;
padding: 0 10px;
}
.domain-meta span {
display: flex;
align-items: center;
gap: 6px;
font-size: 14px;
white-space: nowrap;
}
.domain-meta span i {
color: #2d5afe;
font-size: 14px;
}
/* 价格（紧凑版） */
.domain-price {
font-size: 22px;
font-weight: 700;
color: #e63946;
width: 110px;
flex-shrink: 0;
text-align: right;
white-space: nowrap;
padding-right: 8px;
}
/* 按钮（紧凑版） */
.domain-btn {
padding: 10px 20px;
background: #2d5afe;
color: #fff;
border: none;
border-radius: 8px;
cursor: pointer;
text-decoration: none;
font-size: 14px;
font-weight: 600;
width: 100px;
flex-shrink: 0;
text-align: center;
white-space: nowrap;
transition: all 0.2s ease;
}
.domain-btn:hover {
background: #1a46e0;
color: #fff;
}
/* 分页样式（紧凑版） */
.domain-pagination {
margin-top: 30px;
text-align: center;
padding: 15px 0;
}
.domain-pagination a, .domain-pagination span {
display: inline-block;
padding: 10px 16px;
margin: 0 5px;
border: 1px solid #e0e6ed;
border-radius: 8px;
color: #666;
text-decoration: none;
font-size: 15px;
transition: all 0.2s ease;
}
.domain-pagination a:hover, .domain-pagination .current {
background: #2d5afe;
color: #fff;
border-color: #2d5afe;
}
/* 空数据样式（紧凑版） */
.no-domain {
text-align: center;
padding: 60px 20px;
background: #fff;
border-radius: 12px;
color: #999;
font-size: 16px;
margin-top: 18px;
}
.no-domain i {
font-size: 48px;
margin-bottom: 20px;
color: #e0e6ed;
}
/* 右侧边栏样式 */
.sidebar-widget {
background: #fff;
border-radius: 12px;
box-shadow: 0 2px 8px rgba(0,0,0,0.06);
margin-bottom: 20px;
overflow: hidden;
}
.sidebar-widget-header {
padding: 15px 20px;
background: #2d5afe;
color: #fff;
font-size: 18px;
font-weight: 600;
}
.sidebar-widget-content {
padding: 20px;
}
/* 侧边栏-热门域名推荐 */
.hot-domain-list {
list-style: none;
}
.hot-domain-item {
padding: 12px 0;
border-bottom: 1px solid #f0f2f5;
display: flex;
justify-content: space-between;
align-items: center;
}
.hot-domain-item:last-child {
border-bottom: none;
}
.hot-domain-name {
color: #2d5afe;
font-size: 16px;
font-weight: 600;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
max-width: 180px;
}
.hot-domain-price {
color: #e63946;
font-size: 16px;
font-weight: 700;
}
/* 侧边栏-域名购买须知 */
.buy-tips-list {
list-style: none;
}
.buy-tips-item {
padding: 8px 0;
display: flex;
gap: 8px;
color: #666;
font-size: 14px;
}
.buy-tips-item i {
color: #2d5afe;
font-size: 14px;
margin-top: 2px;
}
/* 侧边栏-联系方式 */
.contact-info {
text-align: center;
}
.contact-info p {
color: #666;
font-size: 14px;
margin: 10px 0;
}
.contact-phone {
font-size: 20px;
color: #2d5afe;
font-weight: 700;
margin: 15px 0;
}
.contact-btn {
display: block;
width: 100%;
padding: 12px 0;
background: #2d5afe;
color: #fff;
border-radius: 8px;
text-decoration: none;
font-size: 16px;
font-weight: 600;
margin-top: 10px;
}
.contact-btn:hover {
background: #1a46e0;
color: #fff;
}
/* 适配移动端（侧边栏自动下移） */
@media (max-width: 992px) {
.domain-page-container {
flex-direction: column;
gap: 15px;
}
.domain-main-wrap, .domain-sidebar {
width: 100%;
min-width: auto;
}
.domain-banner {
height: 140px;
}
.banner-title {
font-size: 24px;
}
.banner-subtitle {
font-size: 15px;
}
.search-form {
flex-direction: column;
align-items: stretch;
gap: 12px;
}
.search-input-group, .search-select {
min-width: 100%;
}
/* 移动端卡片换行 */
.domain-card {
flex-wrap: wrap;
gap: 15px;
padding: 18px 15px;
}
.domain-name, .domain-meta, .domain-price, .domain-btn {
width: 100%;
flex-shrink: 1;
padding: 0;
text-align: left;
}
.domain-meta {
gap: 10px;
flex-wrap: wrap;
}
.domain-price {
font-size: 20px;
margin-top: 8px;
}
.domain-btn {
width: 100%;
margin-top: 8px;
padding: 10px 0;
}
.domain-list-header {
flex-wrap: wrap;
gap: 12px;
}
}
</style>

<div class="domain-page-container">
<!-- 主内容区域 -->
<div class="domain-main-wrap">
<!-- 精品域名Banner -->
<div class="domain-banner">
<div class="banner-content">
<h2 class="banner-title">优质域名 · 助力品牌成长</h2>
<p class="banner-subtitle">精选稀缺域名，打造专属品牌标识</p>
</div>
</div>

<!-- 搜索筛选区域 -->
<div class="domain-search-wrap">
<form class="search-form" method="get" action="<?php echo esc_url(home_url('/')); ?>">
<div class="search-input-group">
<input type="text" class="search-input" name="s" placeholder="搜索域名关键词、接入商..." value="<?php echo get_search_query(); ?>">
<input type="hidden" name="post_type" value="domain">
</div>
<div class="search-select-group">
<select class="search-select" name="record_status">
<option value="">所有备案状态</option>
<option value="已备案">已备案</option>
<option value="未备案">未备案</option>
<option value="备案中">备案中</option>
</select>
<select class="search-select" name="transfer_status">
<option value="">所有转移权限</option>
<option value="可转移">可转移</option>
<option value="不可转移">不可转移</option>
</select>
<select class="search-select" name="price_range">
<option value="">所有价格区间</option>
<option value="0-1000">1000元以下</option>
<option value="1000-5000">1000-5000元</option>
<option value="5000-10000">5000-10000元</option>
<option value="10000+">10000元以上</option>
</select>
</div>
<button type="submit" class="search-btn">
<i class="fa fa-search"></i> 搜索域名
</button>
</form>
</div>

<!-- 域名列表区域 -->
<div class="domain-main-content">
<?php
// 构建查询参数
$paged = (get_query_var('paged')) ? get_query_var('paged') : 1;
$meta_query = array('relation' => 'AND');

// 备案状态筛选
if (!empty($_GET['record_status'])) {
$meta_query[] = array(
'key' => '_domain_record',
'value' => sanitize_text_field($_GET['record_status']),
'compare' => '='
);
}

// 转移权限筛选
if (!empty($_GET['transfer_status'])) {
$meta_query[] = array(
'key' => '_domain_transfer',
'value' => sanitize_text_field($_GET['transfer_status']),
'compare' => '='
);
}

// 价格区间筛选
if (!empty($_GET['price_range'])) {
$price_range = sanitize_text_field($_GET['price_range']);
list($min, $max) = explode('-', $price_range);
if ($max == '+') {
$meta_query[] = array(
'key' => '_domain_price',
'value' => $min,
'type' => 'NUMERIC',
'compare' => '>='
);
} else {
$meta_query[] = array(
'key' => '_domain_price',
'value' => array($min, $max),
'type' => 'NUMERIC',
'compare' => 'BETWEEN'
);
}
}

// 查询域名自定义文章类型
$domain_args = array(
'post_type' => 'domain',
'posts_per_page' => 10, // 带侧边栏显示10个，布局更紧凑
'post_status' => 'publish',
'paged' => $paged,
's' => get_search_query(),
'meta_query' => $meta_query
);
$domain_query = new WP_Query($domain_args);
$total_domains = $domain_query->found_posts;
$hot_domain_args = array(
'post_type' => 'domain',
'posts_per_page' => 8,
'post_status' => 'publish',
'meta_query' => array(
array(
'key' => '_is_hot_domain',
'value' => 'yes',
'compare' => '='
)
),
'orderby' => 'meta_value_num', // 可添加排序字段 "_hot_domain_sort" 控制展示顺序
'meta_key' => '_hot_domain_sort',
'order' => 'ASC'
);
$hot_domain_query = new WP_Query($hot_domain_args);
$contact_link = get_option('domain_contact_link', 'tel:4001234567');
$contact_link = get_post_meta(get_the_ID(), '_domain_contact_link', true) ?: 'tel:4001234567';
?>

<!-- 列表头部：数量+排序 -->
<div class="domain-list-header">
<div class="domain-list-count">共找到 <?php echo $total_domains; ?> 个优质域名</div>
<div class="domain-sort">
排序：
<select onchange="window.location.href=this.value">
<option value="<?php echo add_query_arg('sort', 'price_asc', get_permalink()); ?>" <?php echo (isset($_GET['sort']) && $_GET['sort'] == 'price_asc') ? 'selected' : ''; ?>>价格从低到高</option>
<option value="<?php echo add_query_arg('sort', 'price_desc', get_permalink()); ?>" <?php echo (isset($_GET['sort']) && $_GET['sort'] == 'price_desc') ? 'selected' : ''; ?>>价格从高到低</option>
<option value="<?php echo add_query_arg('sort', 'date', get_permalink()); ?>" <?php echo (isset($_GET['sort']) && $_GET['sort'] == 'date') ? 'selected' : ''; ?>>最新发布</option>
</select>
</div>
</div>

<?php if ($domain_query->have_posts()) : ?>
<?php while ($domain_query->have_posts()) : $domain_query->the_post(); ?>
<?php
// 获取自定义字段值
$domain_name = get_post_meta(get_the_ID(), '_domain_name', true);
$domain_price = get_post_meta(get_the_ID(), '_domain_price', true);
$domain_record = get_post_meta(get_the_ID(), '_domain_record', true);
$domain_transfer = get_post_meta(get_the_ID(), '_domain_transfer', true);
$domain_provider = get_post_meta(get_the_ID(), '_domain_provider', true);
?>

<div class="domain-card">
<div class="domain-name"><?php echo esc_html($domain_name ?: get_the_title()); ?></div>
<div class="domain-meta">
<span><i class="fa fa-check-circle"></i> 备案：<?php echo esc_html($domain_record); ?></span>
<span><i class="fa fa-server"></i> 接入商：<?php echo esc_html($domain_provider ?: '未填写'); ?></span>
<span><i class="fa fa-exchange"></i> 转移：<?php echo esc_html($domain_transfer); ?></span>
</div>
<div class="domain-price">¥<?php echo number_format(esc_html($domain_price ?: 0)); ?></div>
<a href="<?php the_permalink(); ?>" class="domain-btn">查看详情</a>
</div>

<?php endwhile; ?>

<!-- 分页导航 -->
<div class="domain-pagination">
<?php echo paginate_links(array(
'total' => $domain_query->max_num_pages,
'current' => $paged,
'prev_text' => '<i class="fa fa-angle-left"></i> 上一页',
'next_text' => '下一页 <i class="fa fa-angle-right"></i>',
'type' => 'list',
'show_all' => false,
'end_size' => 1,
'mid_size' => 2,
'format' => '?paged=%#%',
'add_args' => array(
's' => get_search_query(),
'record_status' => isset($_GET['record_status']) ? $_GET['record_status'] : '',
'transfer_status' => isset($_GET['transfer_status']) ? $_GET['transfer_status'] : '',
'price_range' => isset($_GET['price_range']) ? $_GET['price_range'] : '',
'sort' => isset($_GET['sort']) ? $_GET['sort'] : ''
)
)); ?>
</div>

<?php wp_reset_postdata(); ?>
<?php else : ?>
<div class="no-domain">
<i class="fa fa-folder-open-o"></i>
<p>暂无符合条件的域名</p>
<p style="margin-top:12px; font-size:14px;">试试更换搜索条件或价格区间</p>
</div>
<?php endif; ?>
</div>
</div>

<!-- 右侧边栏区域 -->
<div class="domain-sidebar">
<div class="sidebar-widget">
<div class="sidebar-widget-header">
<i class="fa fa-fire"></i> 热门域名推荐
</div>
<div class="sidebar-widget-content">
<?php if ($hot_domain_query->have_posts()) : ?>
<ul class="hot-domain-list">
<?php while ($hot_domain_query->have_posts()) : $hot_domain_query->the_post(); ?>
<?php
$hot_domain_name = get_post_meta(get_the_ID(), '_domain_name', true);
$hot_domain_price = get_post_meta(get_the_ID(), '_domain_price', true);
?>
<li class="hot-domain-item">
<a href="<?php the_permalink(); ?>" class="hot-domain-name" title="<?php echo esc_html($hot_domain_name); ?>">
<?php echo esc_html($hot_domain_name ?: get_the_title()); ?>
</a>
<span class="hot-domain-price">¥<?php echo number_format(esc_html($hot_domain_price ?: 0)); ?></span>
</li>
<?php endwhile; ?>
</ul>
<?php wp_reset_postdata(); ?>
<?php else : ?>
<p style="color:#999; text-align:center; padding:10px 0;">暂无推荐域名</p>
<?php endif; ?>
</div>
</div>

<!-- 域名购买须知 -->
<div class="sidebar-widget">
<div class="sidebar-widget-header">
<i class="fa fa-info-circle"></i> 购买须知
</div>
<div class="sidebar-widget-content">
<ul class="buy-tips-list">
<li class="buy-tips-item">
<i class="fa fa-check"></i>
<span>所有域名均为一手资源，无纠纷</span>
</li>
<li class="buy-tips-item">
<i class="fa fa-check"></i>
<span>已备案域名支持快速过户</span>
</li>
<li class="buy-tips-item">
<i class="fa fa-check"></i>
<span>交易全程担保，安全有保障</span>
</li>
<li class="buy-tips-item">
<i class="fa fa-check"></i>
<span>支持对公转账，可开具发票</span>
</li>
<li class="buy-tips-item">
<i class="fa fa-check"></i>
<span>7×24小时在线客服解答疑问</span>
</li>
</ul>
</div>
</div>
<?php get_footer(); ?>

域名详情页代码

<?php get_header(); ?>

<?php
function modown_domain_custom_fields() {
$args = array(
'label' => '域名出售',
'description' => '域名出售列表',
'public' => true,
'publicly_queryable' => true,
'exclude_from_search' => false,
'show_ui' => true,
'show_in_menu' => true,
'show_in_nav_menus' => true,
'show_in_admin_bar' => true,
'menu_icon' => 'dashicons-admin-site',
'capability_type' => 'post',
'hierarchical' => false,
'supports' => array('title', 'editor', 'thumbnail'),
'rewrite' => array(
'slug' => 'domain',
'with_front' => false,
'feeds' => false,
'pages' => true
),
'has_archive' => true,
'show_in_rest' => true,
'query_var' => 'domain',
);
register_post_type('domain', $args);
add_action('add_meta_boxes', 'modown_add_domain_meta_boxes');
add_action('save_post', 'modown_save_domain_meta_data');
flush_rewrite_rules(false);
}
add_action('init', 'modown_domain_custom_fields', 0);
// 添加自定义字段面板
function modown_add_domain_meta_boxes() {
add_meta_box(
'domain_info_box',
'域名信息',
'modown_domain_meta_box_callback',
'domain',
'normal',
'high'
);
}
function modown_domain_meta_box_callback($post) {
// 安全验证
wp_nonce_field('modown_domain_meta_nonce', 'domain_meta_nonce');
$domain_name = get_post_meta($post->ID, '_domain_name', true);
$domain_price = get_post_meta($post->ID, '_domain_price', true);
$domain_record = get_post_meta($post->ID, '_domain_record', true);
$domain_transfer = get_post_meta($post->ID, '_domain_transfer', true);
$domain_provider = get_post_meta($post->ID, '_domain_provider', true); // 接入商
// 字段HTML
echo '<table class="form-table">';
echo '<tr><th><label for="domain_name">域名</label></th>';
echo '<td><input type="text" id="domain_name" name="domain_name" value="'.esc_attr($domain_name).'" class="regular-text" placeholder="例如：example.com"></td></tr>';

echo '<tr><th><label for="domain_price">价格（元）</label></th>';
echo '<td><input type="number" id="domain_price" name="domain_price" value="'.esc_attr($domain_price).'" class="regular-text" placeholder="例如：8800"></td></tr>';

echo '<tr><th><label for="domain_record">备案状态</label></th>';
echo '<td><select id="domain_record" name="domain_record">
<option value="已备案" '.selected($domain_record, '已备案', false).'>已备案</option>
<option value="未备案" '.selected($domain_record, '未备案', false).'>未备案</option>
<option value="备案中" '.selected($domain_record, '备案中', false).'>备案中</option>
</select></td></tr>';
echo '<tr><th><label for="domain_provider">接入商</label></th>';
echo '<td><input type="text" id="domain_provider" name="domain_provider" value="'.esc_attr($domain_provider).'" class="regular-text" placeholder="例如：阿里云、腾讯云、西部数码"></td></tr>';
echo '<tr><th><label for="domain_transfer">是否可转移</label></th>';
echo '<td><select id="domain_transfer" name="domain_transfer">
<option value="可转移" '.selected($domain_transfer, '可转移', false).'>可转移</option>
<option value="不可转移" '.selected($domain_transfer, '不可转移', false).'>不可转移</option>
</select></td></tr>';
echo '</table>';
}
function modown_save_domain_meta_data($post_id) {
// 验证nonce
if (!isset($_POST['domain_meta_nonce']) || !wp_verify_nonce($_POST['domain_meta_nonce'], 'modown_domain_meta_nonce')) {
return;
}
if (defined('DOING_AUTOSAVE') && DOING_AUTOSAVE) {
return;
}
// 验证权限
if (!current_user_can('edit_post', $post_id)) {
return;
}
// 保存字段
if (isset($_POST['domain_name'])) {
update_post_meta($post_id, '_domain_name', sanitize_text_field($_POST['domain_name']));
}
if (isset($_POST['domain_price'])) {
update_post_meta($post_id, '_domain_price', sanitize_text_field($_POST['domain_price']));
}
if (isset($_POST['domain_record'])) {
update_post_meta($post_id, '_domain_record', sanitize_text_field($_POST['domain_record']));
}
if (isset($_POST['domain_transfer'])) {
update_post_meta($post_id, '_domain_transfer', sanitize_text_field($_POST['domain_transfer']));
}
if (isset($_POST['domain_provider'])) {
update_post_meta($post_id, '_domain_provider', sanitize_text_field($_POST['domain_provider']));
}
}

注册域名页面侧边栏

function modown_domain_sidebar() {
register_sidebar(array(
'name' => '域名页面右侧边栏',
'id' => 'domain-sidebar',
'description' => '用于域名列表页和详情页右侧的小组件区域',
'before_widget' => '<div class="domain-widget %2$s">',
'after_widget' => '</div>',
'before_title' => '<h3 class="domain-widget-title">',
'after_title' => '</h3>',
));
}
add_action('widgets_init', 'modown_domain_sidebar');

?>

功能扩展（functions.php）

此内容查看价格为9.9XD立即购买

阅读全文