In previous article I discussed about loading the Google map on a HTML page, adding-removing the markers and displaying info windows. In this article we are moving to the next step, here we are going to load markers from PHP generated XML file, and we will edit/save marker information into the database, finally creating a total custom map for the website.

I wanted to create my own custom Google map for my other website, so I’ve been playing with Google Map JavaScript API v3 lately. I wanted to add some basic functionality to the map, where I could add/remove markers, as well as save marker with some information in the database. Since most of us use jQuery in our websites, I have also added jQuery support for some events and Ajax requests.

Today let’s create a cool looking responsive share buttons for your website contents, which will be adjusted according to the users’ screen size. If you are not satisfied with your current share buttons, you can try this solution. Advantage of creating own set of share buttons is that, you can modify it to your heart content to fit your layout. And you don’t have to rely on bulky scripts that are loaded from anonymous servers, which could also slow down your page significantly.

All modern browsers now support CSS3 effects, all we need is one line of CSS to achieve smooth drop shadow effect from HTML block elements, no more Photoshop images! Some older browsers like Firefox 4, Safari 5.1 or Chrome 10 still requires vendor prefixes for this to work.