- Add mobile hamburger toggle button and full-screen nav drawer (≤1024px) - Fix product tab styles: complete tab CSS without relying on WC parent selectors; explicit wc-single-product enqueue on product pages - Fix STOCK field: conditionally hide when get_stock_quantity() returns null instead of showing '— units' - Add page-designs.php template + template_include filter so /designs/ uses themed layout instead of raw WooCommerce output - Align nav/footer terminology: 'Canvas' → 'Wall Decor' in nav fallback; correct broken category URL slugs (mugs→drinkware, canvas→wall-decor, planners→stationery, blog→the-memo); add 'Bulk / HR' to mobile drawer Co-Authored-By: Paperclip <noreply@paperclip.ing>
113 lines
4.6 KiB
PHP
113 lines
4.6 KiB
PHP
<?php
|
||
/**
|
||
* Template Name: Designs Index
|
||
* Themed product listing for the /designs/ page.
|
||
*/
|
||
defined('ABSPATH') || exit;
|
||
|
||
get_header();
|
||
|
||
$paged = max(1, get_query_var('paged'));
|
||
|
||
$designs_query = new WP_Query([
|
||
'post_type' => 'product',
|
||
'posts_per_page' => 12,
|
||
'paged' => $paged,
|
||
'post_status' => 'publish',
|
||
]);
|
||
?>
|
||
|
||
<div class="rar-breadcrumb">
|
||
<a href="<?php echo esc_url(home_url('/')); ?>">Shop</a> /
|
||
<span>Designs</span>
|
||
</div>
|
||
|
||
<div class="rar-cat-hero">
|
||
<div class="rar-folder-tab">DEPT. DESIGNS · COLLECTION</div>
|
||
<div class="rar-cat-hero__inner">
|
||
<div>
|
||
<h1>
|
||
Designs.<br>
|
||
<em style="color:var(--stamp);font-style:italic;">Art for the quietly suffering.</em>
|
||
</h1>
|
||
</div>
|
||
<div>
|
||
<p style="font-size:14px;line-height:1.6;color:var(--ink-muted);margin:0 0 18px;max-width:380px;">
|
||
Print-on-demand wall art and stickers for the desk-bound. Corporate in format, passive-aggressive in spirit.
|
||
</p>
|
||
<div class="rar-cat-hero__stats">
|
||
<span><?php echo esc_html($designs_query->found_posts); ?> ITEMS</span>
|
||
<span>·</span>
|
||
<span>FREE SHIP OVER $40</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="rar-toolbar">
|
||
<div class="rar-toolbar__left">
|
||
Showing <?php echo esc_html(($paged - 1) * 12 + 1); ?>–<?php echo esc_html(min($paged * 12, $designs_query->found_posts)); ?>
|
||
of <?php echo esc_html($designs_query->found_posts); ?> designs
|
||
</div>
|
||
</div>
|
||
|
||
<div class="rar-products" style="padding-top:0;">
|
||
<div class="rar-products__grid" id="rar-product-grid">
|
||
<?php if ($designs_query->have_posts()) : while ($designs_query->have_posts()) : $designs_query->the_post();
|
||
global $product;
|
||
if (!$product) $product = wc_get_product(get_the_ID());
|
||
if (!$product) continue;
|
||
|
||
$img_id = $product->get_image_id();
|
||
$img_url = $img_id ? wp_get_attachment_image_url($img_id, 'rar-product-card') : '';
|
||
$sku = $product->get_sku() ?: 'SKU-' . $product->get_id();
|
||
$cats = get_the_terms(get_the_ID(), 'product_cat');
|
||
$catname = $cats ? $cats[0]->name : '';
|
||
$stock = $product->get_stock_status();
|
||
$stock_label = $stock === 'instock' ? 'IN STOCK' : ($stock === 'onbackorder' ? 'BACKORDER' : 'OUT OF STOCK');
|
||
$stock_color = $stock === 'instock' ? 'var(--olive-dark)' : 'var(--ink-faint)';
|
||
?>
|
||
<a href="<?php echo esc_url(get_permalink()); ?>" class="rar-card">
|
||
<div class="rar-card__media">
|
||
<div class="rar-card__sku">SKU <?php echo esc_html($sku); ?></div>
|
||
<?php if ($img_url) : ?>
|
||
<img src="<?php echo esc_url($img_url); ?>" alt="<?php echo esc_attr($product->get_name()); ?>" />
|
||
<?php else : ?>
|
||
<div class="rar-placeholder__label"><?php echo esc_html(strtoupper($catname ?: $product->get_name())); ?></div>
|
||
<?php endif; ?>
|
||
</div>
|
||
<div class="rar-card__body">
|
||
<?php if ($catname) : ?><div class="rar-card__cat"><?php echo esc_html($catname); ?></div><?php endif; ?>
|
||
<div class="rar-card__title"><?php echo esc_html($product->get_name()); ?></div>
|
||
<div class="rar-card__row">
|
||
<span class="rar-card__price"><?php echo wp_kses_post($product->get_price_html()); ?></span>
|
||
<span style="color:<?php echo esc_attr($stock_color); ?>;font-family:var(--mono);font-size:9px;letter-spacing:0.18em;"><?php echo esc_html($stock_label); ?></span>
|
||
</div>
|
||
</div>
|
||
</a>
|
||
<?php endwhile; wp_reset_postdata();
|
||
else : ?>
|
||
<p style="font-family:var(--serif);font-size:18px;font-style:italic;color:var(--ink-muted);grid-column:1/-1;">
|
||
No designs found. The creative department is on a deadline.
|
||
</p>
|
||
<?php endif; ?>
|
||
</div>
|
||
|
||
<?php if ($designs_query->max_num_pages > 1) : ?>
|
||
<div class="rar-pagination">
|
||
<div class="rar-page-btns">
|
||
<?php
|
||
echo paginate_links([
|
||
'total' => $designs_query->max_num_pages,
|
||
'current' => $paged,
|
||
'prev_text' => '‹',
|
||
'next_text' => '›',
|
||
]);
|
||
?>
|
||
</div>
|
||
</div>
|
||
<?php endif; ?>
|
||
</div>
|
||
|
||
<?php get_footer(); ?>
|