dwindown/WooNooW
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: implement header/footer visibility controls for checkout and thankyou pages

Browse Source 
- Created LayoutWrapper component to conditionally render header/footer based on route
- Created MinimalHeader component (logo only)
- Created MinimalFooter component (trust badges + policy links)
- Created usePageVisibility hook to get visibility settings per page
- Wrapped ClassicLayout with LayoutWrapper for conditional rendering
- Header/footer visibility now controlled directly in React SPA
- Settings: show/minimal/hide for both header and footer
- Background color support for checkout and thankyou pages
This commit is contained in:
Dwindi Ramadhana
2025-12-25 22:20:48 +07:00
parent c37ecb8e96
commit 9ac09582d2
104 changed files with 14801 additions and 1213 deletions
Download Patch File Download Diff File Expand all files Collapse all files

91
includes/Frontend/PageAppearance.php Normal file
View File

@@ -0,0 +1,91 @@
<?php
namespace WooNooW\Frontend;
class PageAppearance {
private $settings;
public function __construct() {
add_action('wp_head', [$this, 'add_appearance_styles'], 999);
}
private function get_appearance_settings() {
if ($this->settings === null) {
$this->settings = get_option('woonoow_appearance_settings', []);
}
return $this->settings;
}
public function add_appearance_styles() {
// Only inject styles on SPA pages (shop archive)
if (!is_post_type_archive('product') && !is_shop()) {
return;
}
?>
<style id="woonoow-page-appearance">
/* Header visibility styles */
body.woonoow-header-hide header,
body.woonoow-header-hide .site-header,
body.woonoow-header-hide #masthead {
display: none !important;
}
body.woonoow-header-minimal header,
body.woonoow-header-minimal .site-header,
body.woonoow-header-minimal #masthead {
padding: 1rem 0 !important;
box-shadow: none !important;
border-bottom: 1px solid #e5e7eb;
}
body.woonoow-header-minimal header .site-navigation,
body.woonoow-header-minimal .site-header .site-navigation,
body.woonoow-header-minimal #masthead .site-navigation,
body.woonoow-header-minimal header nav,
body.woonoow-header-minimal .site-header nav,
body.woonoow-header-minimal #masthead nav {
display: none !important;
}
body.woonoow-header-minimal header .header-widgets,
body.woonoow-header-minimal .site-header .header-widgets,
body.woonoow-header-minimal #masthead .header-widgets {
display: none !important;
}
/* Footer visibility styles */
body.woonoow-footer-hide footer,
body.woonoow-footer-hide .site-footer,
body.woonoow-footer-hide #colophon {
display: none !important;
}
body.woonoow-footer-minimal footer,
body.woonoow-footer-minimal .site-footer,
body.woonoow-footer-minimal #colophon {
padding: 2rem 0 !important;
background: #f9fafb !important;
border-top: 1px solid #e5e7eb;
}
body.woonoow-footer-minimal footer .footer-widgets,
body.woonoow-footer-minimal .site-footer .footer-widgets,
body.woonoow-footer-minimal #colophon .footer-widgets,
body.woonoow-footer-minimal footer .widget-area,
body.woonoow-footer-minimal .site-footer .widget-area,
body.woonoow-footer-minimal #colophon .widget-area {
display: none !important;
}
body.woonoow-footer-minimal footer .site-info,
body.woonoow-footer-minimal .site-footer .site-info,
body.woonoow-footer-minimal #colophon .site-info {
text-align: center;
font-size: 0.875rem;
color: #6b7280;
}
</style>
<?php
}
}