Google map looks weird on large desktop screen

[businessbackpacker]

Is there any way to program this to scale better? Looks great on phone but not on desktop http://mangrovetreethailand.com/contact/

Also is there a way on this and main page to make icons hyperlink?

[ruenel]

Hello @businessbackpacker,

Thanks for posting in!

I have checked your page and I can see that you have used two section elements for the map and for the text separately. This is why they are just stacked below each other. If I were to recreate the page, I would use only one section element with a row of two columns. I will place the map element on the left and the text on the right column. In this layout, the two columns will just collapse stacked below each other on smaller screens.

Which icon do you want to link? I would recommend that you use the button element. Remove the background styling and enable the Graphic setup in the button element.

Once enabled, you should be able to select which icon you would want to use along with the button link. You can even disable the Text setup so that on the select icon will display.

Hope this helps.

[businessbackpacker]

I mean that the embed code is simply stretching a small section across a very large screen - it looks fine on the phone but not on the desktop - I don’t know if I should change the embed coordinates so it will allow to scroll or capture a larger area, or what. Did you look at the link on a desktop?

[businessbackpacker]

Also I am using the classic embed so the screenshot you put in does not apply can you all please actually check the page bc it doesn’t help offering advice if you don’t see what I am talking about. I looked up another solution to change embed code h and w to 100% will try that

[businessbackpacker]

also nobody wrote back about how to hyperlink the icons on main and contact page
if you can pls reply

[lely]

Hi @businessbackpacker,

@businessbackpacker

I mean that the embed code is simply stretching a small section across a very large screen - it looks fine on the phone but not on the desktop - I don’t know if I should change the embed coordinates so it will allow to scroll or capture a larger area, or what. Did you look at the link on a desktop?

Yes, I can see the issue that it is ZOOM to a very small area. Please adjust the ZOOM LEVEL settings of the map embed code.

@businessbackpacker

also nobody wrote back about how to hyperlink the icons on main and contact page
if you can pls reply

@RueNel, gave a suggestion on how to link the ICONS. It is on his reply above with a screenshot.
Here’s a screencast on how to do it: https://screencast-o-matic.com/watch/cq6Z69uHgw

Hope this helps.