Beer Mapping Informational Widgets
We have now added yet another way that you can take content from The Beer Mapping Project and add it to your site.
Our newest “Widget” will contain pertinent information about a location in our database. All locations are available to be used in a widget, you simply have to click the proper link on the review page to have the ability to copy and paste the code into your site.
The code for this widget is all in javascript, so you don’t have to worry about iframes or php code. We have done our best to ensure that this widget will not interfere with any other css or styling that is being used on your page.
For an example, of how the widget works, you can check it out in use below. We have selected the Russian River Brewing Company. All you have to do is click the “widget button” (image of review button below) on the review page of a location you are interested in featuring, then copy and paste the code into the html (or blog post) of your site.
The widget will show phone number and address information, the url of the location featured, a thumbnail of the highest scored image we have in our database for that location, and it will also display the coordinates available that will serve as a link to this location on a map.
The widget will conform to the height of the thumbnail image (unless closed) and it will conform to the width of the area of your site where the code for the widget is placed.
p.s. I stole the idea and a lot of the code from crunchbase. I hope they don’t sue me!
5 Responses to “Beer Mapping Informational Widgets”
Leave a Reply










Neat widget. It is good that it shows all the information on an object or company.
What js framework do you use?
We are not using any javascript framework for this application.
Pretty cool! I’m going to play around with this widget on my site.
If you want to force the widgets to always stay closed on your site until a user clicks the “open” button, you can copy and paste this code (remove the space before the word “script” in this line of code) above where you are putting the widget to make that function happen:
< script type="text/javascript">document.cookie = “bmp_widget=false”;< /script>