Home › Forums › Themes Support › Claue › Mobile device issues, mainly about appearance view.
- This topic has 8 replies, 2 voices, and was last updated 3 years, 12 months ago by Nina M.
-
AuthorPosts
-
-
May 21, 2020 at 9:52 pm #36525Nina MSupport 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. -
May 21, 2020 at 10:42 pm #36531Nina MSupport 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. -
May 21, 2020 at 10:45 pm #36535
-
May 21, 2020 at 10:53 pm #36537HarrySupport 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 -
May 22, 2020 at 7:04 am #36545Nina MSupport 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
-
May 22, 2020 at 12:45 pm #36557HarrySupport 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 -
May 22, 2020 at 3:16 pm #36560Nina MSupport 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. -
May 22, 2020 at 11:43 pm #36574HarrySupport 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 -
May 23, 2020 at 3:27 am #36579Nina MSupport Expired
Ok… thanks for your response and help.
-
-
AuthorPosts
You must be logged in to reply to this topic.