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

Home Forums Themes Support Claue Mobile device issues, mainly about appearance view.

Viewing 8 reply threads
  • Author
    Posts
    • #36525
      Nina M
      Support Expired

      Hello Harry,

      We have issues on our Mobile device version that are okay in our computer device view.

      Could you please help us to solve these following issues about Mobile device version on our website :

      On the Homepage :

      1/ Size of the Metaslider cubics – too big vs. the image – Please see Questions 1- 2- screenshot

      2/ Space between Metaslider and the 3 “icon & text” – Please see Questions 1- 2- screenshot

      3/ Space between the 3 “icon & text” on top of the Homepage, and at the bottom of the Homepage – Please see Question 3- and 3- bis – screenshots.

      4/ About Instagram integration view : As you can see we have only one big picture on our Mobile screen. We would like to have more like a gallery, with at least 2-3 posts view, could you please help us to set up that ?

       

      Attachments:
      You must be logged in to view attached files.
    • #36531
      Nina M
      Support Expired

      Following, on the others pages :

      5/ There is a zoom out of the picture on “Category pages” on the Mobile device vs. Computer. How could we fix the wanted size on the Mobile phone please ? Please see Question 5 – Screenshot

      6/ On the product page, on the computer we can see the color text detail when we go on the color cercle. We manage to obtain just once this color info on the Mobile device (See 6-1 screenshot – “bordeaux” text) but all the other times we have nothing (See 6-2 screenshot). We would like to set up the info on the Mobile everytime, how could we do this please ?

      Thanks a lot again for your help, your responses help us a lot.

      Nina

      Attachments:
      You must be logged in to view attached files.
    • #36535
      Nina M
      Support Expired

      7/ Is it possible to move on left “Add to the cart” on the product detail page please ?

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

      Hi Nina,

      1,2. Please edit the second row on homepage and reduce space between icon and slider https://prnt.sc/sl66hg

      and add below code

      @media only screen and (max-width: 767px) {
      .metaslider .flex-control-nav {
      	bottom: 10px !important;
      }
      .metaslider.ms-theme-cubic .flexslider ol.flex-control-nav:not(.flex-control-thumbs) li a, .metaslider.ms-theme-cubic ul.rslides_tabs li a, .metaslider.ms-theme-cubic div.slider-wrapper .nivo-controlNav:not(.nivo-thumbs-enabled) a, .metaslider.ms-theme-cubic .coin-slider .cs-buttons a {
      	line-height: 10px;
      	width: 10px;
      	height: 10px;
      }}

      3. Edit the columns wrap icon and add padding bottom https://prnt.sc/sl695g

      4. Please edit plugin > claue-addons > includes > shortcode > instagram.php and change code on line 53 slidesToShow: 1 to slidesToShow: 3 https://prnt.sc/sl6c8c

      Kind regards

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

    • #36545
      Nina M
      Support Expired

      Hi Harry,

      Thanks a lot for your answers, we close 1/ 2/ 3/ and 4/ mobile device issues easily with your screenshot and instructions.

      Could you please check our last questions (5/ 6/ and 7/) ?

      Thanks so much

      Nina

       

    • #36557
      Harry
      Support Expired

      Hi,

      5. Please add more code

      @media only screen and (max-width: 767px) {
      .jas-wc .page-head {
      	background-size: contain;
      	background-repeat: no-repeat;
      }}

      6,7. I’m sorry on mobile it doesn’t have hover state when mouse over the color.
      Please add more code

      .swatch__list--item.is-selected .swatch__tooltip {
      	top: -33px;
      	opacity: 1;
      	visibility: visible;
      }
      @media only screen and (max-width: 480px) {
      form.cart .woocommerce-variation-add-to-cart .single_add_to_cart_button {
      	font-size: 13px;
      	padding: 0 23px;
      }}

      Kind regards

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

    • #36560
      Nina M
      Support Expired

      Hi Harry,

      Thanks a lot for your return.

      For 5/ please find attached the 2 screenshots, one Mobile tthe other Computer, for a better explanation of what we would like for Mobile device view. It concerns all our categories pages + all pages like About us, Contact us, Delivery & Returns….
      The code that you gave us don’t zoom up the picture and reduce the width of the picture.

      6/7/ Perfect ! Thanks a lot, it is exactly what we wanted !

       

       

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

      Hi,

      I recommend use zoom image because it will auto fill with more type of screen (desktop, tablet, mobile) so please remove code.

      It can’t zoom exact as you want. It will zoom all

      Kind regards

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

    • #36579
      Nina M
      Support Expired

      Ok… thanks for your response and help.

Viewing 8 reply threads

You must be logged in to reply to this topic.