How to Make Your Ning Site Location Aware

Post date: Mar 31, 2014 9:15:56 PM

Add a Ning Powered Location Widget

If you have looked around for a simple location aware widget to add to your Ning network, you have probably seen all sorts of garbage widgets loaded with ads and flash junk. This is why i have been working on a HTML5 solution that can be hosted on Ning's servers and not depend on external resources that make pages heavy. Below is a single block of code which will iframe the widget into your HTML box.

Code for Location Widget

Example of Ning Powered Location Aware Widget [View Demo]

(FYI educators and students are free to join BNation and follow the Voyage)

Code For Ning-Powered/Hosted Iframed Location Widget

Just paste that code into a HTML box inside your page and adjust accordingly. The index.html file is attached below for those who might like to dissect it and make modifications.

Why "Ning Powered"?

When I say "Ning Powered" I mean all scripts and styles have been hosted on Ning servers so it should not weigh your site pages down like the other garbage out there. I am also working on a version that will not require your member to retrieve geolocation from their browser (which will be better for schools and private locations).

I figured I would share this with you all because I find it extremely helpful as a Community Manager who enjoys experimenting with web mapping and geolocating resources.

Some Practical Uses For Geolocation:

Finding locations to add to Photos and Videos on Network

Allowing members to provide more accurate locations to profiles and Groups

More Ning Design Help

UPDATE: as an exercise, I pretended that I had never done this before and followed my own tip to add slightly modified version of this to the bottom of Beautiful Nation Project as a demo.

As always, if you are ever in need of Ning Help, feel free to get in touch with me. Always happy to assist Ning cummunity managers with their networks.