I have a (Header logo) element added to my header. I set an SVG image for this. When I check the different (viewports) for this header, the SVG image gets resized properly except when the (Phone viewport) is selected.
Website URL: https://www.wheredoitakethekids.com/
Instructions:
1) Load the website URL in a browser on a laptop
2) Load the website URL in a browser on a mobile phone
3) Compare the logo images. The logo image is the handwritten (Where Do I Take the Kids?).
Hello !
For SVG you will have to edit the size from here on each viewport: https://www.screencast.com/t/bgKUmTWDQ
Thank you !
I couldn’t get your advice to work. No matter what I put in (SVG width) field for the (Phone viewport) tab, the image doesn’t resize. I don’t see the change on my laptop or on my phone when I tested it out.
I tried using the following values for the (SVG width): 50%, 10%, and auto.
But even in the (Cloud Templates -> Tagdiv Composer) the image doesn’t show up correctly. Then I try on multiple mobile devices, Google Pixel 2 and some Samsung device, same thing. The image does not show up properly.
When you refresh the page, while you are in the mobile viewport, the whole header gets refreshed and the logo image is no longer selected.
Hi kevinsikora,
When you set the SVG for mobile in tagDiv Composer is displaying correctly, please try like this -> https://i.imgur.com/YaP69GZ.png
Let us know the results!
Have a nice weekend!
I’m having this issue also –
I just set a svg for the main menu and sticky.
Mobile menu and sticky –
And it’s not appearing on the mobile menu, however it does appear on the sticky mobile menu.
I’ve tried several sizes. I’ve also tried clearing the cache multiple times.
I think it is fixed – seen an option next to svg options that showed -revert to desktop options – clicked that – and it appears that the logo now works.
However – is there a best image size to start with for the SVG Files?
Thanks
Hi Chris Baird,
Using tagDiv Composer to set on a cloud header a logo, you can set a logo text, an image text or a svg, now the size is no longer a problem, you can adjust it using the theme builder.
-> https://i.imgur.com/YeaFZ4n.png -> or https://i.imgur.com/YVXFKQI.png
Thank you!
I still have an issue. I can set the (SVG width), but the image doesn’t get centered.
If I use the mobile theme, then the image gets displayed properly on a real mobile device. But, I don’t want to use the mobile theme.
Hi,
You can set the height too, you need to play a little with the settings until it will look perfect -> https://i.imgur.com/KfEBHRK.png
Thank you!
I still have this issue.
When I refresh the home page on my mobile’s browser, the correct sized and correctly placed logo shows up for a second and then it’s replaced with another larger logo that is not placed or sized correctly.
