2012 December 09 Archive - EXEIdeas

After the removing of facebook official share button, her is an alternative to that that is simple and awesome, it’s for both like blogger and website. It’s not a official widget, It’s devolp by a third party.What Is It?The sharecount button for Facebook displays the number of times the current page has been shared on Facebook and allows visitors to share it themselves. Inspired by the popular Retweet buttons, it was built by us folks behind awe.sm on top of new data API.How It Works?awe.sm is a campaign tracking platform for social media that generates a unique link every time someone shares content through our system. Since each link is encoded with metadata about the share action it represents, including the channel for which it’s destined (e.g. Twitter or Facebook or LinkedIn, etc), it’s very easy to find out how many times a given URL has been shared to a given channel (and how many clicks those shares have generated).This particular button is built on top of Aggregate Data API, which can be used by any developer to retrieve anonymized aggregate data about the shares tracked through our system. We built it to showcase the power of our platform and the ease of developing on our APIs (this was a weekend project).To learn more about awe.sm, check out original announcement. And apply to the awe.sm developers group to get full access to our API documentation. #Demo {padding: 5px;border: 1px solid #ff0000; -moz-border-radius:6px; -webkit-border-radius:6px; background:#F8F8F8; box-shadow: 3px 3px 3px #D44B2C; width:185px; } #Demo{margin-bottom:5px;} #Demo a{color:#D44B2C;background:#F8F8F8;padding:8px 14px;display:inline-block;font-size:12px;line-height:12px;text-decoration:none;text-transform:uppercase;-moz-border-radius:5px;-khtml-border-radius:5px;-webkit-border-radius:5px;border-radius:5px} #Demo a:hover{color:#fff;text-shadow:0px 1px 0px #000;background:#D44B2C;text-decoration:none} Official Site Features: 1.) Displays the number of shares and on hover the total number of clicks for those shares (displays Facebook logo when 0 shares) 2.) Large or small button 3.) Track the shares from the button using your awe.sm API Key or fbshare.me links 4.) Add Google Analytics parameters to fbshare.me links 5.) Configure the colors of the badge in the large button How To Add In Blogspot?1.) Go To Your www.blogger.com2.) Open Your Desire Blog.3.) Go To “Template”.4.) Click “CTRL+F” And Search For The Following Codes.5.) Now Copy The Widgert Code And Paste It To There.6.) Click Save, Now You Are Done.Where To Add Facebook Like Button In Blogspot?Button Positioning:-1.) To position the buttons at the top of post , place the code above 2.) To position the buttons at the bottom of post, place the code below 3.) To position the buttons at the in footer box of post, place the code below 4.) To position the buttons after the footer box of post, place the code below 5.) To Increase Distance Just Use Again And Again Before And After Of The Facebook Button Code.How To Add In Website?1.) Just Go To Your HTML File.2.) Now Copy The Below Code And Paste It Between .3.) Save It, Now You Are Done. var fbShare = {url: &#39;expr:href=&#39;data:post.url&#39; &#39;,size: &#39;large&#39;,badge_text: &#39;C0C0C0&#39;,badge_color: &#39;CC00FF&#39;,google_analytics: &#39;true&#39;} Customization:The button also supports advanced configuration through the following variables:1.) size – The size of the button: ‘large’ OR ‘small’ (if not specified, defaults to ‘large’)2.) url – The URL of the page you want shared on Facebook (it is default dor blogger but if you want it on website then just change it with you page URL)3.) title – The name of the page you want shared on Facebook (if not specified, defaults to that of the page on which the button is displayed)4.) google_analytics – If no awesm_api_key specified, sets whether fbshare.me links have Google Analytics parameters added: true OR false (if not specified, defaults to false)5.) awesm_api_key – For existing awe.sm customers only (if not specified, will use fbshare.me links)6.) badge_text – Change the color of the text in the badge for the large button (use standard CSS RGB hex codes, *do not* include a leading #)7.) badge_color – Change the color of the badge background for the large button (use standard CSS RGB hex codes, *do not* include a leading #)