Author Archive

Getting Google Maps API Key

All new created websites are required by Google to use an API key to access the Google Maps API services.

Billing

To use the Maps JavaScript API, you must enable billing. You can enable billing separately (see Usage and Billing) or when you get your API key.


Why do I need to generate API key?

If you’ve used Setup Wizard and imported demo content, you’ll see that your maps are probably working. This is because Setup Wizard installs you our public API key that is shared between all other Listeo installation where users just installed it or haven’t configured own API yet. Unfortunately there are limits on API calls and if they are exceeded, the maps functionality stops working. That’s why you need your own API key.


How to generate API key?

To generate your API key, you need to  access the Google Developer console. In the Google Developers Console, follow these steps:


Create Project


Generate API Key

It’s important to add your website URL to ” Accept requests from these HTTP referrers” field, make sure to add it as

http://yourpage.com/*

and

https://yourpage.com/*

Please note the * at the end, you have to add it to make it work on all your subpages.
This way all subdomains and subpages will be accepted. After adding it, click Create. It sometimes takes couple minutes to have your site accepted.

You must enable Billing on the Google Cloud Project at https://console.cloud.google.com/project/_/billing/enable Learn more at https://developers.google.com/maps/gmp-get-started

Make sure your domain is starts with http and https and has asterisks at the end as in examples abvove. Sometimes however this is not enough and you’ll see errors in Chrome Console that you’re website is not authorized to use that API. In that case, set the Key Restriction to “None


Enable APIs

Next, you will have to enable a few services for your key. Go to Overview → Google APIs and click  Google Maps JavaScript API –  Enable the service.

APIs you need to enable to get full functionality of Listeo are marked on this screenshot


Add API Key

Go to Listeo Core → Map Settings and paste your API key in “Google Maps API Key” field.

To get search functionality working correctly you have to create another key for geocoding with all required API services listed in previous section but without domain restriction.

Click here to read how search by location works →

Choosing Map Provider

Google Maps API pricing got you down? You can use alternatives like OpenStreetMaps, MapBox, Bing Maps, Thunderforest or HERE maps.

What’s more Listeo supprorts also location autocomplete feature powered by OpenStreetMap which means that you don’t need to use Google API even for this.  It’s exclusive to Listeo – not found in other themes!  We took care to develop it with best UX/UI practices and it works as good as Google’s autocomplete.

An example of map and location autocomplete field powered by OpenStreetMap:

Please note that OpenStreetMap location address suggestions work only on “type and hit enter”.  OpenStreetMap usage policy doesn’t allow generating address propositions on each key press (like Google does).  That would generate too many requests per second and could overload their servers. Technically it’s possible but OSM foundation shares their api for free so we wanted to respect their usage policy.

An example of map and location autocomplete field powered by Google Maps:


You will find all map settings in Listeo Core → Map Settings:

Setup Wizard

Listeo comes with  an excellent setup wizard that will automatically import demo data

You should see Setup Wizard page immediately after activating Listeo, if you don’t or you’ve skipped it, you can find it in Appearance Setup Wizard.

It’s pretty basic, you just need to confirm each step, the wizard will install and activate all required plugins, import all the content, and set basic options. There are few things you need to do manually after.


Importing Revolution Slider

Go to your Dashboard→ Revolution Slider and click Manual Import

In the next form upload the file extras/revolutionslider.zip from “All files & documentation” or download it from here http://purethemes.net/listeo-revolution-slider.zip


Setting Logo

The logo can be set in Appearance → Customize → Site Identity.

Theme Installation

There are two ways to install theme


Upload through WordPress

  1. Download the “Installable WordPress file only” you’ll find it here
  2. Navigate to  Appearance → Themes → Add New → Upload.
  3. Follow the instructions on the screen, select the downloaded theme folder (“listeo.zip”).
  4. Hit Install Now and the theme will be uploaded and installed.

Once the theme is uploaded, you need to activate it. Go to  Appearance → Themes and activate Listeo.

Upload through FTP

  1. Extract the “listeo.zip”
  2. Open up your FTP manager and connect to your hosting
  3. Browse to wp-content/themes
  4. Upload the Listeo theme folder.
  5. Log Into WordPress and go to Appearance – Themes
  6. Find the Listeo and click activate