I’ll build this as a WordPress theme options module, focused on layout controls: site width, containers, header/sidebar/footer layouts, archive/single/page layout, breadcrumbs, sticky elements, responsive spacing, and CSS variable output.
Below is an advanced inc/options/layout-options.php file for your rx theme. It adds many layout options through the WordPress Customizer and outputs safe dynamic CSS.
Create this file:
rx-theme/inc/options/layout-options.phpThen paste this code:
<?php
/**
* RX Theme Layout Options
*
* File: inc/options/layout-options.php
*
* This file adds advanced layout controls for the RX Theme.
* It includes Customizer settings, sanitization callbacks, body classes,
* dynamic CSS variables, layout helper functions, and frontend layout utilities.
*
* @package RX_Theme
*/
defined( 'ABSPATH' ) || exit;
if ( ! defined( 'RX_THEME_VERSION' ) ) {
define( 'RX_THEME_VERSION', '1.0.0' );
}
/**
* Main layout option defaults.
*/
if ( ! function_exists( 'rx_get_layout_defaults' ) ) {
function rx_get_layout_defaults() {
return array(
'site_layout' => 'wide',
'container_width' => 1200,
'content_width' => 760,
'boxed_width' => 1280,
'main_gap' => 32,
'section_spacing' => 48,
'header_layout' => 'horizontal',
'header_width' => 'contained',
'sticky_header' => true,
'shrink_sticky_header' => true,
'transparent_header' => false,
'mobile_header_layout' => 'logo-left-menu-right',
'nav_layout' => 'inline',
'nav_alignment' => 'right',
'nav_dropdown_style' => 'shadow',
'nav_sticky_on_scroll' => false,
'archive_layout' => 'right-sidebar',
'archive_card_layout' => 'grid',
'archive_columns_desktop' => 3,
'archive_columns_tablet' => 2,
'archive_columns_mobile' => 1,
'archive_excerpt_length' => 28,
'archive_featured_image' => true,
'archive_read_more' => true,
'archive_meta' => true,
'single_layout' => 'right-sidebar',
'single_content_width' => 780,
'single_featured_image' => true,
'single_author_box' => true,
'single_related_posts' => true,
'single_post_nav' => true,
'single_sticky_toc' => false,
'single_meta' => true,
'page_layout' => 'no-sidebar',
'page_content_width' => 900,
'page_featured_image' => false,
'sidebar_width' => 320,
'sidebar_gap' => 40,
'sticky_sidebar' => true,
'mobile_sidebar_position' => 'after-content',
'footer_layout' => 'four-columns',
'footer_width' => 'contained',
'footer_widgets' => true,
'footer_bottom_layout' => 'two-columns',
'back_to_top' => true,
'breadcrumbs' => true,
'breadcrumbs_position' => 'before-content',
'breadcrumbs_on_home' => false,
'pagination_type' => 'numbered',
'load_more_button' => false,
'infinite_scroll' => false,
'image_radius' => 12,
'card_radius' => 16,
'button_radius' => 8,
'input_radius' => 8,
'enable_scroll_animations' => false,
'enable_smooth_scroll' => true,
'enable_lazy_layout_effects' => true,
'mobile_breakpoint' => 768,
'tablet_breakpoint' => 1024,
'desktop_breakpoint' => 1200,
'mobile_container_padding' => 16,
'tablet_container_padding' => 24,
'desktop_container_padding' => 32,
'print_friendly_layout' => true,
'accessibility_skip_layout' => true,
'reduce_motion_support' => true,
);
}
}
/**
* Get layout option.
*/
if ( ! function_exists( 'rx_get_layout_option' ) ) {
function rx_get_layout_option( $key, $fallback = null ) {
$defaults = rx_get_layout_defaults();
if ( null === $fallback && isset( $defaults[ $key ] ) ) {
$fallback = $defaults[ $key ];
}
return get_theme_mod( 'rx_' . $key, $fallback );
}
}
/**
* Boolean sanitizer.
*/
if ( ! function_exists( 'rx_sanitize_checkbox' ) ) {
function rx_sanitize_checkbox( $checked ) {
return ( isset( $checked ) && true === (bool) $checked );
}
}
/**
* Select sanitizer.
*/
if ( ! function_exists( 'rx_sanitize_select' ) ) {
function rx_sanitize_select( $input, $setting ) {
$control = $setting->manager->get_control( $setting->id );
if ( ! $control || empty( $control->choices ) ) {
return sanitize_text_field( $input );
}
return array_key_exists( $input, $control->choices ) ? $input : $setting->default;
}
}
/**
* Integer sanitizer.
*/
if ( ! function_exists( 'rx_sanitize_integer' ) ) {
function rx_sanitize_integer( $input ) {
return absint( $input );
}
}
/**
* Range sanitizer with optional min/max.
*/
if ( ! function_exists( 'rx_sanitize_range' ) ) {
function rx_sanitize_range( $input, $setting ) {
$input = absint( $input );
$control = $setting->manager->get_control( $setting->id );
if ( ! $control ) {
return $input;
}
$min = isset( $control->input_attrs['min'] ) ? absint( $control->input_attrs['min'] ) : 0;
$max = isset( $control->input_attrs['max'] ) ? absint( $control->input_attrs['max'] ) : 9999;
if ( $input < $min ) {
$input = $min;
}
if ( $input > $max ) {
$input = $max;
}
return $input;
}
}
/**
* Add layout options to Customizer.
*/
if ( ! function_exists( 'rx_customize_register_layout_options' ) ) {
function rx_customize_register_layout_options( $wp_customize ) {
$defaults = rx_get_layout_defaults();
$wp_customize->add_panel(
'rx_layout_panel',
array(
'title' => esc_html__( 'RX Layout Options', 'rx-theme' ),
'description' => esc_html__( 'Control global layout, header, footer, sidebar, archive, single post, page, spacing, and responsive behavior.', 'rx-theme' ),
'priority' => 25,
)
);
/**
* Sections.
*/
$sections = array(
'rx_global_layout_section' => array(
'title' => esc_html__( 'Global Layout', 'rx-theme' ),
'priority' => 10,
),
'rx_header_layout_section' => array(
'title' => esc_html__( 'Header Layout', 'rx-theme' ),
'priority' => 20,
),
'rx_navigation_layout_section' => array(
'title' => esc_html__( 'Navigation Layout', 'rx-theme' ),
'priority' => 30,
),
'rx_archive_layout_section' => array(
'title' => esc_html__( 'Archive / Blog Layout', 'rx-theme' ),
'priority' => 40,
),
'rx_single_layout_section' => array(
'title' => esc_html__( 'Single Post Layout', 'rx-theme' ),
'priority' => 50,
),
'rx_page_layout_section' => array(
'title' => esc_html__( 'Page Layout', 'rx-theme' ),
'priority' => 60,
),
'rx_sidebar_layout_section' => array(
'title' => esc_html__( 'Sidebar Layout', 'rx-theme' ),
'priority' => 70,
),
'rx_footer_layout_section' => array(
'title' => esc_html__( 'Footer Layout', 'rx-theme' ),
'priority' => 80,
),
'rx_breadcrumb_layout_section' => array(
'title' => esc_html__( 'Breadcrumbs', 'rx-theme' ),
'priority' => 90,
),
'rx_pagination_layout_section' => array(
'title' => esc_html__( 'Pagination', 'rx-theme' ),
'priority' => 100,
),
'rx_shape_layout_section' => array(
'title' => esc_html__( 'Radius / Shape', 'rx-theme' ),
'priority' => 110,
),
'rx_responsive_layout_section' => array(
'title' => esc_html__( 'Responsive Layout', 'rx-theme' ),
'priority' => 120,
),
'rx_extra_layout_section' => array(
'title' => esc_html__( 'Extra Layout Features', 'rx-theme' ),
'priority' => 130,
),
);
foreach ( $sections as $section_id => $section_args ) {
$wp_customize->add_section(
$section_id,
array(
'title' => $section_args['title'],
'panel' => 'rx_layout_panel',
'priority' => $section_args['priority'],
)
);
}
/**
* Helper: add select control.
*/
$add_select = function( $key, $label, $section, $choices, $priority = 10 ) use ( $wp_customize, $defaults ) {
$wp_customize->add_setting(
'rx_' . $key,
array(
'default' => isset( $defaults[ $key ] ) ? $defaults[ $key ] : '',
'sanitize_callback' => 'rx_sanitize_select',
'transport' => 'refresh',
)
);
$wp_customize->add_control(
'rx_' . $key,
array(
'label' => $label,
'section' => $section,
'type' => 'select',
'choices' => $choices,
'priority' => $priority,
)
);
};
/**
* Helper: add checkbox control.
*/
$add_checkbox = function( $key, $label, $section, $priority = 10 ) use ( $wp_customize, $defaults ) {
$wp_customize->add_setting(
'rx_' . $key,
array(
'default' => isset( $defaults[ $key ] ) ? $defaults[ $key ] : false,
'sanitize_callback' => 'rx_sanitize_checkbox',
'transport' => 'refresh',
)
);
$wp_customize->add_control(
'rx_' . $key,
array(
'label' => $label,
'section' => $section,
'type' => 'checkbox',
'priority' => $priority,
)
);
};
/**
* Helper: add range control.
*/
$add_range = function( $key, $label, $section, $min, $max, $step = 1, $priority = 10, $description = '' ) use ( $wp_customize, $defaults ) {
$wp_customize->add_setting(
'rx_' . $key,
array(
'default' => isset( $defaults[ $key ] ) ? $defaults[ $key ] : $min,
'sanitize_callback' => 'rx_sanitize_range',
'transport' => 'refresh',
)
);
$wp_customize->add_control(
'rx_' . $key,
array(
'label' => $label,
'description' => $description,
'section' => $section,
'type' => 'range',
'priority' => $priority,
'input_attrs' => array(
'min' => $min,
'max' => $max,
'step' => $step,
),
)
);
};
/**
* Global Layout.
*/
$add_select(
'site_layout',
esc_html__( 'Site Layout', 'rx-theme' ),
'rx_global_layout_section',
array(
'wide' => esc_html__( 'Wide', 'rx-theme' ),
'boxed' => esc_html__( 'Boxed', 'rx-theme' ),
'framed' => esc_html__( 'Framed', 'rx-theme' ),
'full-width' => esc_html__( 'Full Width', 'rx-theme' ),
),
10
);
$add_range( 'container_width', esc_html__( 'Container Width', 'rx-theme' ), 'rx_global_layout_section', 960, 1920, 10, 20, esc_html__( 'Main website container width in pixels.', 'rx-theme' ) );
$add_range( 'content_width', esc_html__( 'Default Content Width', 'rx-theme' ), 'rx_global_layout_section', 600, 1200, 10, 30 );
$add_range( 'boxed_width', esc_html__( 'Boxed Layout Width', 'rx-theme' ), 'rx_global_layout_section', 960, 1600, 10, 40 );
$add_range( 'main_gap', esc_html__( 'Main Layout Gap', 'rx-theme' ), 'rx_global_layout_section', 0, 80, 2, 50 );
$add_range( 'section_spacing', esc_html__( 'Section Spacing', 'rx-theme' ), 'rx_global_layout_section', 0, 120, 4, 60 );
/**
* Header Layout.
*/
$add_select(
'header_layout',
esc_html__( 'Header Layout', 'rx-theme' ),
'rx_header_layout_section',
array(
'horizontal' => esc_html__( 'Horizontal', 'rx-theme' ),
'centered-logo' => esc_html__( 'Centered Logo', 'rx-theme' ),
'split-menu' => esc_html__( 'Split Menu', 'rx-theme' ),
'vertical-left' => esc_html__( 'Vertical Left', 'rx-theme' ),
'vertical-right' => esc_html__( 'Vertical Right', 'rx-theme' ),
'minimal' => esc_html__( 'Minimal', 'rx-theme' ),
),
10
);
$add_select(
'header_width',
esc_html__( 'Header Width', 'rx-theme' ),
'rx_header_layout_section',
array(
'contained' => esc_html__( 'Contained', 'rx-theme' ),
'full' => esc_html__( 'Full Width', 'rx-theme' ),
'stretched' => esc_html__( 'Stretched', 'rx-theme' ),
),
20
);
$add_checkbox( 'sticky_header', esc_html__( 'Enable Sticky Header', 'rx-theme' ), 'rx_header_layout_section', 30 );
$add_checkbox( 'shrink_sticky_header', esc_html__( 'Shrink Sticky Header on Scroll', 'rx-theme' ), 'rx_header_layout_section', 40 );
$add_checkbox( 'transparent_header', esc_html__( 'Enable Transparent Header', 'rx-theme' ), 'rx_header_layout_section', 50 );
$add_select(
'mobile_header_layout',
esc_html__( 'Mobile Header Layout', 'rx-theme' ),
'rx_header_layout_section',
array(
'logo-left-menu-right' => esc_html__( 'Logo Left, Menu Right', 'rx-theme' ),
'logo-center-menu-left' => esc_html__( 'Logo Center, Menu Left', 'rx-theme' ),
'logo-right-menu-left' => esc_html__( 'Logo Right, Menu Left', 'rx-theme' ),
'stacked' => esc_html__( 'Stacked', 'rx-theme' ),
),
60
);
/**
* Navigation Layout.
*/
$add_select(
'nav_layout',
esc_html__( 'Navigation Layout', 'rx-theme' ),
'rx_navigation_layout_section',
array(
'inline' => esc_html__( 'Inline', 'rx-theme' ),
'centered' => esc_html__( 'Centered', 'rx-theme' ),
'justified' => esc_html__( 'Justified', 'rx-theme' ),
'offcanvas' => esc_html__( 'Off Canvas', 'rx-theme' ),
'mega-ready' => esc_html__( 'Mega Menu Ready', 'rx-theme' ),
),
10
);
$add_select(
'nav_alignment',
esc_html__( 'Navigation Alignment', 'rx-theme' ),
'rx_navigation_layout_section',
array(
'left' => esc_html__( 'Left', 'rx-theme' ),
'center' => esc_html__( 'Center', 'rx-theme' ),
'right' => esc_html__( 'Right', 'rx-theme' ),
),
20
);
$add_select(
'nav_dropdown_style',
esc_html__( 'Dropdown Style', 'rx-theme' ),
'rx_navigation_layout_section',
array(
'shadow' => esc_html__( 'Shadow', 'rx-theme' ),
'bordered' => esc_html__( 'Bordered', 'rx-theme' ),
'minimal' => esc_html__( 'Minimal', 'rx-theme' ),
'glass' => esc_html__( 'Glass Effect', 'rx-theme' ),
),
30
);
$add_checkbox( 'nav_sticky_on_scroll', esc_html__( 'Sticky Navigation on Scroll', 'rx-theme' ), 'rx_navigation_layout_section', 40 );
/**
* Archive Layout.
*/
$add_select(
'archive_layout',
esc_html__( 'Archive Sidebar Layout', 'rx-theme' ),
'rx_archive_layout_section',
array(
'no-sidebar' => esc_html__( 'No Sidebar', 'rx-theme' ),
'left-sidebar' => esc_html__( 'Left Sidebar', 'rx-theme' ),
'right-sidebar' => esc_html__( 'Right Sidebar', 'rx-theme' ),
'both-sidebar' => esc_html__( 'Both Sidebars', 'rx-theme' ),
),
10
);
$add_select(
'archive_card_layout',
esc_html__( 'Archive Card Layout', 'rx-theme' ),
'rx_archive_layout_section',
array(
'list' => esc_html__( 'List', 'rx-theme' ),
'grid' => esc_html__( 'Grid', 'rx-theme' ),
'masonry' => esc_html__( 'Masonry', 'rx-theme' ),
'magazine' => esc_html__( 'Magazine', 'rx-theme' ),
'minimal' => esc_html__( 'Minimal', 'rx-theme' ),
),
20
);
$add_range( 'archive_columns_desktop', esc_html__( 'Archive Columns Desktop', 'rx-theme' ), 'rx_archive_layout_section', 1, 6, 1, 30 );
$add_range( 'archive_columns_tablet', esc_html__( 'Archive Columns Tablet', 'rx-theme' ), 'rx_archive_layout_section', 1, 4, 1, 40 );
$add_range( 'archive_columns_mobile', esc_html__( 'Archive Columns Mobile', 'rx-theme' ), 'rx_archive_layout_section', 1, 2, 1, 50 );
$add_range( 'archive_excerpt_length', esc_html__( 'Archive Excerpt Length', 'rx-theme' ), 'rx_archive_layout_section', 0, 100, 1, 60 );
$add_checkbox( 'archive_featured_image', esc_html__( 'Show Archive Featured Image', 'rx-theme' ), 'rx_archive_layout_section', 70 );
$add_checkbox( 'archive_read_more', esc_html__( 'Show Read More Button', 'rx-theme' ), 'rx_archive_layout_section', 80 );
$add_checkbox( 'archive_meta', esc_html__( 'Show Archive Meta', 'rx-theme' ), 'rx_archive_layout_section', 90 );
/**
* Single Layout.
*/
$add_select(
'single_layout',
esc_html__( 'Single Post Sidebar Layout', 'rx-theme' ),
'rx_single_layout_section',
array(
'no-sidebar' => esc_html__( 'No Sidebar', 'rx-theme' ),
'left-sidebar' => esc_html__( 'Left Sidebar', 'rx-theme' ),
'right-sidebar' => esc_html__( 'Right Sidebar', 'rx-theme' ),
'both-sidebar' => esc_html__( 'Both Sidebars', 'rx-theme' ),
),
10
);
$add_range( 'single_content_width', esc_html__( 'Single Content Width', 'rx-theme' ), 'rx_single_layout_section', 600, 1200, 10, 20 );
$add_checkbox( 'single_featured_image', esc_html__( 'Show Single Featured Image', 'rx-theme' ), 'rx_single_layout_section', 30 );
$add_checkbox( 'single_author_box', esc_html__( 'Show Author Box', 'rx-theme' ), 'rx_single_layout_section', 40 );
$add_checkbox( 'single_related_posts', esc_html__( 'Show Related Posts', 'rx-theme' ), 'rx_single_layout_section', 50 );
$add_checkbox( 'single_post_nav', esc_html__( 'Show Previous / Next Post Navigation', 'rx-theme' ), 'rx_single_layout_section', 60 );
$add_checkbox( 'single_sticky_toc', esc_html__( 'Enable Sticky Table of Contents Area', 'rx-theme' ), 'rx_single_layout_section', 70 );
$add_checkbox( 'single_meta', esc_html__( 'Show Single Post Meta', 'rx-theme' ), 'rx_single_layout_section', 80 );
/**
* Page Layout.
*/
$add_select(
'page_layout',
esc_html__( 'Page Sidebar Layout', 'rx-theme' ),
'rx_page_layout_section',
array(
'no-sidebar' => esc_html__( 'No Sidebar', 'rx-theme' ),
'left-sidebar' => esc_html__( 'Left Sidebar', 'rx-theme' ),
'right-sidebar' => esc_html__( 'Right Sidebar', 'rx-theme' ),
'full-width' => esc_html__( 'Full Width', 'rx-theme' ),
),
10
);
$add_range( 'page_content_width', esc_html__( 'Page Content Width', 'rx-theme' ), 'rx_page_layout_section', 600, 1400, 10, 20 );
$add_checkbox( 'page_featured_image', esc_html__( 'Show Page Featured Image', 'rx-theme' ), 'rx_page_layout_section', 30 );
/**
* Sidebar Layout.
*/
$add_range( 'sidebar_width', esc_html__( 'Sidebar Width', 'rx-theme' ), 'rx_sidebar_layout_section', 220, 520, 10, 10 );
$add_range( 'sidebar_gap', esc_html__( 'Sidebar Gap', 'rx-theme' ), 'rx_sidebar_layout_section', 0, 80, 2, 20 );
$add_checkbox( 'sticky_sidebar', esc_html__( 'Enable Sticky Sidebar', 'rx-theme' ), 'rx_sidebar_layout_section', 30 );
$add_select(
'mobile_sidebar_position',
esc_html__( 'Mobile Sidebar Position', 'rx-theme' ),
'rx_sidebar_layout_section',
array(
'before-content' => esc_html__( 'Before Content', 'rx-theme' ),
'after-content' => esc_html__( 'After Content', 'rx-theme' ),
'hidden' => esc_html__( 'Hidden on Mobile', 'rx-theme' ),
),
40
);
/**
* Footer Layout.
*/
$add_select(
'footer_layout',
esc_html__( 'Footer Widget Layout', 'rx-theme' ),
'rx_footer_layout_section',
array(
'disabled' => esc_html__( 'Disabled', 'rx-theme' ),
'one-column' => esc_html__( 'One Column', 'rx-theme' ),
'two-columns' => esc_html__( 'Two Columns', 'rx-theme' ),
'three-columns'=> esc_html__( 'Three Columns', 'rx-theme' ),
'four-columns' => esc_html__( 'Four Columns', 'rx-theme' ),
'five-columns' => esc_html__( 'Five Columns', 'rx-theme' ),
),
10
);
$add_select(
'footer_width',
esc_html__( 'Footer Width', 'rx-theme' ),
'rx_footer_layout_section',
array(
'contained' => esc_html__( 'Contained', 'rx-theme' ),
'full' => esc_html__( 'Full Width', 'rx-theme' ),
),
20
);
$add_checkbox( 'footer_widgets', esc_html__( 'Enable Footer Widgets', 'rx-theme' ), 'rx_footer_layout_section', 30 );
$add_select(
'footer_bottom_layout',
esc_html__( 'Footer Bottom Layout', 'rx-theme' ),
'rx_footer_layout_section',
array(
'one-column' => esc_html__( 'One Column', 'rx-theme' ),
'two-columns' => esc_html__( 'Two Columns', 'rx-theme' ),
'centered' => esc_html__( 'Centered', 'rx-theme' ),
'split' => esc_html__( 'Split', 'rx-theme' ),
),
40
);
$add_checkbox( 'back_to_top', esc_html__( 'Show Back to Top Button', 'rx-theme' ), 'rx_footer_layout_section', 50 );
/**
* Breadcrumbs.
*/
$add_checkbox( 'breadcrumbs', esc_html__( 'Enable Breadcrumbs', 'rx-theme' ), 'rx_breadcrumb_layout_section', 10 );
$add_select(
'breadcrumbs_position',
esc_html__( 'Breadcrumbs Position', 'rx-theme' ),
'rx_breadcrumb_layout_section',
array(
'before-content' => esc_html__( 'Before Content', 'rx-theme' ),
'after-header' => esc_html__( 'After Header', 'rx-theme' ),
'inside-title' => esc_html__( 'Inside Title Area', 'rx-theme' ),
),
20
);
$add_checkbox( 'breadcrumbs_on_home', esc_html__( 'Show Breadcrumbs on Homepage', 'rx-theme' ), 'rx_breadcrumb_layout_section', 30 );
/**
* Pagination.
*/
$add_select(
'pagination_type',
esc_html__( 'Pagination Type', 'rx-theme' ),
'rx_pagination_layout_section',
array(
'numbered' => esc_html__( 'Numbered', 'rx-theme' ),
'older-newer'=> esc_html__( 'Older / Newer', 'rx-theme' ),
'load-more' => esc_html__( 'Load More', 'rx-theme' ),
'infinite' => esc_html__( 'Infinite Scroll', 'rx-theme' ),
),
10
);
$add_checkbox( 'load_more_button', esc_html__( 'Enable Load More Button', 'rx-theme' ), 'rx_pagination_layout_section', 20 );
$add_checkbox( 'infinite_scroll', esc_html__( 'Enable Infinite Scroll Layout Support', 'rx-theme' ), 'rx_pagination_layout_section', 30 );
/**
* Shape / Radius.
*/
$add_range( 'image_radius', esc_html__( 'Image Border Radius', 'rx-theme' ), 'rx_shape_layout_section', 0, 60, 1, 10 );
$add_range( 'card_radius', esc_html__( 'Card Border Radius', 'rx-theme' ), 'rx_shape_layout_section', 0, 60, 1, 20 );
$add_range( 'button_radius', esc_html__( 'Button Border Radius', 'rx-theme' ), 'rx_shape_layout_section', 0, 60, 1, 30 );
$add_range( 'input_radius', esc_html__( 'Input Border Radius', 'rx-theme' ), 'rx_shape_layout_section', 0, 60, 1, 40 );
/**
* Responsive Layout.
*/
$add_range( 'mobile_breakpoint', esc_html__( 'Mobile Breakpoint', 'rx-theme' ), 'rx_responsive_layout_section', 480, 900, 1, 10 );
$add_range( 'tablet_breakpoint', esc_html__( 'Tablet Breakpoint', 'rx-theme' ), 'rx_responsive_layout_section', 768, 1199, 1, 20 );
$add_range( 'desktop_breakpoint', esc_html__( 'Desktop Breakpoint', 'rx-theme' ), 'rx_responsive_layout_section', 1024, 1600, 1, 30 );
$add_range( 'mobile_container_padding', esc_html__( 'Mobile Container Padding', 'rx-theme' ), 'rx_responsive_layout_section', 8, 40, 1, 40 );
$add_range( 'tablet_container_padding', esc_html__( 'Tablet Container Padding', 'rx-theme' ), 'rx_responsive_layout_section', 12, 60, 1, 50 );
$add_range( 'desktop_container_padding', esc_html__( 'Desktop Container Padding', 'rx-theme' ), 'rx_responsive_layout_section', 16, 80, 1, 60 );
/**
* Extra Layout Features.
*/
$add_checkbox( 'enable_scroll_animations', esc_html__( 'Enable Scroll Animation Layout Classes', 'rx-theme' ), 'rx_extra_layout_section', 10 );
$add_checkbox( 'enable_smooth_scroll', esc_html__( 'Enable Smooth Scroll', 'rx-theme' ), 'rx_extra_layout_section', 20 );
$add_checkbox( 'enable_lazy_layout_effects', esc_html__( 'Enable Lazy Layout Effects', 'rx-theme' ), 'rx_extra_layout_section', 30 );
$add_checkbox( 'print_friendly_layout', esc_html__( 'Enable Print Friendly Layout', 'rx-theme' ), 'rx_extra_layout_section', 40 );
$add_checkbox( 'accessibility_skip_layout', esc_html__( 'Enable Accessibility Skip Layout Support', 'rx-theme' ), 'rx_extra_layout_section', 50 );
$add_checkbox( 'reduce_motion_support', esc_html__( 'Enable Reduced Motion Support', 'rx-theme' ), 'rx_extra_layout_section', 60 );
}
}
add_action( 'customize_register', 'rx_customize_register_layout_options' );
/**
* Body classes based on layout options.
*/
if ( ! function_exists( 'rx_layout_body_classes' ) ) {
function rx_layout_body_classes( $classes ) {
$layout_map = array(
'site-layout' => 'site_layout',
'header-layout' => 'header_layout',
'header-width' => 'header_width',
'mobile-header' => 'mobile_header_layout',
'nav-layout' => 'nav_layout',
'nav-align' => 'nav_alignment',
'nav-dropdown' => 'nav_dropdown_style',
'archive-layout' => 'archive_layout',
'archive-cards' => 'archive_card_layout',
'single-layout' => 'single_layout',
'page-layout' => 'page_layout',
'mobile-sidebar' => 'mobile_sidebar_position',
'footer-layout' => 'footer_layout',
'footer-width' => 'footer_width',
'footer-bottom' => 'footer_bottom_layout',
'breadcrumbs-position' => 'breadcrumbs_position',
'pagination-type' => 'pagination_type',
);
foreach ( $layout_map as $class_prefix => $option_key ) {
$value = rx_get_layout_option( $option_key );
if ( $value ) {
$classes[] = sanitize_html_class( 'rx-' . $class_prefix . '-' . $value );
}
}
$boolean_classes = array(
'sticky_header' => 'rx-has-sticky-header',
'shrink_sticky_header' => 'rx-has-shrink-header',
'transparent_header' => 'rx-has-transparent-header',
'nav_sticky_on_scroll' => 'rx-has-sticky-nav',
'sticky_sidebar' => 'rx-has-sticky-sidebar',
'breadcrumbs' => 'rx-has-breadcrumbs',
'back_to_top' => 'rx-has-back-to-top',
'enable_scroll_animations' => 'rx-has-scroll-animations',
'enable_smooth_scroll' => 'rx-has-smooth-scroll',
'enable_lazy_layout_effects' => 'rx-has-lazy-layout-effects',
'print_friendly_layout' => 'rx-has-print-layout',
'accessibility_skip_layout' => 'rx-has-accessibility-layout',
'reduce_motion_support' => 'rx-has-reduce-motion-support',
);
foreach ( $boolean_classes as $option_key => $class_name ) {
if ( rx_get_layout_option( $option_key ) ) {
$classes[] = $class_name;
}
}
if ( is_singular( 'post' ) ) {
$classes[] = 'rx-view-single-post';
} elseif ( is_page() ) {
$classes[] = 'rx-view-page';
} elseif ( is_archive() || is_home() || is_search() ) {
$classes[] = 'rx-view-archive';
}
return array_unique( $classes );
}
}
add_filter( 'body_class', 'rx_layout_body_classes' );
/**
* Get the current layout based on page type.
*/
if ( ! function_exists( 'rx_get_current_sidebar_layout' ) ) {
function rx_get_current_sidebar_layout() {
if ( is_singular( 'post' ) ) {
return rx_get_layout_option( 'single_layout', 'right-sidebar' );
}
if ( is_page() ) {
return rx_get_layout_option( 'page_layout', 'no-sidebar' );
}
if ( is_archive() || is_home() || is_search() ) {
return rx_get_layout_option( 'archive_layout', 'right-sidebar' );
}
return rx_get_layout_option( 'site_layout', 'wide' );
}
}
/**
* Check whether current view has sidebar.
*/
if ( ! function_exists( 'rx_has_sidebar_layout' ) ) {
function rx_has_sidebar_layout() {
$layout = rx_get_current_sidebar_layout();
return in_array( $layout, array( 'left-sidebar', 'right-sidebar', 'both-sidebar' ), true );
}
}
/**
* Check whether left sidebar should show.
*/
if ( ! function_exists( 'rx_has_left_sidebar' ) ) {
function rx_has_left_sidebar() {
$layout = rx_get_current_sidebar_layout();
return in_array( $layout, array( 'left-sidebar', 'both-sidebar' ), true );
}
}
/**
* Check whether right sidebar should show.
*/
if ( ! function_exists( 'rx_has_right_sidebar' ) ) {
function rx_has_right_sidebar() {
$layout = rx_get_current_sidebar_layout();
return in_array( $layout, array( 'right-sidebar', 'both-sidebar' ), true );
}
}
/**
* Get archive columns.
*/
if ( ! function_exists( 'rx_get_archive_columns' ) ) {
function rx_get_archive_columns( $device = 'desktop' ) {
$device = sanitize_key( $device );
if ( ! in_array( $device, array( 'desktop', 'tablet', 'mobile' ), true ) ) {
$device = 'desktop';
}
return absint( rx_get_layout_option( 'archive_columns_' . $device, 'desktop' === $device ? 3 : 1 ) );
}
}
/**
* Dynamic layout CSS.
*/
if ( ! function_exists( 'rx_get_layout_dynamic_css' ) ) {
function rx_get_layout_dynamic_css() {
$container_width = absint( rx_get_layout_option( 'container_width', 1200 ) );
$content_width = absint( rx_get_layout_option( 'content_width', 760 ) );
$boxed_width = absint( rx_get_layout_option( 'boxed_width', 1280 ) );
$main_gap = absint( rx_get_layout_option( 'main_gap', 32 ) );
$section_spacing = absint( rx_get_layout_option( 'section_spacing', 48 ) );
$single_content_width = absint( rx_get_layout_option( 'single_content_width', 780 ) );
$page_content_width = absint( rx_get_layout_option( 'page_content_width', 900 ) );
$sidebar_width = absint( rx_get_layout_option( 'sidebar_width', 320 ) );
$sidebar_gap = absint( rx_get_layout_option( 'sidebar_gap', 40 ) );
$archive_columns_desktop = absint( rx_get_layout_option( 'archive_columns_desktop', 3 ) );
$archive_columns_tablet = absint( rx_get_layout_option( 'archive_columns_tablet', 2 ) );
$archive_columns_mobile = absint( rx_get_layout_option( 'archive_columns_mobile', 1 ) );
$image_radius = absint( rx_get_layout_option( 'image_radius', 12 ) );
$card_radius = absint( rx_get_layout_option( 'card_radius', 16 ) );
$button_radius = absint( rx_get_layout_option( 'button_radius', 8 ) );
$input_radius = absint( rx_get_layout_option( 'input_radius', 8 ) );
$mobile_breakpoint = absint( rx_get_layout_option( 'mobile_breakpoint', 768 ) );
$tablet_breakpoint = absint( rx_get_layout_option( 'tablet_breakpoint', 1024 ) );
$mobile_padding = absint( rx_get_layout_option( 'mobile_container_padding', 16 ) );
$tablet_padding = absint( rx_get_layout_option( 'tablet_container_padding', 24 ) );
$desktop_padding = absint( rx_get_layout_option( 'desktop_container_padding', 32 ) );
$css = "
:root {
--rx-container-width: {$container_width}px;
--rx-content-width: {$content_width}px;
--rx-boxed-width: {$boxed_width}px;
--rx-main-gap: {$main_gap}px;
--rx-section-spacing: {$section_spacing}px;
--rx-single-content-width: {$single_content_width}px;
--rx-page-content-width: {$page_content_width}px;
--rx-sidebar-width: {$sidebar_width}px;
--rx-sidebar-gap: {$sidebar_gap}px;
--rx-image-radius: {$image_radius}px;
--rx-card-radius: {$card_radius}px;
--rx-button-radius: {$button_radius}px;
--rx-input-radius: {$input_radius}px;
--rx-mobile-padding: {$mobile_padding}px;
--rx-tablet-padding: {$tablet_padding}px;
--rx-desktop-padding: {$desktop_padding}px;
}
html.rx-has-smooth-scroll,
.rx-has-smooth-scroll {
scroll-behavior: smooth;
}
.rx-container,
.site-container,
.site-main,
.rx-site-container {
width: min(100% - calc(var(--rx-desktop-padding) * 2), var(--rx-container-width));
margin-inline: auto;
}
.rx-site-layout-full-width .rx-container,
.rx-site-layout-full-width .site-container {
width: 100%;
max-width: none;
padding-inline: var(--rx-desktop-padding);
}
.rx-site-layout-boxed .site,
.rx-site-layout-boxed .rx-site,
.rx-site-layout-boxed #page {
width: min(100%, var(--rx-boxed-width));
margin-inline: auto;
}
.rx-site-layout-framed body,
.rx-site-layout-framed #page {
margin: 20px;
}
.rx-content-area,
.content-area {
max-width: var(--rx-content-width);
}
.rx-view-single-post .entry-content,
.rx-view-single-post .rx-entry-content {
max-width: var(--rx-single-content-width);
margin-inline: auto;
}
.rx-view-page .entry-content,
.rx-view-page .rx-entry-content {
max-width: var(--rx-page-content-width);
margin-inline: auto;
}
.rx-layout,
.rx-main-layout,
.site-content {
display: grid;
gap: var(--rx-main-gap);
}
.rx-archive-layout-no-sidebar .site-content,
.rx-single-layout-no-sidebar .site-content,
.rx-page-layout-no-sidebar .site-content {
grid-template-columns: minmax(0, 1fr);
}
.rx-archive-layout-right-sidebar .site-content,
.rx-single-layout-right-sidebar .site-content,
.rx-page-layout-right-sidebar .site-content {
grid-template-columns: minmax(0, 1fr) var(--rx-sidebar-width);
column-gap: var(--rx-sidebar-gap);
}
.rx-archive-layout-left-sidebar .site-content,
.rx-single-layout-left-sidebar .site-content,
.rx-page-layout-left-sidebar .site-content {
grid-template-columns: var(--rx-sidebar-width) minmax(0, 1fr);
column-gap: var(--rx-sidebar-gap);
}
.rx-archive-layout-both-sidebar .site-content,
.rx-single-layout-both-sidebar .site-content {
grid-template-columns: var(--rx-sidebar-width) minmax(0, 1fr) var(--rx-sidebar-width);
column-gap: var(--rx-sidebar-gap);
}
.rx-has-sticky-sidebar .widget-area,
.rx-has-sticky-sidebar .sidebar,
.rx-has-sticky-sidebar .rx-sidebar {
position: sticky;
top: 96px;
align-self: start;
}
.rx-has-sticky-header .site-header,
.rx-has-sticky-header .rx-header {
position: sticky;
top: 0;
z-index: 999;
}
.rx-has-transparent-header .site-header,
.rx-has-transparent-header .rx-header {
position: absolute;
left: 0;
right: 0;
top: 0;
background: transparent;
z-index: 999;
}
.rx-header-width-full .rx-header-inner,
.rx-header-width-full .site-header-inner {
width: 100%;
max-width: none;
}
.rx-header-width-contained .rx-header-inner,
.rx-header-width-contained .site-header-inner {
width: min(100% - calc(var(--rx-desktop-padding) * 2), var(--rx-container-width));
margin-inline: auto;
}
.rx-header-layout-horizontal .rx-header-inner,
.rx-header-layout-horizontal .site-header-inner {
display: flex;
align-items: center;
justify-content: space-between;
gap: 24px;
}
.rx-header-layout-centered-logo .site-branding,
.rx-header-layout-centered-logo .rx-site-branding {
text-align: center;
margin-inline: auto;
}
.rx-header-layout-minimal .site-header,
.rx-header-layout-minimal .rx-header {
box-shadow: none;
border-bottom: 1px solid currentColor;
}
.rx-nav-align-left .main-navigation ul,
.rx-nav-align-left .rx-main-navigation ul {
justify-content: flex-start;
}
.rx-nav-align-center .main-navigation ul,
.rx-nav-align-center .rx-main-navigation ul {
justify-content: center;
}
.rx-nav-align-right .main-navigation ul,
.rx-nav-align-right .rx-main-navigation ul {
justify-content: flex-end;
}
.rx-nav-layout-inline .main-navigation ul,
.rx-nav-layout-inline .rx-main-navigation ul {
display: flex;
align-items: center;
gap: 20px;
}
.rx-nav-layout-justified .main-navigation ul,
.rx-nav-layout-justified .rx-main-navigation ul {
display: flex;
justify-content: space-between;
width: 100%;
}
.rx-nav-dropdown-shadow .main-navigation ul ul,
.rx-nav-dropdown-shadow .rx-main-navigation ul ul {
box-shadow: 0 16px 40px rgba(0, 0, 0, 0.12);
}
.rx-nav-dropdown-bordered .main-navigation ul ul,
.rx-nav-dropdown-bordered .rx-main-navigation ul ul {
border: 1px solid rgba(0, 0, 0, 0.1);
}
.rx-nav-dropdown-glass .main-navigation ul ul,
.rx-nav-dropdown-glass .rx-main-navigation ul ul {
backdrop-filter: blur(16px);
background: rgba(255, 255, 255, 0.85);
}
.rx-archive-cards-grid .rx-posts,
.rx-archive-cards-grid .posts,
.rx-archive-cards-grid .blog-posts {
display: grid;
grid-template-columns: repeat({$archive_columns_desktop}, minmax(0, 1fr));
gap: var(--rx-main-gap);
}
.rx-archive-cards-list .rx-posts,
.rx-archive-cards-list .posts,
.rx-archive-cards-list .blog-posts {
display: grid;
grid-template-columns: 1fr;
gap: var(--rx-main-gap);
}
.rx-archive-cards-masonry .rx-posts,
.rx-archive-cards-masonry .posts,
.rx-archive-cards-masonry .blog-posts {
column-count: {$archive_columns_desktop};
column-gap: var(--rx-main-gap);
}
.rx-archive-cards-masonry article,
.rx-archive-cards-masonry .post-card,
.rx-archive-cards-masonry .rx-post-card {
break-inside: avoid;
margin-bottom: var(--rx-main-gap);
}
.rx-archive-cards-magazine .rx-posts,
.rx-archive-cards-magazine .posts,
.rx-archive-cards-magazine .blog-posts {
display: grid;
grid-template-columns: 2fr 1fr 1fr;
gap: var(--rx-main-gap);
}
.rx-archive-cards-magazine .rx-posts article:first-child,
.rx-archive-cards-magazine .posts article:first-child,
.rx-archive-cards-magazine .blog-posts article:first-child {
grid-row: span 2;
}
img,
.wp-post-image,
.rx-featured-image img {
border-radius: var(--rx-image-radius);
}
.card,
.post-card,
.rx-card,
.rx-post-card,
.widget,
.comments-area {
border-radius: var(--rx-card-radius);
}
button,
.button,
.wp-block-button__link,
input[type='submit'],
.rx-button {
border-radius: var(--rx-button-radius);
}
input,
textarea,
select,
.rx-input {
border-radius: var(--rx-input-radius);
}
.rx-section,
.site-section,
.entry-header,
.entry-content,
.entry-footer {
margin-block-end: var(--rx-section-spacing);
}
.rx-footer-width-contained .site-footer-inner,
.rx-footer-width-contained .rx-footer-inner {
width: min(100% - calc(var(--rx-desktop-padding) * 2), var(--rx-container-width));
margin-inline: auto;
}
.rx-footer-width-full .site-footer-inner,
.rx-footer-width-full .rx-footer-inner {
width: 100%;
max-width: none;
padding-inline: var(--rx-desktop-padding);
}
.rx-footer-layout-one-column .footer-widgets,
.rx-footer-layout-one-column .rx-footer-widgets {
display: grid;
grid-template-columns: 1fr;
gap: var(--rx-main-gap);
}
.rx-footer-layout-two-columns .footer-widgets,
.rx-footer-layout-two-columns .rx-footer-widgets {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: var(--rx-main-gap);
}
.rx-footer-layout-three-columns .footer-widgets,
.rx-footer-layout-three-columns .rx-footer-widgets {
display: grid;
grid-template-columns: repeat(3, minmax(0, 1fr));
gap: var(--rx-main-gap);
}
.rx-footer-layout-four-columns .footer-widgets,
.rx-footer-layout-four-columns .rx-footer-widgets {
display: grid;
grid-template-columns: repeat(4, minmax(0, 1fr));
gap: var(--rx-main-gap);
}
.rx-footer-layout-five-columns .footer-widgets,
.rx-footer-layout-five-columns .rx-footer-widgets {
display: grid;
grid-template-columns: repeat(5, minmax(0, 1fr));
gap: var(--rx-main-gap);
}
.rx-footer-bottom-two-columns .site-info,
.rx-footer-bottom-two-columns .rx-footer-bottom {
display: flex;
justify-content: space-between;
align-items: center;
gap: 20px;
}
.rx-footer-bottom-centered .site-info,
.rx-footer-bottom-centered .rx-footer-bottom {
text-align: center;
justify-content: center;
}
.rx-has-back-to-top .rx-back-to-top {
position: fixed;
right: 20px;
bottom: 20px;
z-index: 900;
}
@media (max-width: {$tablet_breakpoint}px) {
.rx-container,
.site-container,
.site-main,
.rx-site-container {
width: min(100% - calc(var(--rx-tablet-padding) * 2), var(--rx-container-width));
}
.rx-archive-cards-grid .rx-posts,
.rx-archive-cards-grid .posts,
.rx-archive-cards-grid .blog-posts {
grid-template-columns: repeat({$archive_columns_tablet}, minmax(0, 1fr));
}
.rx-archive-cards-masonry .rx-posts,
.rx-archive-cards-masonry .posts,
.rx-archive-cards-masonry .blog-posts {
column-count: {$archive_columns_tablet};
}
.rx-archive-cards-magazine .rx-posts,
.rx-archive-cards-magazine .posts,
.rx-archive-cards-magazine .blog-posts {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
.rx-footer-layout-four-columns .footer-widgets,
.rx-footer-layout-four-columns .rx-footer-widgets,
.rx-footer-layout-five-columns .footer-widgets,
.rx-footer-layout-five-columns .rx-footer-widgets {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
}
@media (max-width: {$mobile_breakpoint}px) {
.rx-container,
.site-container,
.site-main,
.rx-site-container {
width: min(100% - calc(var(--rx-mobile-padding) * 2), var(--rx-container-width));
}
.site-content,
.rx-main-layout,
.rx-layout {
grid-template-columns: 1fr !important;
}
.rx-mobile-sidebar-before-content .widget-area,
.rx-mobile-sidebar-before-content .sidebar,
.rx-mobile-sidebar-before-content .rx-sidebar {
order: -1;
}
.rx-mobile-sidebar-after-content .widget-area,
.rx-mobile-sidebar-after-content .sidebar,
.rx-mobile-sidebar-after-content .rx-sidebar {
order: 10;
}
.rx-mobile-sidebar-hidden .widget-area,
.rx-mobile-sidebar-hidden .sidebar,
.rx-mobile-sidebar-hidden .rx-sidebar {
display: none;
}
.rx-archive-cards-grid .rx-posts,
.rx-archive-cards-grid .posts,
.rx-archive-cards-grid .blog-posts {
grid-template-columns: repeat({$archive_columns_mobile}, minmax(0, 1fr));
}
.rx-archive-cards-masonry .rx-posts,
.rx-archive-cards-masonry .posts,
.rx-archive-cards-masonry .blog-posts {
column-count: {$archive_columns_mobile};
}
.rx-archive-cards-magazine .rx-posts,
.rx-archive-cards-magazine .posts,
.rx-archive-cards-magazine .blog-posts {
grid-template-columns: 1fr;
}
.rx-header-layout-horizontal .rx-header-inner,
.rx-header-layout-horizontal .site-header-inner {
flex-wrap: wrap;
}
.rx-mobile-header-stacked .rx-header-inner,
.rx-mobile-header-stacked .site-header-inner {
flex-direction: column;
text-align: center;
}
.rx-footer-layout-two-columns .footer-widgets,
.rx-footer-layout-two-columns .rx-footer-widgets,
.rx-footer-layout-three-columns .footer-widgets,
.rx-footer-layout-three-columns .rx-footer-widgets,
.rx-footer-layout-four-columns .footer-widgets,
.rx-footer-layout-four-columns .rx-footer-widgets,
.rx-footer-layout-five-columns .footer-widgets,
.rx-footer-layout-five-columns .rx-footer-widgets {
grid-template-columns: 1fr;
}
.rx-footer-bottom-two-columns .site-info,
.rx-footer-bottom-two-columns .rx-footer-bottom {
flex-direction: column;
text-align: center;
}
}
@media print {
.rx-has-print-layout .site-header,
.rx-has-print-layout .site-footer,
.rx-has-print-layout .widget-area,
.rx-has-print-layout .sidebar,
.rx-has-print-layout .rx-sidebar,
.rx-has-print-layout .comments-area,
.rx-has-print-layout .rx-back-to-top,
.rx-has-print-layout .main-navigation {
display: none !important;
}
.rx-has-print-layout .site-content,
.rx-has-print-layout .entry-content {
display: block !important;
max-width: 100% !important;
width: 100% !important;
}
}
@media (prefers-reduced-motion: reduce) {
.rx-has-reduce-motion-support *,
.rx-has-reduce-motion-support *::before,
.rx-has-reduce-motion-support *::after {
animation-duration: 0.001ms !important;
animation-iteration-count: 1 !important;
scroll-behavior: auto !important;
transition-duration: 0.001ms !important;
}
}
";
return trim( $css );
}
}
/**
* Print dynamic CSS in the document head.
*/
if ( ! function_exists( 'rx_print_layout_dynamic_css' ) ) {
function rx_print_layout_dynamic_css() {
$css = rx_get_layout_dynamic_css();
if ( empty( $css ) ) {
return;
}
echo "\n<style id='rx-layout-dynamic-css'>\n";
echo wp_strip_all_tags( $css );
echo "\n</style>\n";
}
}
add_action( 'wp_head', 'rx_print_layout_dynamic_css', 20 );
/**
* Archive excerpt length from Customizer.
*/
if ( ! function_exists( 'rx_layout_excerpt_length' ) ) {
function rx_layout_excerpt_length( $length ) {
if ( is_admin() ) {
return $length;
}
if ( is_home() || is_archive() || is_search() ) {
return absint( rx_get_layout_option( 'archive_excerpt_length', 28 ) );
}
return $length;
}
}
add_filter( 'excerpt_length', 'rx_layout_excerpt_length', 20 );
/**
* Determine whether archive featured image is enabled.
*/
if ( ! function_exists( 'rx_show_archive_featured_image' ) ) {
function rx_show_archive_featured_image() {
return (bool) rx_get_layout_option( 'archive_featured_image', true );
}
}
/**
* Determine whether archive meta is enabled.
*/
if ( ! function_exists( 'rx_show_archive_meta' ) ) {
function rx_show_archive_meta() {
return (bool) rx_get_layout_option( 'archive_meta', true );
}
}
/**
* Determine whether single post featured image is enabled.
*/
if ( ! function_exists( 'rx_show_single_featured_image' ) ) {
function rx_show_single_featured_image() {
return (bool) rx_get_layout_option( 'single_featured_image', true );
}
}
/**
* Determine whether single meta is enabled.
*/
if ( ! function_exists( 'rx_show_single_meta' ) ) {
function rx_show_single_meta() {
return (bool) rx_get_layout_option( 'single_meta', true );
}
}
/**
* Determine whether page featured image is enabled.
*/
if ( ! function_exists( 'rx_show_page_featured_image' ) ) {
function rx_show_page_featured_image() {
return (bool) rx_get_layout_option( 'page_featured_image', false );
}
}
/**
* Determine whether breadcrumbs should display.
*/
if ( ! function_exists( 'rx_should_show_breadcrumbs' ) ) {
function rx_should_show_breadcrumbs() {
if ( ! rx_get_layout_option( 'breadcrumbs', true ) ) {
return false;
}
if ( is_front_page() && ! rx_get_layout_option( 'breadcrumbs_on_home', false ) ) {
return false;
}
return true;
}
}
/**
* Simple breadcrumb output helper.
*/
if ( ! function_exists( 'rx_layout_breadcrumbs' ) ) {
function rx_layout_breadcrumbs() {
if ( ! rx_should_show_breadcrumbs() ) {
return;
}
echo '<nav class="rx-breadcrumbs" aria-label="' . esc_attr__( 'Breadcrumbs', 'rx-theme' ) . '">';
echo '<a href="' . esc_url( home_url( '/' ) ) . '">' . esc_html__( 'Home', 'rx-theme' ) . '</a>';
if ( is_category() || is_single() ) {
$category = get_the_category();
if ( ! empty( $category ) ) {
$first_category = $category[0];
echo '<span class="rx-breadcrumb-separator"> / </span>';
echo '<a href="' . esc_url( get_category_link( $first_category->term_id ) ) . '">' . esc_html( $first_category->name ) . '</a>';
}
if ( is_single() ) {
echo '<span class="rx-breadcrumb-separator"> / </span>';
echo '<span aria-current="page">' . esc_html( get_the_title() ) . '</span>';
}
} elseif ( is_page() ) {
global $post;
if ( $post && $post->post_parent ) {
$parents = array_reverse( get_post_ancestors( $post->ID ) );
foreach ( $parents as $parent_id ) {
echo '<span class="rx-breadcrumb-separator"> / </span>';
echo '<a href="' . esc_url( get_permalink( $parent_id ) ) . '">' . esc_html( get_the_title( $parent_id ) ) . '</a>';
}
}
echo '<span class="rx-breadcrumb-separator"> / </span>';
echo '<span aria-current="page">' . esc_html( get_the_title() ) . '</span>';
} elseif ( is_search() ) {
echo '<span class="rx-breadcrumb-separator"> / </span>';
echo '<span aria-current="page">' . esc_html__( 'Search Results', 'rx-theme' ) . '</span>';
} elseif ( is_404() ) {
echo '<span class="rx-breadcrumb-separator"> / </span>';
echo '<span aria-current="page">' . esc_html__( '404 Not Found', 'rx-theme' ) . '</span>';
} elseif ( is_archive() ) {
echo '<span class="rx-breadcrumb-separator"> / </span>';
echo '<span aria-current="page">' . esc_html( get_the_archive_title() ) . '</span>';
}
echo '</nav>';
}
}
/**
* Back to top button.
*/
if ( ! function_exists( 'rx_layout_back_to_top_button' ) ) {
function rx_layout_back_to_top_button() {
if ( ! rx_get_layout_option( 'back_to_top', true ) ) {
return;
}
echo '<button type="button" class="rx-back-to-top" aria-label="' . esc_attr__( 'Back to top', 'rx-theme' ) . '">';
echo esc_html__( '↑', 'rx-theme' );
echo '</button>';
}
}
add_action( 'wp_footer', 'rx_layout_back_to_top_button', 30 );
/**
* Small JS for back to top and shrink header class.
*/
if ( ! function_exists( 'rx_layout_inline_script' ) ) {
function rx_layout_inline_script() {
$back_to_top = rx_get_layout_option( 'back_to_top', true );
$shrink_sticky_header = rx_get_layout_option( 'shrink_sticky_header', true );
if ( ! $back_to_top && ! $shrink_sticky_header ) {
return;
}
?>
<script id="rx-layout-script">
(function () {
'use strict';
var root = document.documentElement;
var body = document.body;
function rxOnScroll() {
var scrolled = window.scrollY || window.pageYOffset;
if (<?php echo $shrink_sticky_header ? 'true' : 'false'; ?>) {
if (scrolled > 80) {
body.classList.add('rx-header-shrunk');
} else {
body.classList.remove('rx-header-shrunk');
}
}
var backToTop = document.querySelector('.rx-back-to-top');
if (backToTop) {
if (scrolled > 400) {
backToTop.classList.add('is-visible');
} else {
backToTop.classList.remove('is-visible');
}
}
}
document.addEventListener('scroll', rxOnScroll, { passive: true });
document.addEventListener('click', function (event) {
var button = event.target.closest('.rx-back-to-top');
if (!button) {
return;
}
event.preventDefault();
window.scrollTo({
top: 0,
behavior: root.classList.contains('rx-has-smooth-scroll') || body.classList.contains('rx-has-smooth-scroll') ? 'smooth' : 'auto'
});
});
rxOnScroll();
})();
</script>
<?php
}
}
add_action( 'wp_footer', 'rx_layout_inline_script', 40 );
/**
* Add layout classes to post cards.
*/
if ( ! function_exists( 'rx_post_card_classes' ) ) {
function rx_post_card_classes( $extra = array() ) {
$classes = array(
'rx-post-card',
'rx-card',
'rx-card-layout-' . sanitize_html_class( rx_get_layout_option( 'archive_card_layout', 'grid' ) ),
);
if ( rx_show_archive_featured_image() ) {
$classes[] = 'has-featured-image-enabled';
} else {
$classes[] = 'has-featured-image-disabled';
}
if ( is_array( $extra ) ) {
$classes = array_merge( $classes, $extra );
}
return implode( ' ', array_map( 'sanitize_html_class', array_unique( $classes ) ) );
}
}
/**
* Pagination helper.
*/
if ( ! function_exists( 'rx_layout_pagination' ) ) {
function rx_layout_pagination() {
$type = rx_get_layout_option( 'pagination_type', 'numbered' );
if ( 'older-newer' === $type ) {
the_posts_navigation(
array(
'prev_text' => esc_html__( 'Older Posts', 'rx-theme' ),
'next_text' => esc_html__( 'Newer Posts', 'rx-theme' ),
)
);
return;
}
if ( 'load-more' === $type || 'infinite' === $type ) {
echo '<div class="rx-load-more-wrap">';
echo '<button type="button" class="rx-load-more-button">';
echo esc_html__( 'Load More', 'rx-theme' );
echo '</button>';
echo '</div>';
return;
}
the_posts_pagination(
array(
'mid_size' => 2,
'prev_text' => esc_html__( 'Previous', 'rx-theme' ),
'next_text' => esc_html__( 'Next', 'rx-theme' ),
)
);
}
}
/**
* Footer column count helper.
*/
if ( ! function_exists( 'rx_get_footer_columns' ) ) {
function rx_get_footer_columns() {
$layout = rx_get_layout_option( 'footer_layout', 'four-columns' );
$map = array(
'disabled' => 0,
'one-column' => 1,
'two-columns' => 2,
'three-columns' => 3,
'four-columns' => 4,
'five-columns' => 5,
);
return isset( $map[ $layout ] ) ? absint( $map[ $layout ] ) : 4;
}
}
/**
* Register footer sidebars based on footer layout.
*/
if ( ! function_exists( 'rx_register_layout_footer_sidebars' ) ) {
function rx_register_layout_footer_sidebars() {
if ( ! rx_get_layout_option( 'footer_widgets', true ) ) {
return;
}
$columns = rx_get_footer_columns();
if ( $columns < 1 ) {
return;
}
for ( $i = 1; $i <= $columns; $i++ ) {
register_sidebar(
array(
'name' => sprintf( esc_html__( 'Footer Column %d', 'rx-theme' ), $i ),
'id' => 'footer-' . $i,
'description' => sprintf( esc_html__( 'Widgets for footer column %d.', 'rx-theme' ), $i ),
'before_widget' => '<section id="%1$s" class="widget %2$s">',
'after_widget' => '</section>',
'before_title' => '<h2 class="widget-title">',
'after_title' => '</h2>',
)
);
}
}
}
add_action( 'widgets_init', 'rx_register_layout_footer_sidebars', 20 );
/**
* Skip link helper.
*/
if ( ! function_exists( 'rx_layout_skip_link' ) ) {
function rx_layout_skip_link() {
if ( ! rx_get_layout_option( 'accessibility_skip_layout', true ) ) {
return;
}
echo '<a class="skip-link screen-reader-text" href="#primary">';
echo esc_html__( 'Skip to content', 'rx-theme' );
echo '</a>';
}
}
add_action( 'wp_body_open', 'rx_layout_skip_link', 5 );
/**
* Add custom wrapper opening.
*/
if ( ! function_exists( 'rx_layout_main_open' ) ) {
function rx_layout_main_open() {
echo '<main id="primary" class="site-main rx-site-main">';
}
}
/**
* Add custom wrapper closing.
*/
if ( ! function_exists( 'rx_layout_main_close' ) ) {
function rx_layout_main_close() {
echo '</main>';
}
}
/**
* Helper for template files.
*
* Usage:
* echo esc_attr( rx_get_layout_container_class() );
*/
if ( ! function_exists( 'rx_get_layout_container_class' ) ) {
function rx_get_layout_container_class( $extra = array() ) {
$classes = array(
'rx-container',
'rx-container-' . sanitize_html_class( rx_get_layout_option( 'site_layout', 'wide' ) ),
);
if ( is_array( $extra ) ) {
$classes = array_merge( $classes, $extra );
}
return implode( ' ', array_map( 'sanitize_html_class', array_unique( $classes ) ) );
}
}
/**
* Helper for main content layout class.
*
* Usage:
* echo esc_attr( rx_get_main_layout_class() );
*/
if ( ! function_exists( 'rx_get_main_layout_class' ) ) {
function rx_get_main_layout_class( $extra = array() ) {
$layout = rx_get_current_sidebar_layout();
$classes = array(
'rx-main-layout',
'rx-layout-' . sanitize_html_class( $layout ),
);
if ( rx_has_sidebar_layout() ) {
$classes[] = 'rx-has-sidebar';
} else {
$classes[] = 'rx-no-sidebar';
}
if ( is_array( $extra ) ) {
$classes = array_merge( $classes, $extra );
}
return implode( ' ', array_map( 'sanitize_html_class', array_unique( $classes ) ) );
}
}
/**
* Template helper: should show related posts.
*/
if ( ! function_exists( 'rx_should_show_related_posts' ) ) {
function rx_should_show_related_posts() {
return is_singular( 'post' ) && (bool) rx_get_layout_option( 'single_related_posts', true );
}
}
/**
* Template helper: should show author box.
*/
if ( ! function_exists( 'rx_should_show_author_box' ) ) {
function rx_should_show_author_box() {
return is_singular( 'post' ) && (bool) rx_get_layout_option( 'single_author_box', true );
}
}
/**
* Template helper: should show post navigation.
*/
if ( ! function_exists( 'rx_should_show_post_navigation' ) ) {
function rx_should_show_post_navigation() {
return is_singular( 'post' ) && (bool) rx_get_layout_option( 'single_post_nav', true );
}
}
/**
* Disable archive read more if option disabled.
*/
if ( ! function_exists( 'rx_archive_read_more_text' ) ) {
function rx_archive_read_more_text( $more ) {
if ( is_admin() ) {
return $more;
}
if ( is_home() || is_archive() || is_search() ) {
if ( ! rx_get_layout_option( 'archive_read_more', true ) ) {
return '';
}
}
return $more;
}
}
add_filter( 'excerpt_more', 'rx_archive_read_more_text', 20 );
/**
* Add layout data attributes to HTML tag.
*/
if ( ! function_exists( 'rx_layout_language_attributes' ) ) {
function rx_layout_language_attributes( $output ) {
$site_layout = esc_attr( rx_get_layout_option( 'site_layout', 'wide' ) );
$header = esc_attr( rx_get_layout_option( 'header_layout', 'horizontal' ) );
$output .= ' data-rx-layout="' . $site_layout . '"';
$output .= ' data-rx-header="' . $header . '"';
return $output;
}
}
add_filter( 'language_attributes', 'rx_layout_language_attributes' );Now include it in your functions.php:
require_once get_template_directory() . '/inc/options/layout-options.php';Example use in your template:
<div class="<?php echo esc_attr( rx_get_layout_container_class() ); ?>">
<div class="<?php echo esc_attr( rx_get_main_layout_class() ); ?>">
<?php if ( rx_has_left_sidebar() ) : ?>
<?php get_sidebar( 'left' ); ?>
<?php endif; ?>
<main id="primary" class="site-main">
<?php
if ( function_exists( 'rx_layout_breadcrumbs' ) ) {
rx_layout_breadcrumbs();
}
?>
</main>
<?php if ( rx_has_right_sidebar() ) : ?>
<?php get_sidebar(); ?>
<?php endif; ?>
</div>
</div>This file gives your RX theme a strong layout system with Customizer controls, frontend classes, helper functions, dynamic CSS, breadcrumbs, pagination helper, sidebar logic, footer widget logic, sticky layout support, mobile layout support, print layout support, and accessibility skip-link support.