This topic has 12 replies, 3 voices, and was last updated 6 years ago ago by Olga Barlow
Hello, dear support
I’m encountering with a problem that:
1) The mega menu text has a layout issue when displaying on small-resolution screens.
The screenshot is attached in the private section below
2) I’m just wondering if you could let me know – how can I set to make the products open in new tab, rather than open in the same page?
Thanks very much
Regards
Graham
Hello,
Sorry for the delay in answering.
1)
.menu .vc_custom_heading {
font-size: 12px !important;
}
2) You can add target="_blank"
for all links where it is required (content-product.php and content-product-slider.php files of your child theme), for example http://prntscr.com/lhqmn8
Regards
Thank you for your reply,
Could you have a check of the first code again, please?
I have tried to add the code to the theme options, however, the problem seems to be still existed.
————————————
.menu .vc_custom_heading {
font-size: 12px !important;
}
————————————
The text displays right on the medium to large screen, but it doesn’t work the same on the smaller resolution.
Thanks again
Regards
Graham
Please clear cache and check one more time.
Regards
It working perfect now
Thank you!
You’re welcome!
Regards
Hi Tyler,
Sorry to bother again, but just found another issue with the small screen (Ipad)
I’m using a plugin “a3 lazy load” to optimize the speed by lazy loading the images (which works perfectly on normal size screen desktop & mobile)
However, I just found that the product images don’t show up on the smaller resolution (For example, Ipad)
Screenshot is attached in the private section, could you pls have a check at your convenience?
Is there anything I can do to avoid such error (I do really want to keep the a3 lazy load working to have a better loading speed.)
Many thanks,
Regards
Graham
Hello, again
And may I ask if I can have the “product category images” zoomed in when hovering on?
I have applied the example URL below in the private section.
Thanks very much
Regards
Graham
Hello,
1) We don’t see that issue with images when emulating the iPad http://prntscr.com/lkrlps
2) Yes. You can add the following custom to add that zoom effect
.category-grid:hover img {
transform: scale3d(1.1,1.1,1);
-webkit-transform: scale3d(1.1,1.1,1);
}
Regards
Hi, Olga
I have applied the code in the custom CSS and tried to clear the cache, however, it doesn’t seem to take effect yet.
Could you pls have a check?
——————————————————————-
.category-grid:hover img {
transform: scale3d(1.1,1.1,1);
-webkit-transform: scale3d(1.1,1.1,1);
}
——————————————————————
BTW, awesome update of the new forum style.
Regards
Graham
And for the 1st problem:
The products images don’t display on iPad Pro or similar small-size pad,
I have deleted and re-installed the browser ( tried with Google Chrome and Firefox).
The images still seem to be disappeared
Screenshot: https://prnt.sc/lm3h6a
The product images only show up when touching the screen (enlarged version will show then)
Not sure what has caused this issue? Do you have any suggestion?
Regards
Graham
Hello,
1) Provide me screenshot of the element in your content where you used product categories and that code does not work.
2) Looks that problem is related to a3 Lazy Load plugin, if we inspect image in Chrome we can see the following styles of the plugin http://prntscr.com/lnir2v
Once I check your site in Safari I don’t see that code anymore because “lazy-loaded” class does not appear for that image. I don’t know why this happens for the Safari. Either disable that plugin or contact plugin author to solve the problem.
Regards
You must be logged in to reply to this topic.Log in/Sign up