UX/UI Experiment: Adding 'Share Buttons' To Aviator Template
Recently I went back to the UX/UI basics and started to evaluate my site. More specifically, what were my goals? What were my user goals/needs? How do my goals get achieved when the user gets what they want? One of my big needs was increased sharing of content across all different sites (e.g., Facebook, Pintrest, email). I am currently using the Aviator template from Squarespace and while it is a pretty interface, the sharing features are pretty hidden.
The icons are very small. They don't have the conventional and easily recognizable symbols -we all know what clicking on the blue 'f' is going to do. The light grey color blends-in not helping it stand out to the reader. Basically, I needed to change it. While I wanted to keep the uncluttered look of the template I needed to remind readers to share what they were reading and make it easy to do so. I looked around and the simplest option I found was through addthis.com. They are a site that provides tools to help with content engagement. Share tools, follow tools, marketing tools, trending content tool, etc. I got the free account and decided to go with the "Sharing Sidebar."
I may decide to change this but I chose the side placement over the buttons within the text for a few reasons:
1- Because of the picture and lack of clutter, it visually breaks up the site and therefore is quickly noticed.
2- I didn't want the buttons after every blog. I worried that the visual salience would be lost with the repetition. I have not done any field research on that though.
Anyway, once I got the code I went to settings --> advanced --> code injection.
Then a simple cut and paste of the code I got from addthis. I would give you the code but it is specific to each persons account.
Well there you go. Hope it helped! :)