This topic has 14 replies, 3 voices, and was last updated 2 years, 11 months ago ago by Rose Tyler
Hi, I have not do anything on the website, but some problems occur: logo looks blurry on mobile.
There are some offsets on my home page:
https://gyazo.com/72ae3b132547efe0a3c07ab47c617b2d
https://gyazo.com/cc34be79e4de2b7ddeb2bfcdcdd49287
on shop page
https://gyazo.com/26ae16fcbf2fe4d77c8b2298b24ffe22
And in mobile version also
https://gyazo.com/a854fbe4f5f2f84b6d9ee0b8e51f93ad
I know that previously all this pages looked perfect.
Why does it happen and how can I stop this offsets appear?
Also the site puts a lot of load on the server (CPU Usage). Could You help to solve this problem?
Hello,
1) Set product title limit – 2 lines https://prnt.sc/23pnyua Check the product alignments now.
2) Banner hover effect “Slide right” increases the width of the banner image and it causes a difference if other banners use another hover effect. So, I changed Slide right to Zoom effect. Check now.
3) What exactly is wrong with the mobile version? I don’t understand problem here https://prnt.sc/23po6qz
4) Contact your hosting provider and ask them about reports of the queries that use a lot of CPU on your site. Provide us with these reports to find out what exactly is the reason of the issue.
Regards
1) Thank You. Now the banners look ok
3) https://gyazo.com/9280d32503758d263ea5c5e382810554
about mobile version
4) Here is the answer from our server support:
57Hello,
We recommend that you check your running process to see which programs are consuming the most resources. You can view this by running the top/htop command. Subsequently, Killing these process (‘kill’ command) should return your VPS to normal performance.
Please consider the following:
To do CPU (computational) monitoring, these commands are worthwhile.
# Takes ten CPU measures over the course of 2 minutes. Reports the breakdown of overall CPU usage into categories on the right side.
vmstat 10 12
# Shows the top ten CPU-using processes by their current/instantaneous CPU usage.
ps -A -o pcpu,ppid,tgid,comm | sort -k1 -nr | head –lines=10
# Displays the ten highest CPU using commands based on their entire lifetime.
ps -A -o cputime,ppid,tgid,comm | sort -k1 -nr | head –lines=10
Hello,
3) Are you just resize the browser or looking from real device? Because if you just resize the browser window then you need to reload the page after resize to apply mobile styles and functions.
4) We can’t do the mentioned commands from theme side. You need to do this from the cPanel or using ssh access to your site. So, we need just screenshot of the results of these commands.
Regards
Olga, You are right, the mobile version now looks ok, except for the logo.
https://gyazo.com/19dca96cdde1022e8fad10d31d22fcfa
https://gyazo.com/3b3edd6d69e2ef722430c1134b987209
Hello,
We can do nothing with the logo image. We would recommend you to use image of better quality.
We’ll be waiting for the results.
Regards
Ok, Olga, I’ll try. Thank You
Hello,
You are welcome.
Regards
Olga, I have uploaded the best quality and set the logo width 165 both for mobilу and desktop. But still the logo on mobile looks blurry. What else can I do?
Hello,
Create image 332 px width. Don’t recommend you to use odd width for the images because that 1 px causes issues as a rule during resizing.
And maybe even provide us with your PSD or Figma project where you created your image. We’ll check it in more detail.
Regards
I create my designs in Canva.
I have created an image with 332 px width and set 332 width for mobile and desktop.
Now the desktop logo looks blurry and the logo in mobile is perfect!
Hello,
Go to header builder settings and set the logo width to 166px instead of 165.
Regards
Now it’s ok. Thank You. Is there a way to make the logo bigger on a desktop version?
Hello,
You’re welcome!
We can’t login – https://prnt.sc/25o2jeq
You can change the width of the logo element into the header content area of the Header Builder, for example – https://gyazo.com/67cc354d553bd5e069b496de5a50445e
Regards
Tagged: best selling, blurry, logo, offsets, themes, woocommerce
You must be logged in to reply to this topic.Log in/Sign up