Hide Sub-categories showing on mouse hover on Main Categories on Shop page

Hello Luke Neilson,

Can you please suggest-

1. How to Hide displaying the Sub-categories, that shows -up while hovering mouse on the Main Category names on the Shop page (on Banner). Please check below Video-

https://bit.ly/3oRvZUo
Shop URL – https://www.vasangini.com/shop/

We have so many Sub-categories under Main Categories, that can be seen from Video, and it does not looks good at all.

2. Other than that, is there a way to show only first 3-5 Sub-Categories on Mouse hover (with “Show All” button text or link at bottom) clicking on which reveals the remaining Sub-Categories.

PS: We have just the Deomo installed, as it is. No 3rd Party plugin, No custom CSS or code so far.

Regards

Hello,

1. You can hide subcategories by means of the “Show current category ancestors” option which allows you to hide subcategories from the page title on the shop page and they will only appear when you move to a certain category. Please navigate to Theme Settings -> Product archive -> Page title.

https://monosnap.com/file/Bex2Fe8EOTHCdJL2U5YGxQtqFZ8ITr

https://gyazo.com/dc5c6f395f80c402d78ac05942060b25

2. Sorry, but we don’t have such an option for making dropdowns with limited subcategories and a “Show All” button.

Kind Regards

Hello Luke,

Yes, It worked. I think, you might have changed that setting yesterday itself and hence, it started working from that time onwards (not showing sub-categories). Or probably I did unknowingly.

Great. Looking for this only. Thanks

Just a suggestion – Initially, this option is bit confusing. As it is nowhere mentioned that Enabling this option, will Hide Sub-categories (on Hover).

This option is meant to display Child Sub-categories only while after clicking the Parent Category (and will Not show other Parent Categories on subsequent Category pages).

So, if a text message could also be added, something like that- Enabling this will Hide Sub-categories display, On-Hover.
And as functionality is already there, so if there is a possibility that the options could be split in two. Means a separate option to – On and Off for Sub-category display could be added in Theme options -> Product archive -> Page title
That would help to understand this much easier.

Few others-

3. Please suggest how to resolve this-
https://themeforest.net/comments/27577860

There is a Pagination behaviour issue, due to which clicking on the page number (from Shop page) takes the user to the very top of the Shop page instead of just the point from where the product grid starts to display.

That is, after clicking page number, the Auto-scroll-up, should Stop at the beginning where products begin to display, and not Scrolls-up until the very beginning of that whole Shop page.
Due to this (after clicking the page number), one has to unnecessarily scroll down again, to the point where product grid starts, to keep viewing further products.

This is really unwanted and bit frustrating.

Please see below video:
https://bit.ly/3cMwhqc

4. There is some some sort of coding related issue, partly not working as intended.

I used this matter – https://wa.me/1XXXXXXXXXX in Whatsapp field here https://i2.paste.pics/F3HMR.png (in Social Profile options)

I found that it is perfectly working on Desktop or Laptop and opens the Click to Chat window directly, with the same number that I mentioned in backend for Whatsapp field (from Social profile options)

However, when I click the Whatsapp icon (from same Top Header location), it then opens the Share to Whatsapp (instead of Click to Chat, just like how it is working on Desktop), which is not correct.
This should work the way, it is working on Desktop, with a purpose of Click to Chat (with mentioned number)

Please fix this.

Regards

Hello,

We will consider your feedback.

3. To be able to change scroll position after clicking on the page number to the beginning of products, try to add this code to the functions.php file in your child theme

