Homeonline course

How to add a google map to your WordPress blog or website

Your website or blog in WordPress and the first thing we want to do is I’m not going to have a location or map page on this site.

But I’m going to add one just for demonstration purposes¬† so what you would do is go your WordPress and you can actually search for a plug-

in there are two ways to do ;it so let me give you a demonstration of this real quick so what you would do is let’s just type in map let’s see what pops up and there you go the first one is WordPress Google maps there’s a bunch of other ones some; of them have may have different features but I’m not going to use any plugins what add a google map I’m going to do is go straight to google maps but first I want to add a map page so click add new on the pages you can type in location maps.

WordPress google maps shortcode

I’ll just type in actually I’ll type in area and google maps . Com which I have done and if you have a business you can add your exact address here I’m just going to use a general location right here in the Midwest Fort Wayne Indiana.

I could use Fort Wayne International airport if that were my business but I’m going to use Fort Wayne Indiana as my address and what you want to do is down here at the bottom is this little gear the settings tab you want to click that and go to ;

word-press map plugin multiple locations

the google maps api server rejected your request wordpress

share or embed map now if you just wanted to share it with a link in an email or something to somebody you can use that but we want to embed the map and object small size, and then this is the code we need to copy I’m not close that out come over here and you want to make sure there is a visual by default that’s a what-you-see-is-what-you-get and then there is the text you always want to copy –

and paste your codes into the text so click paste now you can click over to visual this is where your map will be I mean you can add content to the top.

Contact form with google map wordpress plugin

If you want or the bottom whatever you’d like to do with your website, and we’re going to click publish and view page, and now we have a location map now on a location map and actually on every page on this website.

I don’t want the sidebar here that pops up by default and so real quick I’m gonna show you how to disable that so go to edit page and that’s right over in here default template has the sidebar here’s all your options.

I want a full-width page no sidebar so update that and view page and there you go you can see our map and there’s no sidebar if I want to Center this .I can Center it but let’s just check and see what this would look like on mobile or a smaller device, so this would be about what a cell phone would look;

Responsive google map plugin for word press

like and as you can see it’s hanging over and so| what we want to do is fix that so here’s how we do that we can go back to edit page and also if you wanted to move your map to the center you can do that by doing that .

let’s go ahead and update that page and now our map goes clear across to the center of our page from end to end and then also in a mobile version you can see that it’s nicely perfect in the center on a

Comments (0)

Leave a Reply

Your email address will not be published. Required fields are marked *