Your account expired support, please renew to get your support.

Home Forums Themes Support Claue Adding Filter to my product categories pages

Viewing 69 reply threads
  • Author
    Posts
    • #32005
      gnikolaev11
      Support Expired

      Hi,
      I am trying to add the filter option to my product pages but it does not appear.
      I will attach screenshot for what I mean. I have enabled the filter everywhere but it still doesnt appear.
      The site is http://www.gedorra.comThe screenshot is from my site’s main shop page and I want it to be the same way for every product page I have.
      Please tell me how to do that. Thanks

    • #32009
      Harry
      Support Expired

      Hi Gnikolaev,

      Please go to Appearance > Widgets > WooCommerce Filter Sidebar and add YITH Ajax Filter widget to this sidebar area.

      If issue still there, please send us your site url and login credentials and check in “Set as private reply”. Our team will check and help you solve problem.

      Kind regards

      Harry
      Premium Wordpress themes and plugins, Best WooCommerce theme https://themeforest.net/user/janstudio/portfolio?ref=janstudio

    • #32014
      gnikolaev11
      Support Expired
      This reply has been marked as private.
    • #32015
      Harry
      Support Expired

      Hi,

      Sorry because miss understood. The filter only show on shop page and category page. It doesn’t show on single product page because it only one product it can’t query to filter other product.

      Kind regards

      Harry
      Premium Wordpress themes and plugins, Best WooCommerce theme https://themeforest.net/user/janstudio/portfolio?ref=janstudio

    • #32016
      gnikolaev11
      Support Expired

      Where did I tell you I want it on a product page? I said “Product categories pages” Meaning when you click on the “Dresses” category I want to see the filter so i can filter my products.

    • #32017
      Harry
      Support Expired

      Can you send me the link of dress category.

      The filter sidebar will show if category has more than 2 variable products. If the category has only one product the filter will not show.

      And the filter also doesn’t show on custom page.

      Kind regards

      Harry
      Premium Wordpress themes and plugins, Best WooCommerce theme https://themeforest.net/user/janstudio/portfolio?ref=janstudio

    • #32018
      gnikolaev11
      Support Expired

      Listen, you are the support, I want filter on my product pages like its in the theme demo you stated.
      https://gedorra.com/nai-prodavani/
      Here is a link, there are many variable products there and filter doesnt appear.

    • #32019
      Harry
      Support Expired

      Hi,

      As i told you the filter doesn’t support custom page it only show on category page like this https://gedorra.com/product-category/drehi/rokli/
      https://gedorra.com/product-category/drehi/aksesoari/

      http://prntscr.com/o6hsg7

      These pages generated by WooCommerce in Dashboard > Products > Categories not pages in Pages built by WPBakery PageBuilder.

      Kind regards

      Harry
      Premium Wordpress themes and plugins, Best WooCommerce theme https://themeforest.net/user/janstudio/portfolio?ref=janstudio

    • #32020
      gnikolaev11
      Support Expired

      Yes I got that but I can’t find that categories in the menu when I want to build my navigation do you know why? You see I have categories created but non of them appears when I want to add them to the main menu of the site.

    • #32021
      Harry
      Support Expired

      Please follow this video to add product category to menu https://www.youtube.com/watch?v=cdkCSls-9s4&list=UUMDvyPJs20jwKoFIO4XUF6w&index=19

      Kind regards

      Harry
      Premium Wordpress themes and plugins, Best WooCommerce theme https://themeforest.net/user/janstudio/portfolio?ref=janstudio

    • #32024
      gnikolaev11
      Support Expired

      Thanks for the help mate! I have some other requests and questions, should I ask here for them or? If yes, I will go one by one. First is how can I increase the icons in the header size (social icons,search icon etc) and how can I decrease the space between phone number and logo. I will attach screenshot. Thanks

      Attachments:
      You must be logged in to view attached files.
    • #32027
      Harry
      Support Expired

      Hi,

      Please add below code to Claue > Theme Option > General Layout > Custom CSS

      .jas-social i {
      	font-size: 20px;
      }
      .jas-action i {
      	font-size: 28px;
      }
      .header__top {
      	padding: 5px 15px 0;
      }
      .header-text h6 {margin-bottom: 0;}

      Kind regards

      Harry
      Premium Wordpress themes and plugins, Best WooCommerce theme https://themeforest.net/user/janstudio/portfolio?ref=janstudio

    • #32028
      gnikolaev11
      Support Expired

      I set the padding to “0” for the top bar but still there is some space? Also please look at the screenshot. The phone number appears but the text before doesnt.

      Attachments:
      You must be logged in to view attached files.
    • #32030
      Harry
      Support Expired

      Hi,

      Please remove h6 wrap promo text or add below code

      .header-text h6 {margin-bottom: 0; color: #ffe9de;}
      .header__mid .jas-row {padding-top: 0;}

      Kind regards

      Harry
      Premium Wordpress themes and plugins, Best WooCommerce theme https://themeforest.net/user/janstudio/portfolio?ref=janstudio

    • #32031
      gnikolaev11
      Support Expired

      I set the h6 as the letters were to small, if there is other way to increase their size please tell me 🙂

       

    • #32032
      Harry
      Support Expired

      To increase font size please use below code

      .header-text {font-size: 16px;}

      Regards

      Harry
      Premium Wordpress themes and plugins, Best WooCommerce theme https://themeforest.net/user/janstudio/portfolio?ref=janstudio

    • #32033
      gnikolaev11
      Support Expired

      Thanks you are great!
      Moving on to the next thing. When I open any product, variations are previously selected. Please tell me how to fix that. I have attached a screenshot.

      Attachments:
      You must be logged in to view attached files.
    • #32035
      Harry
      Support Expired

      Please edit product and change default value like this http://prntscr.com/o6jdkf

      Kind regards

      Harry
      Premium Wordpress themes and plugins, Best WooCommerce theme https://themeforest.net/user/janstudio/portfolio?ref=janstudio

    • #32036
      gnikolaev11
      Support Expired

      Thanks. Next thing I want to ask about is the checkout page. Is there a way to customize it as I want to change a couple of things there. I want to change the way things are positioned and also I will attach a screenshot with the 2 blue fields that appear. Can we remove the blue and for the coupon code field to only leave the grey field and remove the blue one and put it on the bottom of the page.

      Attachments:
      You must be logged in to view attached files.
    • #32038
      Harry
      Support Expired

      Hi,

      I’m sorry. For this case it can’t because it need click to text to show grey field. By default the grey field hidden.

      Kind regards

      Harry
      Premium Wordpress themes and plugins, Best WooCommerce theme https://themeforest.net/user/janstudio/portfolio?ref=janstudio

    • #32039
      gnikolaev11
      Support Expired

      Why? Isnt that page built by you? So there should be a way to fix that. Isnt there a way to build a whole new checkout page as this one is no good for me. Everything is messed up and because of these blue fields it becomes extremely long.

    • #32040
      Harry
      Support Expired

      Hi,

      These fields generate by plugin WooCommerce not our theme.

      You can remove 2 fields by add below code to claue-child > functions.php

      add_action( 'wp_head', 'customize_checkout_page' ); 
      function customize_checkout_page(){
      remove_action( 'woocommerce_before_checkout_form', 'woocommerce_checkout_login_form', 10 );
      remove_action( 'woocommerce_before_checkout_form', 'woocommerce_checkout_coupon_form', 10 );
      }

      but can’t move grey form to bottom.

      Kind regards

      Harry
      Premium Wordpress themes and plugins, Best WooCommerce theme https://themeforest.net/user/janstudio/portfolio?ref=janstudio

    • #32041
      gnikolaev11
      Support Expired

      Okay but cant I create a whole new checkout page with some plugin and mark it as the checkout page in woocommerce settings?

    • #32042
      Harry
      Support Expired

      It doesn’t have plugin to you create new page and assign as checkout page. It only have plugin to customize fields of address.

      Kind regards

      Harry
      Premium Wordpress themes and plugins, Best WooCommerce theme https://themeforest.net/user/janstudio/portfolio?ref=janstudio

    • #32043
      gnikolaev11
      Support Expired

      Well I cannot understand. That checkout page is created by you. Thats not a default woocommerce page so why arent we able to change the checkout layout when I dont like it ? it doesnt suit my suit in any way possible. 1 checkbox is big, 1 is small is super random.

    • #32047
      Harry
      Support Expired

      Hi,

      You mean the sample content. The sample content create by us but the page layout use only code [woocommerce_checkout] and it generate checkout page. It is required and default of WooCommerce.

      Kind regards

      Harry
      Premium Wordpress themes and plugins, Best WooCommerce theme https://themeforest.net/user/janstudio/portfolio?ref=janstudio

    • #32066
      gnikolaev11
      Support Expired

      Okay. Moving on to the next things.
      1.Why when I hover over products it says “Options” but not “Add to cart” ( screenshot attached)
      2.Why sizes in my filter are L,M,S instead of S,M,L when I have set the order to be S,M,L (screenshot attached)
      3.Why one product’s photo flips when hovering and other don’t its random. I want all images to flip to second one when hovering ( screenshot attached)
      4.On mobile the “Add to cart” button goes out of the button area and looks bad (screenshot attached)
      5.Also on mobile, the newsletter in the footer button looks strange as it is not alligned with the box.( screenshot attached)
      6.On mobile when you open a category , all of the categories appear under the main menu. When sliding these categories they dont stop with the last categories but keep on sliding for infinity which is not good as there is just a white field left.(screenshot attached).

      Attachments:
      You must be logged in to view attached files.
    • #32076
      Harry
      Support Expired

      Hi,

      1. Because your product have more variations so user need select variation before add to cart. If your product is simple product it will show add to cart button.

      2. Please go to Product > Attributes > Size > Config Term and drag to re-order http://prntscr.com/o7izvw

      3. Please upload the image you want so on hover in 1st in product gallery

      4,5,6. Please add below code to Claue > Theme Option > General Layout > Custom CSS

      
      .signup-newsletter-form input.input-text {
      	width: calc(100% - 130px);
      }
      @media only screen and (max-width: 1024px) {
      .product-image .product-btn .button {
      	display: block;
      }
      .yith-wcwl-add-to-wishlist ~ .product-btn {
      	top: 40% !important;
      	left: 50%;
      	transform: translate3d(-50%, -50%, 0);
      }
      .btn-quickview::after {
      	left: 9px;
      	top: -7px;
      }
      }
      @media only screen and (max-width: 736px) {
      .shop-top-sidebar .woocommerce {
      	min-width: 550px;
      }}

      Kind regards

      Harry
      Premium Wordpress themes and plugins, Best WooCommerce theme https://themeforest.net/user/janstudio/portfolio?ref=janstudio

    • #32089
      gnikolaev11
      Support Expired

      1.I have arranged the sizes just like that but still appear in reverse order ( You can see screenshot attached)
      2.Add to cart button problem still remains after I pasted the code. ( You can see it bellow too)
      3.There is some problem on mobile, the “Options” button appears over the image withouth hovering and just stays there and the “quick view” button cannot be even seen. I want it to be like on the pc version. To appear when hovering. Idk why that happens.( See screenshot)
      Thanks

      Attachments:
      You must be logged in to view attached files.
    • #32105
      Harry
      Support Expired

      Hi,

      1. Please go to Yith plugin > Ajax Filter and follow this screenshot http://prntscr.com/o7vrfu

      2. Please change prev code to

      .signup-newsletter-form input.input-text {
      	width: calc(100% - 130px);
      }
      @media only screen and (max-width: 1024px) {
      .product-image .product-btn .button {
      	display: block;
      }
      .yith-wcwl-add-to-wishlist ~ .product-btn {
      	top: 40% !important;
      	left: 50%;
      	transform: translate3d(-50%, -50%, 0);
      }
      .btn-quickview::after {
      	left: -27px;
      	top: 7px;
      }
      }
      @media only screen and (max-width: 736px) {
      .shop-top-sidebar .woocommerce {
      	min-width: 550px;
      }}
      @media only screen and (max-width: 480px) {
      form.cart .woocommerce-variation-add-to-cart .single_add_to_cart_button {
      	width: calc(100% - 165px);
      	font-size: 12px;
      	padding: 0 15px;
      }}

      3. I’m sorry on mobile it support hover not good for all device some device it work some device it not work, so we show button not on hover.

      Kind regards

      Harry
      Premium Wordpress themes and plugins, Best WooCommerce theme https://themeforest.net/user/janstudio/portfolio?ref=janstudio

    • #32117
      gnikolaev11
      Support Expired

      So what should I do about number 3 I mean the “Quick Look” option cannot even be seen and the product photos cannot be seen from that “Options” button.

    • #32118
      gnikolaev11
      Support Expired

      It wasnt like that before man I mean before only the wishlist and eye icons appeared and the buttons didnt. How isnt there a way for the buttons to appear on hover I mean thats one of the functions I liked the most and choosed the theme for in the first place and now I cannot use it?

    • #32120
      Harry
      Support Expired

      Hi,

      Please change prev code to

      .signup-newsletter-form input.input-text {
      	width: calc(100% - 130px);
      }
      @media only screen and (max-width: 1024px) {
      .product-image .product-btn .button {
      	display: block;
      }
      .yith-wcwl-add-to-wishlist ~ .product-btn {
      	top: 50% !important;
      	left: 50%;
      	transform: translate3d(-50%, -50%, 0);
      }
      .btn-quickview::after {
      	display: none;
      }
      .btn-quickview {
      	text-indent: 0;
      	background: #fff;
      	border: none;
      	padding: 0;
      	font-size: 13px;
      }
      }
      @media only screen and (max-width: 736px) {
      .shop-top-sidebar .woocommerce {
      	min-width: 550px;
      }}
      @media only screen and (max-width: 480px) {
      form.cart .woocommerce-variation-add-to-cart .single_add_to_cart_button {
      	width: calc(100% - 165px);
      	font-size: 12px;
      	padding: 0 15px;
      }}

      Kind regards

      Harry
      Premium Wordpress themes and plugins, Best WooCommerce theme https://themeforest.net/user/janstudio/portfolio?ref=janstudio

    • #32128
      gnikolaev11
      Support Expired

      Thats not good at all mate I mean you cant even see the product from the buttons. If you cannot make it to happen on hover I prefer only having the wishlist heart and eye icon as now you cant see the product at all.

    • #32132
      Harry
      Support Expired

      If you want revert like original please change prev code to

      .signup-newsletter-form input.input-text {
      	width: calc(100% - 130px);
      }
      @media only screen and (max-width: 736px) {
      .shop-top-sidebar .woocommerce {
      	min-width: 550px;
      }}
      @media only screen and (max-width: 480px) {
      form.cart .woocommerce-variation-add-to-cart .single_add_to_cart_button {
      	width: calc(100% - 165px);
      	font-size: 12px;
      	padding: 0 15px;
      }}

      Kind regards

      Harry
      Premium Wordpress themes and plugins, Best WooCommerce theme https://themeforest.net/user/janstudio/portfolio?ref=janstudio

    • #32133
      gnikolaev11
      Support Expired

      Okay thanks. I want to ask can we put a button under the product’s price, like add to cart button which i can then translate in my language so there can be a call to action button. Also please tell me how can I change the background color of the menu on mobile and the background of the cart page which appears on the side, right after you add a product to the cart. Now the color is white but I want it to be #ffe9de

    • #32142
      Harry
      Support Expired

      Hi,

      1. Please follow this topic to move button under price http://support.janstudio.net/forums/topic/down-the-add-to-cart-and-quick-view-products/

      2. You can change the text by go to Loco > plugins > woocommerce

      3. Please add below code to claue > theme option > general layout > custom CSS

      .jas-push-menu {
      	background: #ffe9de;
      }

      Kind regards

      Harry
      Premium Wordpress themes and plugins, Best WooCommerce theme https://themeforest.net/user/janstudio/portfolio?ref=janstudio

    • #32287
      gnikolaev11
      Support Expired

      Thanks! Is there something we can do about the loading after checkout is done? Now there is just a white window that appears and you have to wait but it seems confusing as it stays with no indication that anything happens.
      Also the instagram images appear with bad quality on mobile, can we do something about that too? Thanks

    • #32295
      Harry
      Support Expired

      Hi,

      1. please try this plugin https://wordpress.org/plugins/yith-custom-thank-you-page-for-woocommerce/

      2. Please edit file instagram.php in plugins > claue-addons > includes > shortcodes and change code of line 53

      SlidesToShow: 2

      http://prntscr.com/ob6ib0

      Kind regards

      Harry
      Premium Wordpress themes and plugins, Best WooCommerce theme https://themeforest.net/user/janstudio/portfolio?ref=janstudio

    • #32358
      gnikolaev11
      Support Expired

      The images buttons appear once again on mobile and it looks bad. You can see in the screenshot.

      Attachments:
      You must be logged in to view attached files.
    • #32360
      Harry
      Support Expired

      I still see the code in Theme Option > General Layout > Custom CSS

      Please remove the code below

      .product-image .product-btn .button {
          display: block;
      }

      Regards

      Harry
      Premium Wordpress themes and plugins, Best WooCommerce theme https://themeforest.net/user/janstudio/portfolio?ref=janstudio

    • #33267
      gnikolaev11
      Support Expired

      The problem still persists. You can see screenshot. Also in the screenshot I want to know how can I remove the categories heading picture before the products.Ive circled it too.

      Attachments:
      You must be logged in to view attached files.
    • #33271
      Harry
      Support Expired

      Hi,

      1. please edit the code you add

      .btn-quickview {
      text-indent: inherit;
      }

      to

      @media only screen and (max-width: 1024px) {
      .btn-quickview {
      	text-indent: -999em;
      }
      .product-image .product-btn .button {
      	display: block;
      	left: 50%;
      	transform: translateX(-50%);
      }}

      Kind regards

      Harry
      Premium Wordpress themes and plugins, Best WooCommerce theme https://themeforest.net/user/janstudio/portfolio?ref=janstudio

    • #33322
      gnikolaev11
      Support Expired

      Please look at the problem seriously I edit it for the 5th time and it still is broken.You can enter the site from mobile and see

    • #33323
      gnikolaev11
      Support Expired

      Also I want to try how a transparent header will look and I enable that but nothing happens.

    • #33325
      Harry
      Support Expired

      Hi,

      1.My screen on my phone it work well

      2. Please add below code to make header transparent work.

      @media only screen and (min-width: 1025px) {
      .home #jas-content { margin-top: -173px;}}

      Kind regards

      Attachments:
      You must be logged in to view attached files.

      Harry
      Premium Wordpress themes and plugins, Best WooCommerce theme https://themeforest.net/user/janstudio/portfolio?ref=janstudio

    • #33450
      gnikolaev11
      Support Expired

      1, That code didnt make the header transparent.
      2.See screenshot to see the mobile version. The options button still appears.

      Attachments:
      You must be logged in to view attached files.
    • #33452
      gnikolaev11
      Support Expired

      I just want the hover on products to be like it was in the beggining like its on the original theme Claue

    • #33458
      Harry
      Support Expired

      Hi,

      1. It issue because you have redundant code you did before, i removed and it now work

      2. I make it work on your site.

      Kind regards

      Harry
      Premium Wordpress themes and plugins, Best WooCommerce theme https://themeforest.net/user/janstudio/portfolio?ref=janstudio

    • #33461
      gnikolaev11
      Support Expired

      Okay thanks, A few more things.
      1.Can we remove the white line that appears in the header now?
      2.Can we make the header transparent for mobile too?
      3.When hovering on a product, the options button still appears and it seems to be left aligned.Please remove it or tell me how to.

    • #33465
      Harry
      Support Expired

      1,2. Please add below code to Custom CSS

      .home .header__bot .jas-navigation {
      border-top: none;
      }

      @media only screen and (max-width: 1024px) {
      .home #jas-content { margin-top: -101px;}
      }

      3. I fixed on your site.

      Regards

      Harry
      Premium Wordpress themes and plugins, Best WooCommerce theme https://themeforest.net/user/janstudio/portfolio?ref=janstudio

    • #33469
      gnikolaev11
      Support Expired

      Mobile is still not transparent and the top bar is now missing.
      Please see screenshot for the missing top bar

      Attachments:
      You must be logged in to view attached files.
    • #33471
      gnikolaev11
      Support Expired

      Please look at all of the custom css codes and see if there is any unnecessary as we did a lot of edits and some may have left.Thanks

    • #33472
      gnikolaev11
      Support Expired

      As far as I can see you just made the banner cover the header with the -173 margin-top and that way when the page loads I firstly see the pink header and then it becomes transparent and it cannot be like that.

    • #33473
      Harry
      Support Expired

      Hi,

      I see you did not add code for mobile. I changed the code t see top bar on desktop and mobile.

      The site need time to load

      Kind regards

      Harry
      Premium Wordpress themes and plugins, Best WooCommerce theme https://themeforest.net/user/janstudio/portfolio?ref=janstudio

    • #33481
      gnikolaev11
      Support Expired

      Okay,
      Please see screenshot that I have attached. How exactly can I do that. WHat is the section that I have to add from the editor to make it like that and also the timer. Thanks

      Attachments:
      You must be logged in to view attached files.
    • #33483
      gnikolaev11
      Support Expired

      Also please see attached video and see what happens when I refresh the home page.

      Attachments:
      You must be logged in to view attached files.
    • #33485
      Harry
      Support Expired

      Hi,

      1. Please add row with 3 columns with 2 “promotion banner” and “product” element and choose sale product https://prnt.sc/p2qmkj for product element please check in “Enable countdown for sale product” https://prnt.sc/p2qntv and set schedule sale for product https://prnt.sc/p2qomz

      2. I’m sorry please try optimize image at https://tinypng.com/ the image have big capacity and always need more time to load than text and other content. Please go to Claue > Theme Option > General Layout > Enable Preload.

      Kind regards

      Harry
      Premium Wordpress themes and plugins, Best WooCommerce theme https://themeforest.net/user/janstudio/portfolio?ref=janstudio

    • #33486
      gnikolaev11
      Support Expired

      2.That didnt work, I optimized it and it still happens.It seems like the previous pink header appears and then the transparent appears.

    • #33493
      Harry
      Support Expired

      I’m sorry the image always need more time to load than other content so can’t get rid of it.

      Kind regards

      Harry
      Premium Wordpress themes and plugins, Best WooCommerce theme https://themeforest.net/user/janstudio/portfolio?ref=janstudio

    • #33505
      gnikolaev11
      Support Expired

      So why wasnt it like that before and it is like that now? I optimized the images and its the same and I dont think the problem is the image but the transparent header. When reloading you can see the previous pink header not the image appearing.

    • #33509
      Harry
      Support Expired

      If use don’t use header transparent the header still place in its position, when you enable header transparent, the content will show under header so you see the effect.

      Regards

      Harry
      Premium Wordpress themes and plugins, Best WooCommerce theme https://themeforest.net/user/janstudio/portfolio?ref=janstudio

    • #33510
      gnikolaev11
      Support Expired

      Is that your solution? Its your theme and you should fix that to be honest. Your solution is “just dont use header transparent” well I want to use it but dont want to see the old header under it. Thats something easy to do for sure I have never seen that happen with other themes.

    • #33515
      Harry
      Support Expired

      Please try add new more code

      .home #jas-header {height: 0; position: relative;}

      Kind regards

      Harry
      Premium Wordpress themes and plugins, Best WooCommerce theme https://themeforest.net/user/janstudio/portfolio?ref=janstudio

    • #33518
      gnikolaev11
      Support Expired

      That did not change anything unfortunately.

    • #33548
      gnikolaev11
      Support Expired

      ????

    • #33604
      gnikolaev11
      Support Expired

      Will you please answer? I have paid to have support and get no answer..

    • #33622
      Harry
      Support Expired

      Hi,

      Sorry for late reply.

      We search solution and now we make header load slower than other element on your site. Please check and let me know.

      Kind regards

      Harry
      Premium Wordpress themes and plugins, Best WooCommerce theme https://themeforest.net/user/janstudio/portfolio?ref=janstudio

    • #33666
      gnikolaev11
      Support Expired

      You made it even worse…Why would I need the header to load slower then the other things? Do you even see how it looks when you do it? Please reverse as it was before you did that change.

    • #33667
      Harry
      Support Expired

      Sorry. I reverted to default.

      Harry
      Premium Wordpress themes and plugins, Best WooCommerce theme https://themeforest.net/user/janstudio/portfolio?ref=janstudio

Viewing 69 reply threads

You must be logged in to reply to this topic.