car-t-t/page-contact.php

<?php
/**
 * Template Name: 联系我们
 * Contact page with store details, storefront image, and map.
 *
 * @package Fragrance_Trade
 */

if ( ! defined( 'ABSPATH' ) ) {
	exit;
}

get_header();

$store_name    = fragrance_trade_get_mod( 'b2b_hero_title' );
$store_address = fragrance_trade_get_mod( 'store_address', '' );
$store_phone   = fragrance_trade_get_mod( 'store_phone' );
$store_hours   = fragrance_trade_get_mod( 'store_hours', '' );
$store_image   = fragrance_trade_image_uri( 'b2b_factory_image_1', 'store/storefront.jpg' );
$phone_href    = preg_replace( '/[^0-9+]/', '', $store_phone );
$has_phone     = strlen( preg_replace( '/[^0-9]/', '', $phone_href ) ) >= 5;

if ( ! $store_address ) {
	$store_address = fragrance_trade_get_mod( 'b2b_hero_text' );
}

$map_nav_url   = fragrance_trade_get_mod( 'store_map_url', '' );
$baidu_map_url = '';
if ( $store_address ) {
	$baidu_map_url = 'https://api.map.baidu.com/geocoder?address='
		. rawurlencode( $store_address )
		. '&output=html&src=webapp';
}
if ( ! $map_nav_url ) {
	$map_nav_url = $baidu_map_url;
}

/* translators: %s: store name. */
$map_title = sprintf( __( '%s门店地图', 'fragrance-trade' ), $store_name );
?>
<main id="primary" class="site-main">
	<div class="page-content container">
		<?php
		get_template_part(
			'template-parts/breadcrumb',
			null,
			array(
				'items' => array(
					array( 'label' => __( '首页', 'fragrance-trade' ), 'url' => home_url( '/' ) ),
					array( 'label' => __( '联系我们', 'fragrance-trade' ), 'url' => null ),
				),
			)
		);
		?>
	</div>

	<section class="b2b-section contact-section">
		<div class="container">
			<div class="row g-0 align-items-stretch contact-hero-grid">
				<div class="col-lg-5">
					<div class="contact-hero-copy">
						<p class="section-eyebrow"><?php esc_html_e( '咨询与到店', 'fragrance-trade' ); ?></p>
						<h1><?php echo esc_html( $store_name ); ?></h1>
						<p class="contact-hero-lead"><?php esc_html_e( '到店前可先电话确认车型、施工项目和时间，我们会提前做好接待安排。', 'fragrance-trade' ); ?></p>
						<div class="contact-hero-actions">
							<?php if ( $has_phone ) : ?>
								<a class="btn btn-b2b-primary" href="tel:<?php echo esc_attr( $phone_href ); ?>">
									<?php esc_html_e( '拨打门店电话', 'fragrance-trade' ); ?>
								</a>
							<?php endif; ?>
							<?php if ( $map_nav_url ) : ?>
								<a class="btn btn-b2b-outline" href="<?php echo esc_url( $map_nav_url ); ?>" target="_blank" rel="noopener noreferrer">
									<?php esc_html_e( '查看门店位置', 'fragrance-trade' ); ?>
								</a>
							<?php endif; ?>
						</div>
					</div>
				</div>
				<div class="col-lg-7">
					<figure class="contact-store-media">
						<img src="<?php echo esc_url( $store_image ); ?>" alt="<?php esc_attr_e( '门店临街门头', 'fragrance-trade' ); ?>" width="1600" height="1199" loading="eager" decoding="async">
						<figcaption><?php esc_html_e( '门店外景', 'fragrance-trade' ); ?></figcaption>
					</figure>
				</div>
			</div>
		</div>
	</section>

	<section class="b2b-section contact-details-section" aria-labelledby="contact-details-title">
		<div class="container">
			<div class="section-heading">
				<p class="section-eyebrow"><?php esc_html_e( '门店信息', 'fragrance-trade' ); ?></p>
				<h2 id="contact-details-title"><?php esc_html_e( '联系与到店信息', 'fragrance-trade' ); ?></h2>
			</div>
			<div class="contact-detail-grid<?php echo $store_hours ? ' has-hours' : ''; ?> mt-5">
				<article class="contact-detail-card">
					<p class="contact-detail-label"><?php esc_html_e( '门店名称', 'fragrance-trade' ); ?></p>
					<h3><?php echo esc_html( $store_name ); ?></h3>
				</article>
				<article class="contact-detail-card">
					<p class="contact-detail-label"><?php esc_html_e( '联系电话', 'fragrance-trade' ); ?></p>
					<?php if ( $store_phone ) : ?>
						<h3>
							<?php if ( $has_phone ) : ?>
								<a href="tel:<?php echo esc_attr( $phone_href ); ?>"><?php echo esc_html( $store_phone ); ?></a>
							<?php else : ?>
								<?php echo esc_html( $store_phone ); ?>
							<?php endif; ?>
						</h3>
					<?php else : ?>
						<p class="contact-detail-empty"><?php esc_html_e( '请在后台填写联系电话', 'fragrance-trade' ); ?></p>
					<?php endif; ?>
				</article>
				<article class="contact-detail-card">
					<p class="contact-detail-label"><?php esc_html_e( '门店地址', 'fragrance-trade' ); ?></p>
					<?php if ( $store_address ) : ?>
						<h3><?php echo esc_html( $store_address ); ?></h3>
					<?php else : ?>
						<p class="contact-detail-empty"><?php esc_html_e( '请在后台填写门店地址', 'fragrance-trade' ); ?></p>
					<?php endif; ?>
				</article>
				<?php if ( $store_hours ) : ?>
					<article class="contact-detail-card">
						<p class="contact-detail-label"><?php esc_html_e( '营业时间', 'fragrance-trade' ); ?></p>
						<h3><?php echo esc_html( $store_hours ); ?></h3>
					</article>
				<?php endif; ?>
			</div>
		</div>
	</section>

	<section class="b2b-section contact-map-section" aria-labelledby="contact-map-title">
		<div class="container">
			<div class="contact-map-heading">
				<div>
					<p class="section-eyebrow"><?php esc_html_e( '地图与导航', 'fragrance-trade' ); ?></p>
					<h2 id="contact-map-title"><?php esc_html_e( '找到门店', 'fragrance-trade' ); ?></h2>
					<?php if ( $store_address ) : ?>
						<p><?php echo esc_html( $store_address ); ?></p>
					<?php endif; ?>
				</div>
				<?php if ( $map_nav_url ) : ?>
					<a class="btn btn-b2b-primary" href="<?php echo esc_url( $map_nav_url ); ?>" target="_blank" rel="noopener noreferrer">
						<?php esc_html_e( '打开地图导航', 'fragrance-trade' ); ?> ↗
					</a>
				<?php endif; ?>
			</div>

			<div class="contact-map-panel">
				<?php if ( $baidu_map_url ) : ?>
					<iframe
						src="<?php echo esc_url( $baidu_map_url ); ?>"
						title="<?php echo esc_attr( $map_title ); ?>"
						loading="lazy"
						referrerpolicy="no-referrer-when-downgrade"
					></iframe>
				<?php else : ?>
					<div class="contact-map-placeholder">
						<span aria-hidden="true">＋</span>
						<p><?php esc_html_e( '填写门店地址后将在这里显示地图。', 'fragrance-trade' ); ?></p>
					</div>
				<?php endif; ?>
			</div>
		</div>
	</section>
</main>
<?php get_footer(); ?>