Attractive Email Subscription Widget for Blogger

Google plus may be a stylish social network that is growing day by day. If you’ve got a blog or website then you want to add your Google and network along with your blogger website. During this post we will bring up adding a custom Google and followers widget to blogger blogs. Default Google and followers widget isn’t offensively engaging in its style, that’s why i’ve got created a custom version of the widget. My custom widget is titled well with help of CSS,


How to Add Google Plus Widget

  • Go to Blogger->Dashboard->Layout
  • Click “Add gadget”
  • Select “HTML/Javascript”
  • Paste the below code

<script src=”” type=”text/javascript”></script>
<script type=”text/javascript”>
(function() {
window.___gcfg = {‘lang’: ‘en’};
var po = document.createElement(‘script’);
po.type = ‘text/javascript’;
po.async = true;
po.src = ‘’;
var s = document.getElementsByTagName(‘script’)[0];
s.parentNode.insertBefore(po, s);
.wc-gplusmod, .wc-gplusmod:before, .wc-gplusmod:after { background: #ffffff; border-radius: 5px 5px 0 0; border: 1px solid #ccc; box-shadow: inset 0 0 30px rgba(0,0,0,0.1), 1px 1px 3px rgba(0,0,0,0.2); }
.wc-gplusmod { position: relative; width:250px; padding: 1em; margin: 50px auto; }
.wc-gplusmod:before, .wc-gplusmod:after { content: “”; position: absolute; left: 0; top: 0; width: 100%; height: 100%; -webkit-transform: rotateZ(2.5deg); -o-transform: rotate(2.5deg); transform: rotateZ(2.5deg); z-index: -1; }
.wc-gplusmod:after { -webkit-transform: rotateZ(-2.5deg); -o-transform: rotate(-2.5deg); transform: rotateZ(-2.5deg); }
<div class=”wc-gplusmod”>
<div class=”g-plus” data-action=”followers” data-height=”290″ data-href=”” data-source=”blogger:blog:followers” data-width=”290″></div>

  • Replace Red color url with your google plus Profile or Page URL.
  • Save it. Now See your blog or website. You can see attractive google plus widget.
Bookmark the permalink.

Leave a Reply

Your email address will not be published. Required fields are marked *