File: /var/www/html/CW-techs/wp-content/themes/cw-techs/index.php
<?php /* Template Name: Home Page */
get_header(); ?>
<section class="banner-slider">
<div class="slider-inner">
<div class="slide1">
<div class="container custom-container custom-container2">
<div class="inner-sec" >
<div class="content">
<h2 class="title">TIMELESS DEALS<br><span>ON PREMIUM WATCHES</span></h2>
<p class="subtitle">Elevate your style with exclusive discounts on top-brand timepieces – for a limited time only.</p>
<a href="<?php echo esc_url(get_permalink(wc_get_page_id('shop'))); ?>" class="sec-btn primary-bg"><span>Buy Now</span> <span class="img"><img src="<?php echo get_template_directory_uri(); ?>/img/rt-arrw.svg"></span></a>
</div>
<div class="product-img">
<img src="<?php echo get_template_directory_uri(); ?>/img/rt-bnr-img.png" alt="Product Image">
</div>
</div>
</div>
</div>
<!-- <div class="slide1" >
<div class="container custom-container">
<div class="inner-sec">
<div class="content">
<h2 class="title">TIMELESS DEALS<br><span>ON PREMIUM WATCHES11</span></h2>
<p class="subtitle">Elevate your style with exclusive discounts on top-brand timepieces – for a limited time only.</p>
<a href="#" class="sec-btn">Buy Now <span><img src="<?php echo get_template_directory_uri(); ?>/img/btn-chevron-right.svg"></span></a>
</div>
<div class="product-img">
<img src="<?php echo get_template_directory_uri(); ?>/img/rt-bnr-img.png" alt="Product Image">
</div>
</div>
</div>
</div> -->
</div>
</section>
<section class="product-listing px-common">
<div class="container custom-container">
<h2 class="title">Our Best <span class="color">Seller</span></h2>
<div class="tab-wrp">
<ul class="nav nav-tabs product-tabs" id="myTab" role="tablist">
<li class="nav-item" role="presentation">
<button class="nav-link active" id="new-tab" data-bs-toggle="tab" data-bs-target="#new-tab-pane" type="button" role="tab" aria-controls="new-tab-pane" aria-selected="true">New Arrivals</button>
</li>
<li class="nav-item" role="presentation">
<button class="nav-link" id="sale-tab" data-bs-toggle="tab" data-bs-target="#sale-tab-pane" type="button" role="tab" aria-controls="sale-tab-pane" aria-selected="false">On Sale</button>
</li>
<li class="nav-item" role="presentation">
<button class="nav-link" id="premium-tab" data-bs-toggle="tab" data-bs-target="#premium-tab-pane" type="button" role="tab" aria-controls="premium-tab-pane" aria-selected="false">Premium</button>
</li>
</ul>
<div class="tab-content" id="myTabContent">
<?php
function render_tab_products($products) {
$user_id = get_current_user_id();
$favorites = get_user_meta($user_id, 'favorite_products', true);
if (!is_array($favorites)) {
$favorites = [];
}
foreach ($products as $product) :
$product_id = $product->get_id();
$image = $product->get_image(); // returns <img>
$link = get_permalink($product_id);
$name = $product->get_name();
$price_html = $product->get_price_html();
$rating_html = wc_get_rating_html($product->get_average_rating());
$is_on_sale = $product->is_on_sale();
$reg_price = $product->get_regular_price();
$sale_price = $product->get_sale_price();
$discount = ($is_on_sale && $reg_price > 0) ? round(100 - ($sale_price / $reg_price) * 100) : 0;
// Check if product is in favorites
$is_favorite = in_array($product_id, $favorites);
$img_src = $is_favorite
? get_template_directory_uri() . '/img/fav-list-selected.svg'
: get_template_directory_uri() . '/img/fav-list-plain.svg';
$fav_img = '<img src="' . $img_src . '" alt="">';
?>
<a class="listing-blks" href="<?php echo esc_url($link); ?>">
<div class="products-wrp">
<?php if ($is_on_sale) : ?>
<div class="off-label">
<span class="icon"><img src="<?php echo get_template_directory_uri(); ?>/img/discount-icon.svg" alt="discount"></span>
<span class="txt"><?php echo esc_html($discount); ?>% OFF</span>
</div>
<?php endif; ?>
<div class="fav-list fav-btn" data-product="<?php echo esc_attr($product_id); ?>">
<?=$fav_img?>
</div>
<div class="prod-img">
<?php echo $image; ?>
</div>
</div>
<div class="product-desc">
<div class="prod-title"><?php echo esc_html($name); ?></div>
<div class="price-blk">
<span class="price">
<?php
if ( $product->is_on_sale() ) {
echo '<ins>' . wc_price( $product->get_sale_price() ) . '</ins>';
echo '<del>' . wc_price( $product->get_regular_price() ) . '</del> ';
} else {
echo wc_price( $product->get_price() );
}
?>
</span>
</div>
<div class="bottom-blk">
<?php if ($is_on_sale) : ?>
<div class="save-tag">Save - <?php echo esc_html($discount); ?>%</div>
<?php endif; ?>
<div class="rating-wrp">
<div class="rating">
<?php
$rating = round( $product->get_average_rating() ); // 0 to 5
$star_img = get_template_directory_uri() . '/img/rating-star.svg';
$empty_star_img = get_template_directory_uri() . '/img/rating-star.svg'; // same image, but faded via CSS
for ($i = 1; $i <= 5; $i++) {
$is_active = $i <= $rating ? 'active' : '';
echo '<button class="rating-btn ' . $is_active . '">
<img src="' . esc_url($star_img) . '" alt="star">
</button>';
}
?>
</div>
</div>
</div>
</div>
</a>
<?php
endforeach;
}
?>
<!-- New Arrivals -->
<div class="tab-pane fade show active" id="new-tab-pane" role="tabpanel" aria-labelledby="new-tab">
<div class="listing-products">
<?php
$new_products = wc_get_products([
'limit' => 8,
'orderby' => 'date',
'order' => 'DESC',
'status' => 'publish',
]);
render_tab_products($new_products);
?>
</div>
</div>
<!-- On Sale -->
<div class="tab-pane fade" id="sale-tab-pane" role="tabpanel" aria-labelledby="sale-tab">
<div class="listing-products">
<?php
$on_sale_ids = wc_get_product_ids_on_sale();
$on_sale_products = wc_get_products([
'include' => $on_sale_ids,
'limit' => 8,
'status' => 'publish',
]);
render_tab_products($on_sale_products);
?>
</div>
</div>
<!-- Premium -->
<div class="tab-pane fade" id="premium-tab-pane" role="tabpanel" aria-labelledby="premium-tab">
<div class="listing-products">
<?php
$premium_products = wc_get_products([
'limit' => 8,
'min_price' => 10000,
'orderby' => 'price',
'order' => 'DESC',
'status' => 'publish',
]);
render_tab_products($premium_products);
?>
</div>
</div>
</div>
<div class="btn-blk">
<a href="<?php echo esc_url(get_permalink(wc_get_page_id('shop'))); ?>" class="sec-btn">
<span class="txt">View More</span>
<span class="icon"><img src="<?php echo get_template_directory_uri(); ?>/img/btn-chevron-right.svg" alt=""></span>
</a>
</div>
</div>
</div>
</section>
<section class="mid-prod-bnr px-common">
<div class="content-left">
<h2 class="title">
Up to 60% Off <span class="color">Fashion Dresses!</span>
</h2>
<div class="bnr-desc">
Refresh your wardrobe with stunning styles at unbeatable prices. Get up to 60% off on our latest fashion
dress collection!
</div>
<a href="<?php echo esc_url(get_permalink(wc_get_page_id('shop'))); ?>" class="sec-btn primary-bg">
<span class="txt">Buy Now</span>
<span class="icon"><img src="<?php echo get_template_directory_uri(); ?>/img/white-arrow-btn.svg" alt=""></span>
</a>
</div>
<div class="img-wrp-hold">
<img src="<?php echo get_template_directory_uri(); ?>/img/door-lock.png" alt="">
</div>
</section>
<section class="brand-slide-wrp">
<div class="brand-slider">
<div>
<div class="slide-item">
<img src="<?php echo get_template_directory_uri(); ?>/img/apple.svg" alt="">
</div>
</div>
<div>
<div class="slide-item">
<img src="<?php echo get_template_directory_uri(); ?>/img/samsung.svg" alt="">
</div>
</div>
<div>
<div class="slide-item">
<img src="<?php echo get_template_directory_uri(); ?>/img/realme.svg" alt="">
</div>
</div>
<div>
<div class="slide-item">
<img src="<?php echo get_template_directory_uri(); ?>/img/xiaomi.svg" alt="">
</div>
</div>
<div>
<div class="slide-item">
<img src="<?php echo get_template_directory_uri(); ?>/img/oppo.svg" alt="">
</div>
</div>
<div>
<div class="slide-item">
<img src="<?php echo get_template_directory_uri(); ?>/img/apple.svg" alt="">
</div>
</div>
</div>
</section>
<?php include get_template_directory() . '/templates/above-footer.php'; ?>
</div>
<?php get_footer(); ?>