Home Forums WoodMart – Premium Template Google map info box customization

This topic contains 5 replies, has 2 voices, and was last updated by Aizaz Imtiaz Awan Aizaz Imtiaz Awan 1 month, 4 weeks ago.

Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • #244769

    Hi,

    I have been trying to do 2 different things:

    – first, I would like to EITHER reduce the height of the info box located above the google map OR drag it down a little bit (so that it is not on the marker). Note: I would be happy if the box did not touch the two top buttons on the map (see screenshot).
    – Second, I would like this box to be transparent and add a custom color.
    I have tried to add this CSS this but it won’t work :

    .woodmart-google-map-content .reset-last-child {
    background: rgba(197,91,82,0.4);
    }

    thanks a lot for the help!
    Kind regards.

    Private Content Hidden
    Attachments:
    You must be logged in to view attached files.
    #244879

    Hello,

    I saw the screenshot you attached and visited your website. Please try adding the following Custom CSS in the Global Custom CSS area under Theme Settings >> Custom CSS.

    .woodmart-google-map-content-wrap>.woodmart-google-map-content {
    	background-color: transparent;
    	margin-top: 20px;
    }

    Best Regards.

    #244959

    Hi,

    It works pretty well, thanks.
    Last question though.

    As you can see on the video link, the map marker is located under the box.
    Two options here:
    -Reduce the height of the box
    -Keep the map settings unchanged but move the position of the map (a little bit down) so that when the page opens the map the marker is visible. (do not know whether this is possible or not). See video link for clarification.

    Thanks for your patience.
    Kind regards,

    Private Content Hidden
    #245014

    Hello,

    You are Most Welcome.

    1) Please try adding the following Custom CSS in the Global Custom CSS area under Theme Settings >> Custom CSS.

    .woodmart-google-map-content-wrap>.woodmart-google-map-content {
    	height: 170px;
    }

    2) Please provide a relevant screenshot of how you want to change the position of the map to check it myself and help you out accordingly.

    Regards.
    Xtemos Studios.

    #245024

    Hi,

    thanks for the height solution. Worked perfectly!
    Please find attached a video that shows you where I would like to place the map when the page opens (I do not want to move the map element but the position of the marker on the map). The idea is to have the marker a little lower.

    Thanks for the help. Much appreciated.

    Private Content Hidden
    #245036

    Hello,

    You are Most Welcome.

    Sorry, but it is not possible because the Map is loaded from the Google Map API key and our theme doesn’t influence.

    Best Regards.

Viewing 6 posts - 1 through 6 (of 6 total)

You must be logged in to reply to this topic.