Save to foursquare Button

This post is for @Suzy_00 about adding a save to foursquare button.

 

 

Adding the button is pretty easy. You just copy and paste in some script. You can find the button and script here. This button will add a “To do” on the list of the foursquare users that push it. IF your place offers wifi for customers perhaps a check in button would be better. Using the right button for your users is key in getting the interaction you seek.

 

The hCard mark up is probably the easiest mark up as openGraph requires you to set up a fb app. We sill use that.  You can find the instructions here. You can even debug! Just prepare this in your site so foursquare can find your venue. I would find your venue info on foursquare so can match the info exactly. Here is the code for Blue Agave Club in Pleasabton, CA. And don’t forget to claim your venue!

 

<div class=”locInfo vcard”><img class=”locMarker” src=”http://suzy.antonioortegajr.com/wp-content/themes/Wine/logo.png” alt=”” />
<h4><span class=”fn”>Blue Agave Club</span></h4>
<p class=”adr”><span class=”street-address”>625 Main St.</span> <span class=”locality”>Pleasanton</span>,<span class=”region”>CA</span> <span class=”postal-code”>94566</span></p>

 

Then place this where the button should go.

<!– Place this anchor tag where you want the button to go –>
<a href=”https://foursquare.com/intent/venue.html” class=”fourSq-widget” data-variant=”wide”>Save to foursquare</a>

 

This script goes after the button. The footer would be good. Any place after the button is fine though. For example in a widget on the right hand side bar.

 

<!– Place this script somewhere after the anchor tag above. If you have multiple buttons, only include the script once. –>
<script type=’text/javascript’>
(function() {
window.___fourSq = {“uid”:”260927″};
var s = document.createElement(‘script’);
s.type = ‘text/javascript’;
s.src = ‘http://platform.foursquare.com/js/widgets.js’;
s.async = true;
var ph = document.getElementsByTagName(‘script’)[0];
ph.parentNode.insertBefore(s, ph);
})();
</script>

 

IF you wan to use this for another venue just copy and paste the code with the hcard tags and edit the name, address, etc.

The final product should look and act like something like this:

 

Blue Agave Club

625 Main St. Pleasanton,CA 94566

Save to foursquare