if ( ! function_exists( 'woodmart_get_localized_string_array' ) ) {
    /**
     * Get localize array
     *
     * @since 1.0.0
     *
     * @return array
     */
    function woodmart_get_localized_string_array() {
        $menu_hash_transient = get_transient( 'woodmart-menu-hash-time' );
        if ( false === $menu_hash_transient ) {
            $menu_hash_transient = time();
            set_transient( 'woodmart-menu-hash-time', $menu_hash_transient );
        }

        $site_custom_width     = woodmart_get_opt( 'site_custom_width' );
        $predefined_site_width = woodmart_get_opt( 'site_width' );

        $site_width = '';

        if ( 'full-width' === $predefined_site_width ) {
            $site_width = 1222;
        } elseif ( 'boxed' === $predefined_site_width ) {
            $site_width = 1160;
        } elseif ( 'boxed-2' === $predefined_site_width ) {
            $site_width = 1160;
        } elseif ( 'wide' === $predefined_site_width ) {
            $site_width = 1600;
        } elseif ( 'custom' === $predefined_site_width ) {
            $site_width = $site_custom_width;
        }

        return array(
            'menu_storage_key'                       => apply_filters( 'woodmart_menu_storage_key', 'woodmart_' . md5( get_current_blog_id() . '_' . get_site_url( get_current_blog_id(), '/' ) . get_template() . $menu_hash_transient ) ),
            'ajax_dropdowns_save'                    => apply_filters( 'xts_ajax_dropdowns_save', true ),
            'photoswipe_close_on_scroll'             => apply_filters( 'woodmart_photoswipe_close_on_scroll', true ),
            'woocommerce_ajax_add_to_cart'           => get_option( 'woocommerce_enable_ajax_add_to_cart' ),
            'variation_gallery_storage_method'       => woodmart_get_opt( 'variation_gallery_storage_method', 'old' ),
            'elementor_no_gap'                       => woodmart_get_opt( 'negative_gap', 'enabled' ),
            'adding_to_cart'                         => esc_html__( 'Processing', 'woodmart' ),
            'added_to_cart'                          => esc_html__( 'Product was successfully added to your cart.', 'woodmart' ),
            'continue_shopping'                      => esc_html__( 'Continue shopping', 'woodmart' ),
            'view_cart'                              => esc_html__( 'View Cart', 'woodmart' ),
            'go_to_checkout'                         => esc_html__( 'Checkout', 'woodmart' ),
            'loading'                                => esc_html__( 'Loading...', 'woodmart' ),
            'countdown_days'                         => esc_html__( 'days', 'woodmart' ),
            'countdown_hours'                        => esc_html__( 'hr', 'woodmart' ),
            'countdown_mins'                         => esc_html__( 'min', 'woodmart' ),
            'countdown_sec'                          => esc_html__( 'sc', 'woodmart' ),
            'cart_url'                               => ( woodmart_woocommerce_installed() ) ? esc_url( wc_get_cart_url() ) : '',
            'ajaxurl'                                => admin_url( 'admin-ajax.php' ),
            'add_to_cart_action'                     => ( woodmart_get_opt( 'add_to_cart_action' ) ) ? esc_js( woodmart_get_opt( 'add_to_cart_action' ) ) : 'widget',
            'added_popup'                            => ( woodmart_get_opt( 'added_to_cart_popup' ) ) ? 'yes' : 'no',
            'categories_toggle'                      => ( woodmart_get_opt( 'categories_toggle' ) ) ? 'yes' : 'no',
            'enable_popup'                           => ( woodmart_get_opt( 'promo_popup' ) ) ? 'yes' : 'no',
            'popup_delay'                            => ( woodmart_get_opt( 'promo_timeout' ) ) ? (int) woodmart_get_opt( 'promo_timeout' ) : 1000,
            'popup_event'                            => woodmart_get_opt( 'popup_event' ),
            'popup_scroll'                           => ( woodmart_get_opt( 'popup_scroll' ) ) ? (int) woodmart_get_opt( 'popup_scroll' ) : 1000,
            'popup_pages'                            => ( woodmart_get_opt( 'popup_pages' ) ) ? (int) woodmart_get_opt( 'popup_pages' ) : 0,
            'promo_popup_hide_mobile'                => ( woodmart_get_opt( 'promo_popup_hide_mobile' ) ) ? 'yes' : 'no',
            'product_images_captions'                => ( woodmart_get_opt( 'product_images_captions' ) ) ? 'yes' : 'no',
            'ajax_add_to_cart'                       => ( apply_filters( 'woodmart_ajax_add_to_cart', true ) ) ? woodmart_get_opt( 'single_ajax_add_to_cart' ) : false,
            'all_results'                            => esc_html__( 'View all results', 'woodmart' ),
            'product_gallery'                        => woodmart_get_product_gallery_settings(),
            'zoom_enable'                            => ( woodmart_get_opt( 'image_action' ) === 'zoom' ) ? 'yes' : 'no',
            'ajax_scroll'                            => ( woodmart_get_opt( 'ajax_scroll' ) ) ? 'yes' : 'no',
            'ajax_scroll_class'                      => apply_filters( 'woodmart_ajax_scroll_class', '.shop-loop-head' ),
            'ajax_scroll_offset'                     => apply_filters( 'woodmart_ajax_scroll_offset', 100 ),
            'infinit_scroll_offset'                  => apply_filters( 'woodmart_infinit_scroll_offset', 300 ),
            'product_slider_auto_height'             => ( woodmart_get_opt( 'product_slider_auto_height' ) ) ? 'yes' : 'no',
            'price_filter_action'                    => ( apply_filters( 'price_filter_action', 'click' ) === 'submit' ) ? 'submit' : 'click',
            'product_slider_autoplay'                => apply_filters( 'woodmart_product_slider_autoplay', false ),
            'close'                                  => esc_html__( 'Close (Esc)', 'woodmart' ),
            'share_fb'                               => esc_html__( 'Share on Facebook', 'woodmart' ),
            'pin_it'                                 => esc_html__( 'Pin it', 'woodmart' ),
            'tweet'                                  => esc_html__( 'Tweet', 'woodmart' ),
            'download_image'                         => esc_html__( 'Download image', 'woodmart' ),
            'cookies_version'                        => ( woodmart_get_opt( 'cookies_version' ) ) ? (int) woodmart_get_opt( 'cookies_version' ) : 1,
            'header_banner_version'                  => ( woodmart_get_opt( 'header_banner_version' ) ) ? (int) woodmart_get_opt( 'header_banner_version' ) : 1,
            'promo_version'                          => ( woodmart_get_opt( 'promo_version' ) ) ? (int) woodmart_get_opt( 'promo_version' ) : 1,
            'header_banner_close_btn'                => woodmart_get_opt( 'header_close_btn' ) ? 'yes' : 'no',
            'header_banner_enabled'                  => woodmart_get_opt( 'header_banner' ) ? 'yes' : 'no',
            'whb_header_clone'                       => woodmart_get_config( 'header-clone-structure' ),
            'pjax_timeout'                           => apply_filters( 'woodmart_pjax_timeout', 5000 ),
            'split_nav_fix'                          => apply_filters( 'woodmart_split_nav_fix', false ),
            'shop_filters_close'                     => woodmart_get_opt( 'shop_filters_close' ) ? 'yes' : 'no',
            'woo_installed'                          => woodmart_woocommerce_installed(),
            'base_hover_mobile_click'                => woodmart_get_opt( 'base_hover_mobile_click' ) ? 'yes' : 'no',
            'centered_gallery_start'                 => apply_filters( 'woodmart_centered_gallery_start', 1 ),
            'quickview_in_popup_fix'                 => apply_filters( 'woodmart_quickview_in_popup_fix', false ),
            'one_page_menu_offset'                   => apply_filters( 'woodmart_one_page_menu_offset', 150 ),
            'hover_width_small'                      => apply_filters( 'woodmart_hover_width_small', true ),
            'is_multisite'                           => is_multisite(),
            'current_blog_id'                        => get_current_blog_id(),
            'swatches_scroll_top_desktop'            => woodmart_get_opt( 'swatches_scroll_top_desktop' ) ? 'yes' : 'no',
            'swatches_scroll_top_mobile'             => woodmart_get_opt( 'swatches_scroll_top_mobile' ) ? 'yes' : 'no',
            'lazy_loading_offset'                    => woodmart_get_opt( 'lazy_loading_offset' ),
            'add_to_cart_action_timeout'             => woodmart_get_opt( 'add_to_cart_action_timeout' ) ? 'yes' : 'no',
            'add_to_cart_action_timeout_number'      => woodmart_get_opt( 'add_to_cart_action_timeout_number' ),
            'single_product_variations_price'        => woodmart_get_opt( 'single_product_variations_price' ) ? 'yes' : 'no',
            'google_map_style_text'                  => esc_html__( 'Custom style', 'woodmart' ),
            'quick_shop'                             => woodmart_get_opt( 'quick_shop_variable' ) ? 'yes' : 'no',
            'sticky_product_details_offset'          => apply_filters( 'woodmart_sticky_product_details_offset', 150 ),
            'preloader_delay'                        => apply_filters( 'woodmart_preloader_delay', 300 ),
            'comment_images_upload_size_text'   => sprintf( esc_html__( 'Some files are too large. Allowed file size is %s.', 'woodmart' ), size_format( (int) woodmart_get_opt( 'single_product_comment_images_upload_size' ) * MB_IN_BYTES ) ), // phpcs:ignore
            'comment_images_count_text'         => sprintf( esc_html__( 'You can upload up to %s images to your review.', 'woodmart' ), woodmart_get_opt( 'single_product_comment_images_count' ) ), // phpcs:ignore
            'comment_images_upload_mimes_text'  => sprintf( esc_html__( 'You are allowed to upload images only in %s formats.', 'woodmart' ), apply_filters( 'xts_comment_images_upload_mimes', 'png, jpeg' ) ), // phpcs:ignore
            'comment_images_added_count_text'   => esc_html__( 'Added %s image(s)', 'woodmart' ), // phpcs:ignore
            'comment_images_upload_size'             => (int) woodmart_get_opt( 'single_product_comment_images_upload_size' ) * MB_IN_BYTES,
            'comment_images_count'                   => woodmart_get_opt( 'single_product_comment_images_count' ),
            'search_input_padding'                   => apply_filters( 'wd_search_input_padding', false ) ? 'yes' : 'no',
            'update_fragments_fix'                   => apply_filters( 'woodmart_update_fragments_fix', true ) ? 'yes' : 'no',
            'comment_images_upload_mimes'            => apply_filters(
                'woodmart_comment_images_upload_mimes',
                array(
                    'jpg|jpeg|jpe' => 'image/jpeg',
                    'png'          => 'image/png',
                )
            ),
            'home_url'                               => home_url( '/' ),
            'shop_url'                               => woodmart_woocommerce_installed() ? esc_url( wc_get_page_permalink( 'shop' ) ) : '',
            'age_verify'                             => ( woodmart_get_opt( 'age_verify' ) ) ? 'yes' : 'no',
            'age_verify_expires'                     => apply_filters( 'woodmart_age_verify_expires', 30 ),
            'cart_redirect_after_add'                => get_option( 'woocommerce_cart_redirect_after_add' ),
            'swatches_labels_name'                   => woodmart_get_opt( 'swatches_labels_name' ) ? 'yes' : 'no',
            'product_categories_placeholder'         => esc_html__( 'Select a category', 'woocommerce' ),
            'product_categories_no_results'          => esc_html__( 'No matches found', 'woocommerce' ),
            'cart_hash_key'                          => apply_filters( 'woocommerce_cart_hash_key', 'wc_cart_hash_' . md5( get_current_blog_id() . '_' . get_site_url( get_current_blog_id(), '/' ) . get_template() ) ),
            'fragment_name'                          => apply_filters( 'woocommerce_cart_fragment_name', 'wc_fragments_' . md5( get_current_blog_id() . '_' . get_site_url( get_current_blog_id(), '/' ) . get_template() ) ),
            'photoswipe_template'                    => '<div class="pswp" aria-hidden="true" role="dialog" tabindex="-1"><div class="pswp__bg"></div><div class="pswp__scroll-wrap"><div class="pswp__container"><div class="pswp__item"></div><div class="pswp__item"></div><div class="pswp__item"></div></div><div class="pswp__ui pswp__ui--hidden"><div class="pswp__top-bar"><div class="pswp__counter"></div><button class="pswp__button pswp__button--close" title="' . esc_html__( 'Close (Esc)', 'woocommerce' ) . '"></button> <button class="pswp__button pswp__button--share" title="' . esc_html__( 'Share', 'woocommerce' ) . '"></button> <button class="pswp__button pswp__button--fs" title="' . esc_html__( 'Toggle fullscreen', 'woocommerce' ) . '"></button> <button class="pswp__button pswp__button--zoom" title="' . esc_html__( 'Zoom in/out', 'woocommerce' ) . '"></button><div class="pswp__preloader"><div class="pswp__preloader__icn"><div class="pswp__preloader__cut"><div class="pswp__preloader__donut"></div></div></div></div></div><div class="pswp__share-modal pswp__share-modal--hidden pswp__single-tap"><div class="pswp__share-tooltip"></div></div><button class="pswp__button pswp__button--arrow--left" title="' . esc_html__( 'Previous (arrow left)', 'woocommerce' ) . '"></button> <button class="pswp__button pswp__button--arrow--right" title="' . esc_html__( 'Next (arrow right)', 'woocommerce' ) . '>"></button><div class="pswp__caption"><div class="pswp__caption__center"></div></div></div></div></div>',
            'load_more_button_page_url'              => apply_filters( 'woodmart_load_more_button_page_url', true ) ? 'yes' : 'no',
            'menu_item_hover_to_click_on_responsive' => apply_filters( 'woodmart_menu_item_hover_to_click_on_responsive', false ) ? 'yes' : 'no',
            'clear_menu_offsets_on_resize'           => apply_filters( 'woodmart_clear_menu_offsets_on_resize', true ) ? 'yes' : 'no',
            'three_sixty_framerate'                  => apply_filters( 'woodmart_three_sixty_framerate', 60 ),
            'ajax_search_delay'                      => apply_filters( 'woodmart_ajax_search_delay', 300 ),
            'site_width'                             => $site_width,
            'combined_css'                           => woodmart_get_opt( 'combined_css', true ) ? 'yes' : 'no',
            'slider_distortion_effect'               => 'sliderWithNoise',
            'ajax_links'                             => apply_filters( 'woodmart_ajax_links', '.wd-nav-product-cat a, .widget_product_categories a, .widget_layered_nav_filters a, .woocommerce-widget-layered-nav a, .filters-area:not(.custom-content) a, body.post-type-archive-product:not(.woocommerce-account) .woocommerce-pagination a, body.tax-product_cat:not(.woocommerce-account) .woocommerce-pagination a, .wd-shop-tools a:not(.breadcrumb-link), .woodmart-woocommerce-layered-nav a, .woodmart-price-filter a, .wd-clear-filters a, .woodmart-woocommerce-sort-by a, .woocommerce-widget-layered-nav-list a, .wd-widget-stock-status a, .widget_nav_mega_menu a' ),
        );
    }
}

