diff --git a/src/assets/js/customizer/base-controls.js b/src/assets/js/customizer/base-controls.js index dc065ea50..4621986fa 100644 --- a/src/assets/js/customizer/base-controls.js +++ b/src/assets/js/customizer/base-controls.js @@ -4,6 +4,7 @@ import bgtfwWidgetsSection from './controls/bgtfw-widgets-section'; import BlogPagePanelExpand from './design/blog/blog-page/panel-expand.js'; import BlogPostsPanelExpand from './design/blog/posts/panel-expand.js'; import HomepageSectionExpand from './design/homepage/section-expand.js'; +import WoocommerceSectionExpand from './design/woocommerce/section-expand.js' import { Control as GenericControls } from './generic/control.js'; import { Required } from './required.js'; import SectionExtendTitle from './menus/extend-title'; @@ -36,6 +37,7 @@ WidgetSectionUpdate(); new BlogPagePanelExpand(); new BlogPostsPanelExpand(); new HomepageSectionExpand(); + new WoocommerceSectionExpand(); new SectionExtendTitle(); new GenericControls().init(); new HamburgerControlToggle(); diff --git a/src/assets/js/customizer/design/woocommerce/section-expand.js b/src/assets/js/customizer/design/woocommerce/section-expand.js new file mode 100644 index 000000000..16142c814 --- /dev/null +++ b/src/assets/js/customizer/design/woocommerce/section-expand.js @@ -0,0 +1,42 @@ +/* esversion: 6 */ +import ExpandSection from '../../expand/section'; + +const api = wp.customize; + +/** + * This class is responsible for setting the URL to go to, and + * the sections's ID when the Homepage section is expanded. + * + * @since 2.0.0 + */ +export class WoocommerceSectionExpand extends ExpandSection { + + /** + * Constructor + * + * @since SINCEVERSION + * + * @param {String} typeId ID of the section to add expand and collapse bindings. + * @param {String} url URL the user should be directed to on expanded state. + */ + constructor( { typeId = 'bgtfw_layout_woocommerce' } = {} ) { + super( ...arguments ); + this.typeId = typeId; + $( () => this.setUrl() ); + _.extend( this, ...arguments ); + } + + /** + * Set the URL the previewer should go to on the expanded state. + * + * This URL is provided in core wp.customize for the homepage. + * + * @return {String} this.url The URL for the previewer. + */ + setUrl() { + this.url = BOLDGRID.CUSTOMIZER.data.design.woocommerce.shopUrl; + return this.url; + } +} + +export default WoocommerceSectionExpand; diff --git a/src/assets/scss/customizer/controls/icons/_panel-main.scss b/src/assets/scss/customizer/controls/icons/_panel-main.scss index 3ca8ccb0b..c4466c3da 100644 --- a/src/assets/scss/customizer/controls/icons/_panel-main.scss +++ b/src/assets/scss/customizer/controls/icons/_panel-main.scss @@ -52,6 +52,20 @@ ul.customize-pane-parent > li { } } +#accordion-section-bgtfw_layout_woocommerce { + .accordion-section-title:before { + font-family: 'WooCommerce'; + content: '\e03d'; + } +} + +#sub-accordion-section-bgtfw_layout_woocommerce { + div.bgtfw-section-title:before { + font-family: 'WooCommerce'; + content: '\e03d'; + } +} + // Static Front Page (Homepage) Section. #accordion-section-static_front_page > h3:before { content: "\f102"; diff --git a/src/includes/class-boldgrid-framework-api.php b/src/includes/class-boldgrid-framework-api.php index c4d6afb7a..7703c8aa2 100644 --- a/src/includes/class-boldgrid-framework-api.php +++ b/src/includes/class-boldgrid-framework-api.php @@ -146,8 +146,10 @@ public function print_title_tagline() { * @return array $classes Filter classes on .site-content element. */ public function blog_container( $classes ) { + global $boldgrid_theme_framework; + $theme_mod_type = $boldgrid_theme_framework->woo->is_woocommerce_page() ? 'bgtfw_woocommerce_container' : 'bgtfw_blog_page_container'; if ( is_single() || is_attachment() ) { - $theme_mod = get_theme_mod( 'bgtfw_pages_blog_posts_layout_layout' ); + $theme_mod = get_theme_mod( $theme_mod_type ); $classes[] = empty( $theme_mod ) ? 'full-width' : 'container'; } @@ -164,8 +166,30 @@ public function blog_container( $classes ) { * @return array $classes Filter classes on .site-content element. */ public function page_container( $classes ) { - if ( is_page() ) { - $theme_mod = get_theme_mod( 'bgtfw_pages_container' ); + global $boldgrid_theme_framework; + $theme_mod_type = $boldgrid_theme_framework->woo->is_woocommerce_page() ? 'bgtfw_woocommerce_container' : 'bgtfw_blog_page_container'; + if ( is_page() || ( $boldgrid_theme_framework->woo->is_woocommerce_page() && is_shop() ) ) { + $theme_mod = get_theme_mod( $theme_mod_type ); + $classes[] = empty( $theme_mod ) ? 'full-width' : 'container'; + } + + return $classes; + } + + /** + * Add woocommerce container classes. + * + * @since SINCEVERSION + * + * @param array $classes Classes added to .site-content element. + * + * @return array $classes Filter classes on .site-content element. + */ + public function woocommerce_container( $classes ) { + global $boldgrid_theme_framework; + + if ( $boldgrid_theme_framework->woo->is_woocommerce_page() ) { + $theme_mod = get_theme_mod( 'bgtfw_woocommerce_container' ); $classes[] = empty( $theme_mod ) ? 'full-width' : 'container'; } @@ -183,8 +207,11 @@ public function page_container( $classes ) { */ public function blog_page_container( $classes ) { global $wp_query; - if ( ( isset( $wp_query ) && ( bool ) $wp_query->is_posts_page ) || is_home() || is_archive() ) { - $theme_mod = get_theme_mod( 'bgtfw_blog_page_container' ); + global $boldgrid_theme_framework; + $theme_mod_type = $boldgrid_theme_framework->woo->is_woocommerce_page() ? 'bgtfw_woocommerce_container' : 'bgtfw_blog_page_container'; + + if ( ( isset( $wp_query ) && ( bool ) $wp_query->is_posts_page ) || is_home() || is_archive() || is_shop() ) { + $theme_mod = get_theme_mod( $theme_mod_type ); $classes[] = empty( $theme_mod ) ? 'full-width' : 'container'; } diff --git a/src/includes/class-boldgrid-framework-woocommerce.php b/src/includes/class-boldgrid-framework-woocommerce.php index 00701d731..d4e3a93be 100644 --- a/src/includes/class-boldgrid-framework-woocommerce.php +++ b/src/includes/class-boldgrid-framework-woocommerce.php @@ -97,7 +97,7 @@ public function customizer( $wp_customize ) { * @since 2.0.0 */ public function add_container_open() { - $classes = array( get_theme_mod( 'woocommerce_container', 'container' ) ); + $classes = array( get_theme_mod( 'bgtfw_woocommerce_container', 'container' ) ); $classes = apply_filters( 'bgtfw_woocommerce_wrapper_classes', $classes ); echo '