4. The problem is that you have selected the “Share” buttons for mobile devices.

https://monosnap.com/file/2ykS1ZLRx5ilhqScjc2fELB1lPqzQc

You should enable the “Follow” buttons then the issue will be solved.

https://monosnap.com/file/bliuRMzosF10ldXIAUPu3eMWSPaOqp

Kind Regards

Hello,

1. Thank you for considering the suggestion.

3. This code worked like a Charm. Great 🙂
Can you please update this functionality in next Theme update. As this is how everyone else might want to have it worked like.
And by that, this would avoid adding extra code too in Child’s theme.

4. I did enabled the Follow option itself and not the share, that is why it is working on Desktop. But just not on mobile.
Update: However, after receiving your reply, I just realized, that there is an option of Separate Header type for Mobile device also.
That’s really interesting. I update the Header and that worked too.
Much thanks 🙂

5. I created a Pop-up button for a Form (contact form), on this below Draft page (Which, I copied from one of your Demo content page – https://bit.ly/3xz4C5v)–

https://www.vasangini.com/wp-admin/post.php?post=7262&action=edit
The button worked fine here on this page, and as it is like your Demo content page.

From this page, I then, copied the contents and paste it in Content “Before Add to Cart button” from Single Product – > Add to Cart options, here-
https://i2.paste.pics/F5DSM.png

Everything worked fine, except just the Background color. Which is not visible. Due to which the contents on right side are also not visible.
Page URL – https://bit.ly/3E4duT7
Video –
https://bit.ly/3E3Ia72

Not sure, why background color is not visible.
Can you please look into it and resolve, so as to make the Background color (even BG images) also visible.

6. I enabled Product Titles line limit as – > “One Line” from Product Archive > Product Styles option, as below-
https://i2.paste.pics/F5E0Y.png

But Title is still appearing In-Full in below areas –
a. Sidebar (and other Widgets areas)
b. Previous or Next arrows on Single product (when Hover mouse on arrows)
(PS: It correctly reflects One-line on Shop and Category pages, but not on other areas),
hence making it Odd while displaying.

Video –
https://bit.ly/3rixZbe

Due to which there is lot of space appears at top and bottom of the thumb image too. And height of sidebar or widgets increases too, when displaying products having long Titles.

How to fix the Title limit in these areas also.

Can you please add an option to Show One-Line for other areas also, in the upcoming update of Theme
Preferably to Show as an Excerpt, so that it is clear that the Product has other words in Title also (and showing only limited ones). That is 2-3 dots (…) after the last visible word or so.

Regards

Hello,

5. The problem is that you didn’t use the popup preset correctly.

https://monosnap.com/file/XOLYZ2crsOUqepqtaqiCRIsaN4R25t

You should copy it to the HTML block and only then in the “before add to cart” area insert the ID of the HTML block containing this popup.

https://monosnap.com/file/VFPoiNKQLbdOlDjfEOsH3uG3qRpG1l

https://monosnap.com/file/3vwSkM5Z9Txlq2OBsNRaiY4ji13mk6

https://monosnap.com/file/071vipXSIROwT2mie60ixK7xNS9AJU

https://gyazo.com/9b1ba8f7120c8c94f90ce4c814ce145c

6. The “Product title lines limit” option works only for the shop page products.
I have prepared custom CSS code for you, that reduces the title size for the “Next & Prev” buttons.

.single-product  .product-short .wd-entities-title {
  text-overflow: ellipsis;
  overflow: hidden; 
  width: 100%;
  max-width: 165px;
  white-space: nowrap;
}

If you want to reduce the title somewhere else, please attach some screenshots for a better understanding of where I can find it on your site.

Kind Regards

Hello Luke,

5. Yes, that way, it worked and started showing BG color also.

a. Still, curious to know, should not it normally work with the content code (same previous html code) also. As everything else also is working fine. Just wondering why only BG color is not displaying.
b. If, instead of adding Html block ID in the Tab named as TEXT ( in “before add to cart” area), what, if we directly choose the HTML ID from the drop down of HTML Black Tab (next to Text tab)
Please refer this – https://i2.paste.pics/F5VD4.png
Will that still work, exactly the same way. And not break or misalign at all.
Or it will have some different impact. Or may not work properly.

6. This code worked
Much thanks 🙂
Will share Screenshot of other areas, once I populate widgets or sidebars.

PS: But would highly appreciate, if you could please forward this to Dev team, to implement this feature for other areas too. Like Prev – Next arrows, Sidebars, Widgets and Woodmart Elements, wherever products can be displayed. So as to maintain uniformity across all.
Specially, even if the existing feature of One-Line Title could be updated, so as it also begin to show the excerpt with 2-3 dots at the end of last word (just like you shared CSS for)

7. Similarly, we changed the Font Colors of Product’s price (Old n New) from Advance Typography section, by creating a 2 New Rules separately, for each.
Please see here – https://i2.paste.pics/F5W4E.png
However, that did not change the colors of price (Old n New) in Prev-Next arrows and Shop sidebars and Widgets.
Please see here – https://i2.paste.pics/F5W7F.png

I could not find the rule selector for these price color options (from dropdown under Advance Typ Rule)
Q. Can you please get those areas Added too. So that one can create any other Rule also for these areas.

Q Until then, please suggest how to change or update the same colors for price on these areas.
If possible using Custom Selector shown here – https://i2.paste.pics/F5WN2.png
Or via custom CSS

The current values are – rgb(101,198,189) – New price
and rgb(242,171,171) – Old price

8. Our Logo is not appearing after adding it from the Header Builder.
To elaborate – Woodmart Logo (from Default Header) is appearing on Header of Home page. Please check this – https://i2.paste.pics/F5VWJ.png

From here, we replace Woodmart logo with ours
https://i2.paste.pics/F5VKS.png

However, whenever, we replace it with ours, it do not appears on Home page of our Site, Infact, Main Menus also shifts towards left.
https://i2.paste.pics/F5VNE.png

After replacing we Save Logo block, then Save Header. Please see how it reflects on Home page (and wherever this Default Header is enabled)-
https://i2.paste.pics/F5VQP.png

This is the Logo, we are using and want to use (you will find it in Media)-
https://i2.paste.pics/F5VM4.png
Can you please check at your end, by editing “Default Header” (from Header Builder list)
And resolve

PS: I marked your response As USEFUL. I want to Tick mark others also, unfortunately, I am not able to mark other responses in the same thread as USEFUL.

Regards

Hello,

5.
a. Maybe the page builder doesn’t see the CSS styles completely when you insert the code directly into the text area.

b. Really it doesn’t matter how you insert the HTML block, using ID or via the “HTML block” tab

6. Of course, I have passed this information to the development department and they will look at your offer.

7. Here is a custom CSS for changing price color in the “Prev or Next” areas.

.single-product .product-short .price .amount {
    color: rgb(101,198,189);
}

.single-product .product-short .price del .amount {
    color: rgb(242,171,171);
}

8. I have checked the issue with the logo, it seems that the problem is in some proportions in your logo. To be able to resolve it, just enable the “Add width and height attributes” option below the upload image area.

https://monosnap.com/file/RV8OiFJhS35MZAYTl8cp6FctqEGhUM

Kind Regards

Hello,

5.a. OK.
But, as we add the HTML code inside Theme settings options. So probably, the Theme might not be properly replicating the BG color and few CSS correctly.

b. Sounds Good. Thanks for clarifying.

6. Much thanks 🙂

7. Yes, this worked. Thanks 🙂

7.a. Can the same be achieved using Custom Selector also, as can be seen here – https://i2.paste.pics/F5WN2.png
If so, how ?

b. We select the pre-defined rules from Advance Typography section, here –
https://i2.paste.pics/F5W4E.png
But that worked for 2 areas only.

Can you please forward this suggestion to team, that if either these 2 Rules can be updated in a way, to reflect the Colors All-over (including Prev-Next, Widgets, Sidebars, WM elements)

And if additional pre-defined Rules (for other areas) can be added, in the existing Rule List

That way, it will retain Uniformity across. And one don’t need to Add Custom CSS separately for each of such area. Specially, when the options is available in Settings.

8. That worked 🙂 Thank you
By enabling the “Add width and height attributes” option, Logo started appearing.

a. We created this using Adobe Illustrator. Just wondering, do we need to add the Width and Height attributes in Illustrator itself, while Creating, or Saving or Exporting it as SVG.
So that we do need to Select the “Add Width and Height attribute” option in Theme settings, as you suggested here-
https://monosnap.com/file/RV8OiFJhS35MZAYTl8cp6FctqEGhUM

b. Also, it is quite practical that Logos of each Brand can have variable height and may be of same size dimensions.
Hence, bit curious to know, as why only Woodmart logo is getting accepted or Logo with similar dimensions accepted by default. (without enabling that width height option).

And why not ours, if the height is bit higher in comparison. Can I ask, what could be the prime Logic behind that. As I tried to reduce the Max-width also (from Logo settings), but even after that, our Logo was not visible.

c. Until which height (max) the Logo is normally being accepted by the Theme, currently. And will be visible too, without enabling the option of Width and Height Attributes.

Regards

Hello,

7. In order to change the price color, try to add this CSS selector as the “Custom selector” in the “Advanced typography” settings as in the screenshot.

https://prnt.sc/21ed09q

html .website-wrapper .price, html .website-wrapper .amount

To be able to change the old price, add this selector in a similar way.

html .website-wrapper .price del, html .website-wrapper del .amount

In our next update, we will reconsider the settings of the price in the Advanced typography.

8. If you don’t want to use the “Add width and height attributes” option, you should add it to your logo by default. Our logo has by default it so we don’t use the “Add width and height attributes” option.

The height of the logo depends on the ratio of the sides of the logo but is not higher than the height of the row.

Kind Regards

Hello Luke,

7. The Selector worked. Much Thanks 🙂

I prefer this way, as it keeps all similar changes at One place. And the changes have much better Visual appearance. As well that includes Color, fonts in a visual array too. Please see here-
https://i2.paste.pics/F6Y1W.png
This is much easier to understand the existing changes, and would be easier to make further changes as well.

Most importantly, by just making any change (say font size or color), it will automatically reflect to ALL of the relevant Selectors (in a single Rule) at once.

7.a. Is this a Class Selector or a Div Selector.

7.b. You provided this Custom CSS earlier-
.single-product .product-short .price .amount

and then as a selector (for Rule) as below-
html .website-wrapper .price, html .website-wrapper .amount

I earlier thought that it will work, even if I add the above custom CSS code (rather than selector) in the Selector area as the “Custom selector” in the “Advanced typography” settings

Will the Two always differ.

8. Yes, I recreated the Logo with size dimensions inbuilt (by disabling Responsiveness) and then that worked.
That means, Responsive logo is currently not being accepted in Woodmart theme.
Can you please take this as a suggestion and forward to team, so that they can make some required changes in order to accept the Responsive SVG Logo also.

9. How can we show just the Video icon on the Product Grid, Shop Page n Category Pages. (that shows up on a Single Product page, when we upload the Video for any product)

Please see below video-
https://bit.ly/3Ir94Zp

To show only a triangular shaped Video icon with circle or square shaped white background (Just like cart icon showing in Product Grid at left bottom)

As, that way it will help visitors to understand that there is a Video for any such Product.
This will surely attract them, as it distinguish with other products that are without Video.
And that way, it can bring more attention and increase hits on such products. Thereby, may result in more sales too (probably)

Regards

Hello,

7a. It’s a class and div selectors.

7b. The second code applies more globally and rewrites any custom code.

8. Okay, I will contact them and pass on your proposal.

9. Sorry, but we don’t have such functionality for showing the “Watch video” button on the shop page. We also don’t have a custom code for that.

Kind Regards

Hell Luke,

9.

Sorry, but we don’t have such functionality for showing the “Watch video” button on the shop page

Can you please take this as a suggestion and forward to team, so that they can make some required changes for upcoming update. In order to show only a smaller triangular shaped Video icon, on Shop, Category and product grids, by considering below logic.

As, that way it will help visitors to understand that there is a Video for any such Product.
This will surely attract them, as it distinguish from other products that are without Video.
And that way, it can bring more attention and increase hits on such products. Thereby, may result in more sales too (probably)

10. I found that, there is one single option to Hide-Show the Product Meta on Single product pages. (from Theme Settings -> Single Product -> Show-Hide elements, as shown below
https://i2.paste.pics/F7E83.png
How can one Hide specific Meta, and not all, at once.
Say either just the Categories, but want to display SKUs, or viceversa.

PS: A separate checkbox (to show-hide) for each option individually would have been great and convenient, will provide flexibility.

10.b. In Single Product -> Show-Hide Elements, it is written –
“Show attributes table after short description”
However at just bottom text, it is written – “display attributes table instead of short..”
https://i2.paste.pics/F7EAF.png

So, should it be “After” or “Instead”

With the word “After”, it refers that the Short Desc. will be there. But by “Instead” it refers, that the Short Desc won’t be there and will be replaced.

What exactly it means and results here.

10.c Also, what does “Attributes” refers here, to display after Short description.
Can you please show my with Live URL example or Screenshot. How it reflects

Regards

Hello,

9. I have forwarded your suggestion to the team. They will consider your proposal.

10. To be able to hide a specific meta (e.g category meta), enter this custom CSS code to the “Global Custom CSS” area in Theme Settings -> Custom CSS.

.single-product .product_meta .posted_in {
    display: none !important;
}

Here is code that hides the “SKU” meta:

.single-product .product_meta .sku_wrapper {
    display: none !important;
}

10. Product attributes (like color, size, etc.) refer to the “Show attributes table after short description” option.

Here is a short video that provides you with how it will look:

https://www.loom.com/share/cea44b4ce7b34acda1491bde93d3a7a8

https://prnt.sc/21zgye5

The issue with the description of the “Show attributes table after short description” option will be fixed in our next update. There should be “After”.

Kind Regards

[harshwe]

Hello,

9. Thank you. I wish, team will surely consider this request.

9.a. You shared below code also, Can you please suggest what this code will do or hide (will it hide All meta types info, at once. Or only any one of these. If so, then which one) –

.single-product .product_meta .posted_in {
    display: none !important;
}

9.b. Similarly, can you please share the CSS to hide the Meta just for – Categories and Tags alone. A separate CSS for each Meta type.

10.c. OK. Got your point. Means, will it remove Additional info tab completely from Tabs area, once we enable this option.

6. You shared the Custom CSS to reduce the Title length of the Products for the “Next & Prev” buttons, in response to my point 6, on this below post reply- 335712

You suggested to share the screenshot to be applied similarly for other areas with same effect too-
https://i2.paste.pics/F8GX1.png

So, here it is-
How to show Excerpt of Product Titles (in a same way, with 2-3 dots at the end of the last visible word) in the Sidebar of Shop and Category pages. Area shown below.

https://i2.paste.pics/F7P9P.png
URL – https://www.vasangini.com/shop/

Regards

• This reply was modified 2 years, 4 months ago by harshwe.
• This reply was modified 2 years, 4 months ago by harshwe.
• This reply was modified 2 years, 4 months ago by harshwe.

Hello,

9a. This code hides the meta categories.

9b. Here is a code for hiding the meta tags:

.single-product .product_meta .tagged_as {
    display: none !important;
}

To be able to hide the meta tags fully, try to add this custom PHP code to the functions.php file in your child theme.

if  ( ! function_exists('wd_remove_meta') ) {
    
    function wd_remove_meta() {
        remove_action( 'woocommerce_single_product_summary', 'woocommerce_template_single_meta', 40 );
    }

    add_action( 'init', 'wd_remove_meta' );
}

10c. Yes you are right. After enabling it, the “Additional information” tab will be removed.

6. Please, try to add this code to the “Global Custom CSS” area for trimming the titles.

.widget_products .wd-entities-title {
  text-overflow: ellipsis;
  overflow: hidden; 
  width: 100%;
  max-width: 95px;
  white-space: nowrap;
}

Kind Regards

Hello Luke,

9.a. thanks for clarifying.

9.b. OK. thank you. This worked.

6. I tried to show some extra words of Title, but it overlaps in right frame area. (as using that CSS it was showing very few words, if we set Sidebar size as Small from Theme settings > Page Archive > sidebar)

https://i2.paste.pics/F9M3F.png
How can we wrap extra text in next line.
Or, how can we show excerpt of words till 2 lines in the Sidebar widget area.

11. I tried to click Whatsapp Social icon that is displaying on Header Top bar (configured as FOLLOW, not Share)
It worked fine, but it is Not inserting the URL of the current page, from where the user clicked on the Whatsapp link.
Am I doing something wrong. Or the Code is currently not prepared for this to work, so far.

Please refer below page and screenshot. This is what we are looking for-
https://i2.paste.pics/F9MFC.png
URL – https://bit.ly/3oBmGsT

In either case, can you please ask the team to have the code updated in order for it to work in a way, so as to share the URL of current page also. (for Whatsapp Follow, the same way it is working in Social Share buttons. And shown in above URL)

Until then, can you please suggest how can we achieve this.
Please suggest what code we need to change and where, so as to make it work like this.

Otherwise, when the user places his query from any Product page, we will never come to know, for which product he or she wants to know and placing query on. With lots of products it would nearly be impossible for visitor, as well as for us, to identify the specific product or page.

And, Our purpose will get defeated, with No Url there as pre-filled message.

Regards

Hello,

6. Sorry but there is no way to display 2 lines of the title with dots, in the end, using custom CSS.

11. The “Follow” icons are configured to simply follow the link, usually, these buttons are used to acquaint customers with the social networks of the owner. But I will forward your suggestion to the team.

Kind Regards

[harshwe]

Hello,

6. I updated the text length which I want to show in sidebar area.
Hence, with this much of text length to display (as can be seen from below screenshot), how can we simply wrap the extra text in next line. So that it won’t override the other area.
https://i2.paste.pics/F9M3F.png

In either case, the text should not overlap or overwrite the Product’s Gird or Image display area (that is at right side pane).
Should not it Auto-wrap to next line, with whatever length we are displaying. Just like the text is wrapping with complete Title length also (with so many words).

11. You are right that Follow buttons are configure that way. But as technology kept changing and demanding new things, coming up with updates, things are adapting accordingly and frequently.
And hence, for Whatsapp itself, it worked some other way too. In addition to connect with owner, something else requires too, as below-

For Whatsapp, practically, there is Nothing to Follow, neither there is an option to Follow, either.
There is mainly a purpose of Chat with Owner and sharing the issues and requirements with them, in addition to enquiry of product or service.
And when a visitor, coming through website (specially first time user, new-one or unique), and wants to connect with the owner, as well as wanted to place enquiry on existing product (on website), then this feature comes very Handy and useful too.

That is why, same is getting implemented on most of the e-commerce sites too. For which details mentioned underneath too-
https://i2.paste.pics/F9MFC.png
URL – https://bit.ly/3oBmGsT

Until then, can you please suggest what code snippet do we require (reference, above URL), to achieve the same, so that the URL of the current page will also get inserted (in the pre-filled message), from where the user clicked the Whatsapp icon.

Regards

• This reply was modified 2 years, 4 months ago by harshwe.

Hello,

6. Here is a code that shows only 2 lines of title, but without dots in the end (see screenshot below) because it cannot be done using CSS.

https://gyazo.com/b39776fc9e88760663f60e2c73df32ce

.widget_products .wd-entities-title {
  text-overflow: ellipsis;
  overflow: hidden; 
  height: 40px;
}

11. You can use this article that shows how to use click to chat.

https://faq.whatsapp.com/general/chats/how-to-use-click-to-chat/?lang=en

Kind Regards

[harshwe]

Hello,

6. Yes, this worked. I understand about not showing 3 dots (…) in this case.
Thank you 🙂

11. That Article did not helped, for our case.

Is there any way, if you could please suggest what code snippet do we require (reference, below URL), to achieve the same, so that the URL of the current page will also get inserted (in the pre-filled message), from the page, where the user clicked the Whatsapp icon.

https://i2.paste.pics/FBK14.png
URL – https://bit.ly/3oBmGsT

If you could please take a look on the code (from above URL), and suggest with snippet hook, or ask the team, if they can help on this.

Regards

• This reply was modified 2 years, 4 months ago by harshwe.

Hello,

11. Sorry, but we don’t have such a code for changing the “Follow” button. The code from this (https://bit.ly/3oBmGsT) article is not appropriate for our theme.

Kind Regards

[harshwe]

Hello Luke,

11. Is it possible, if you could please suggest some Equivalent code, that works with the Woodmart theme, in order to show the URL of current page. Any custom snippet or hook, that can work.
Would highly appreciate,

7. I come across, that the New and Old prices are still showing the default color (other color) at one another place. Even though we managed to change those using Advance Typo Pre-defined Rules, as well as using the custom Selector (shared by you here), in the ​response ID 336490

7.a. That is, for the Cart, showing in sidebar – https://i2.paste.pics/FCV0G.png
What Selector will change the color of New and Old price here also.
Including the Selector for colors showing in the Sub-Total of same Cart sidebar.

That is why I requested earlier also, to please atleast fix the existing Rules in Adv Typo. whereby, If one selects the Pre-defined Rule to change the Color of the Old and New price, then this Rule should update the Colors of relevant prices, wherever they are displaying, at any location, by any means.

That is, like in Shop page, Single product page, Prev-Next, Widgets, Sidebars, Elements including Cart and Cart sidebar, and so on.
So as to eliminate additional usage of Extra CSS and custom Selectors too.

Here – https://i2.paste.pics/FCV9I.png
Response ID – 336273

As well as it avoids confusion, because the Rule Selectors are not working and making changes Globally too.
Otherwise, the purpose of using Pre-defined Rule also gets defeated, someohow or other. (If one still has to use additional CSS or Selector, thereafter, for implementing same change)

7.c. Hence, please forward the request to team, so that they can update the Existing Pre-defined rules (in Adv Typ area), by looking at them thoroughly.
As well as update this section by bringing more New Pre-defined rules, in order to make things easier too.

Regards

• This reply was modified 2 years, 4 months ago by harshwe.
• This reply was modified 2 years, 4 months ago by harshwe.
• This reply was modified 2 years, 4 months ago by harshwe.

[Luke Nielsen]

Hello,

11. We’re very sorry, but the functionality of the “Follow” button cannot be changed because we don’t have such custom code that can add this functionality.

7. Please, try to use this custom selector for changing price color in the cart sidebar.

.cart-widget-side .woocommerce-Price-amount

I want you to know that we appreciate your feedback. I will forward it to the team.

Kind Regards

• This reply was modified 2 years, 4 months ago by Luke Nielsen.

[harshwe]

Hello Luke,

New-
12. After updating to beta test version 6.5 (on staging site) there appears an issue with the Visitor Counter feature.
On Single product page, if we enable the Live mode of Visitor Counter, and set the frequency to 10 seconds, then it updates the counter almost every half a second, instead of 10
(that is kind of annoying)
Please see here – https://watch.screencastify.com/v/5X2mX8X99eOYeEntPAVZ

Hence, I checked every of the custom code in Child’s theme and found that one of the code that you shared earlier is interfering with this and causing this issue. To verify further, I marked-off (disabled) only that specific code temporary and the Visitor counter started showing correctly and changes after 10 seconds.

The code you shared earlier is within this same thread (or post) with response #335500 for point 3.

PS: This is the reason, I am writing here and under this same thread (post), by creating a response here.

The code was related to – be able to change scroll position after clicking on the page number to the beginning of products (on shop page)

As , there have been so many changes in the code and structure of the theme during updated versions, the previous code might not be working properly.
Hence, can you please share the updated and working code, so that it –
Correctly works with the visitor counter and Live mode frequency.
As well as to change the scroll position after clicking pagination on shop page to the start of the product grid (rather than to the very top of the page)

Regards

• This reply was modified 1 year, 10 months ago by harshwe.
• This reply was modified 1 year, 10 months ago by harshwe.

Hello,

I have added an updated code in your functions.php file so now everything works well.

https://prnt.sc/Cv9PIuFacqxH

Let me know if there is anything else I can help and have a good day!

Kind Regards

[harshwe]

Hello Luke,

12. Thank you so much Luke. Much appreciable.

12 a) Do you mean to say, that the previous code from line 10 (or 12) to line 153 (under functions.php of child theme) is marked-off by you, and is NO longer required now, with the theme updated version 6.5

As currently, I think it is only Marked-off (disabled) by you with the use of double slash (//) and is still there in functions.php file of the child theme and taking too much space.

b). Does that mean, I can now completely remove that prev. code (marked-off) also from the functions.php file, if using version 6.5 and above.

c) Does previous code in 12 a), been completely replaced by this below a very small code, (that is added by you)-

if ( !function_exists('wd_change_scroll') ) {
    function wd_change_scroll($localized) {
        $localized['ajax_scroll_class']   =  apply_filters( 'woodmart_ajax_scroll_class', '.shop-loop-head' );

        return $localized;
    }

    add_filter('woodmart_localized_string_array', 'wd_change_scroll');
}

d) Shall I try to use this NEW updated code on our Live site, which is currently on theme version 6.2.6 (in place of previous code that is in point 12 a) )
Will this New code work or not with the theme version 6.2.6 also, or not

Please suggest

Regards

• This reply was modified 1 year, 10 months ago by harshwe.

Hello,

12a, b, c) Yep, you are right!

d) No, this new code will work for the 6.5+ theme update.

For the 6.2.6 update, you can try to replace the old code with the below one.

if ( ! function_exists('wd_change_link') ) {
    function wd_change_link() {
        return '.shop-loop-head';
    }

    add_filter('woodmart_ajax_scroll_class', 'wd_change_link');
}

Kind Regards

Hello Luke,

12 a-c) Thank you so much for clarifying

12 d)

For the 6.2.6 update, you can try to replace the old code with the below one…

That is really wonderful.

Haven’t thought of this smaller code for previous version also. Will surely try that on prior version too.
Much thanks for sharing that code too. Highly appreciable

Regards

12 a-c, d) You are welcome!

If you have more questions or concerns, please create new topics for each issue in the support system to avoid any confusion.

Kind Regards

[Author]

Posts