Tampilkan postingan dengan label subscription. Tampilkan semua postingan
Tampilkan postingan dengan label subscription. Tampilkan semua postingan

Selasa, 10 Mei 2016

Add Attractive Email Subscription Widget in Blogger

,
Add amazing RSS Subscription Form: This is really a very great feature to add like this widget in blogger, by adding this widget you can easily increase your Subscribers and Viewers. If you provides useful and healthy content to your viewers, then some times your readers need to get latest newsletter from blog, thats why you should add Email subscription form in your blog.

RSS-Subscription-form-in-blogger

Recommended: Add JQuery Facebook popup window in blogger

Add RSS Subscription form in blogger:


You just need to follow given below steps.

* Go to desired blog > > Select Layout > > Click on "Add a Gadget" link

* From the popup window, scroll down and click on the "HTML/JavaScript" gadget


* Now Copy the given below code and paste in empty "HTML/JavaScript" gadget.


       <style>
      .hl-email{
      background:url(
      https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEitNQi8q_ceBdpboSPjf4Cl_tOPbL5TzI6Gbjx7L7aQfT_wiD3eTDD37tfN0FvcuE4l4jshJchMYyHmhVe4WHgJr0ciBqY_EkdnOlRefeOew2xRLpTfzeaC4gtpuvac1Q7MOzreHleKpb0/s1600/mail.png) no-repeat 0px 12px ;
      width:300px;
      padding:10px 0 0 55px;
      float:left;
      font-size:1.4em;
      font-weight:bold;
      margin:0 0 10px 0;
      color:#686B6C;
      }
      .hl-emailsubmit{
      background:#9B9895;
      cursor:pointer;
      color:#fff;
      border:none;
      padding:3px;
      text-shadow:0 -1px 1px rgba(0,0,0,0.25);
      -moz-border-radius:6px;
      -webkit-border-radius:6px;
      border-radius:6px;
      font:12px sans-serif;
      }
      .hl-emailsubmit:hover{
      background:#E98313;
      }
      .textarea{
      padding:2px;
      margin:6px 2px 6px 2px;
      background:#f9f9f9;
      border:1px solid #ccc;
      resize:none;
      box-shadow:inset 1px 1px 1px rgba(0,0,0,0.1);
      -moz-box-shadow:inset 1px 1px 1px rgba(0,0,0,0.1);
      -webkit-box-shadow:inset 1px 1px 1px rgba(0,0,0,0.1); font-size:13px;
      width:
      130px;
      color:#666;}
      </style>
      <div class="hl-email">
      Subscribe via Email <form action="http://feedburner.google.com/fb/a/mailverify" id="feedform" method="post" target="popupwindow" onsubmit="window.open(
      http://feedburner.google.com/fb/a/mailverify?uri=makemoneyonline-72, popupwindow, scrollbars=yes,width=550,height=520);return true">
      <input gtbfieldid="3" class="textarea" name="email" onblur="if (this.value == &quot;&quot;) {this.value = &quot;Enter email address here&quot;;}" onfocus="if (this.value == &quot;Enter email address here&quot;) {this.value = &quot;&quot;;}" value="Enter email address here" type="text" />
      <input type="hidden" value=”makemoneyonline-72" name="uri"/><input type="hidden" name="loc" value="en_US"/>
      <input class="hl-emailsubmit" value="Submit" type="submit" />
      </form>
      </div>

      Setting:


      * Replace the URL in green to change the Email icon.

      * To change the width or the text area, increase/decrease 130px in red.


      * Replace the http://feedburner.google.com/fb/a/mailverify?uri=makemoneyonline-72 with 
      your feed burner url.

      * Replace the "makemoneyonline-72" with your feed burner name.


      * Now Save the widget, and again save Layout.


          Keep visiting this blog to get latest post. Dont forget to share this post with your Friends on Social Media Sites.

          Read more

          Senin, 28 Maret 2016

          Add Social Sharing Icons with Email Subscription Widget Below Every Post

          ,
          You have a blog and if your blog is with out collaboration of social media sites, then may be your blog worth is nothing in online world. In this post I will tell you how to add social sharing buttons with Email subscribe widget and facebook page like icon. If you add this widget in your blog, your viewers can easily share/like and subscribe your every post. This widget can help you a lot to popular you in social media sites.

          Add-Social-icons-with-Email-RSS-widget

          Recommended: Add Attractive Email Subscription Widget in Blogger

          Instructions to Add Widget in Blogger:

          1- Go to blogger Dash Board ?  Template ?  Edit HTML

          2- After it Find the shown code below by pressing Ctrl+F (Click anywhere in code then press Ctrl+F)

          <data:post.body/>
          3- Now Copy code shown below and paste just after ( <data:post.body/> ) it.

          <b:if cond=data:blog.pageType == "item"><style>p#socialicons img { -moz-transition: all 1s ease-in-out; -webkit-transition: all 1s ease-in-out; -o-transition: all 1s ease-in-out; -ms-transition: all 1s ease-in-out; transition: all 1s ease-in-out;} p#socialicons img:hover { -moz-transform: rotate(360deg); -webkit-transform: rotate(360deg); -o-transform: rotate(360deg); -ms-transform: rotate(360deg); transform: rotate(360deg);}.emailbutton{background:#f7f8f9;background:-webkit-gradient(linear,left top,left bottom,color-stop(#f7f8f9,0),color-stop(#e9e9e9,1));background:-webkit-linear-gradient(top, #f7f8f9 0%, #e9e9e9 100%);background:-moz-linear-gradient(top, #f7f8f9 0%, #e9e9e9 100%);background:-o-linear-gradient(top, #f7f8f9 0%, #e9e9e9 100%);background:linear-gradient(top, #f7f8f9 0%, #e9e9e9 100%);filter:progid:DXImageTransform.Microsoft.gradient( startColorstr=#f7f8f9, endColorstr=#e9e9e9,GradientType=0 );border:1px solid #ddd;-webkit-border-radius:4px;-moz-border-radius:4px;border-radius:4px;padding:6px 12px;margin:0;-webkit-box-shadow:0 1px 0 #f9f9f9 inset, 1px 1px 1px rgba(223,223,223,0.4);-moz-box-shadow:0 1px 0 #f9f9f9 inset, 1px 1px 1px rgba(223,223,223,0.4);box-shadow:0 1px 0 #f9f9f9 inset, 1px 1px 1px rgba(223,223,223,0.4);color:#888;text-shadow:0 1px 0 #fff;line-height:1.2;cursor:pointer;font-size:13px;}.emailbutton:hover{background:#f1f1f1;background:-webkit-gradient(linear,left top,left bottom,color-stop(#f1f1f1,0),color-stop(#e0e0e0,1));background:-webkit-linear-gradient(top, #f1f1f1 0%, #e0e0e0 100%);background:-moz-linear-gradient(top, #f1f1f1 0%, #e0e0e0 100%);background:-o-linear-gradient(top, #f1f1f1 0%, #e0e0e0 100%);background:linear-gradient(top, #f1f1f1 0%, #e0e0e0 100%);filter:progid:DXImageTransform.Microsoft.gradient( startColorstr=#f1f1f1, endColorstr=#e0e0e0,GradientType=0 );text-decoration:none !important;}.email{clear:both;width:100%;margin:10px 0;}.emailform{position:relative;width:300px;margin:0 auto;}.emailinput{width:200px;height:18px;margin:0 auto;padding:8px 40px 8px 10px;border:1px solid #ddd;-webkit-border-radius:4px;-moz-border-radius:4px;border-radius:4px;font-family:georgia;font-style:italic;-webkit-box-shadow:1px 1px 2px #dfdfdf;-moz-box-shadow:1px 1px 2px #dfdfdf;box-shadow:1px 1px 2px #dfdfdf;font-size:14px;color:#666;}.emailbutton{-webkit-border-top-right-radius:4px;-webkit-border-bottom-right-radius:4px;-moz-border-radius-topright:4px;-moz-border-radius-bottomright:4px;border-top-right-radius:4px;border-bottom-right-radius:4px;-webkit-border-top-left-radius:0px;-webkit-border-bottom-left-radius:0px;-moz-border-radius-topleft:0px;-moz-border-radius-bottomleft:0px;border-top-left-radius:0px;border-bottom-left-radius:0px;padding:9px;position:absolute;right:-2px;top:0;display:block;line-height:16px;}.emailbutton{padding:8px !important;}.emailform, .emailinput{width:98% !important;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;height:auto;}
          </style><center><div style=font-size: 22px;><b>Share this article with your friends.</b></div><p id=socialicons><a expr_href=&quot;http://plus.google.com/share?url=&quot; + data:post.url rel=external nofollow target=_blank><img border=0 src=https://lh3.googleusercontent.com/-svneEYei1xk/Ug5AVlY6G7I/AAAAAAAAAzw/c-vM0xyKeE0/h120/pctoolstips.blogspot.com.png/></a><a expr_href=&quot;http://www.facebook.com/sharer.php?u=&quot; + data:post.url + &quot;&amp;t=&quot; + data:post.title rel=external nofollow target=_blank><img border=0 src=https://lh4.googleusercontent.com/-ZlyQjJzKhfM/Ug4_-FC98SI/AAAAAAAAAzY/TkM8bm4vi3Y/h120/pctoolstips.blogspot.com.png/></a><a expr_href=&quot;http://twitthis.com/twit?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title rel=external nofollow target=_blank><img border=0 src=https://lh3.googleusercontent.com/-sP6QPxvEAuc/Ug5AF2MxmaI/AAAAAAAAAzg/Zo3gTcXPhoY/h120/pctoolstips.blogspot.com.png/></a><a expr_href=&quot;http://digg.com/submit?phase=2&amp;url=&quot; + data:post.url rel=external nofollow target=_blank><img border=0 src=https://lh5.googleusercontent.com/-TN2wRorXcRI/Ug5ANdjhlMI/AAAAAAAAAzo/KHkIipK__VE/h120/pctoolstips.blogspot.com.png/></a><a expr_href=&quot;http://del.icio.us/post?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title rel=external nofollow target=_blank><img border=0 src=https://lh6.googleusercontent.com/-N81aJXOjDc4/Ug5AmxKkaCI/AAAAAAAAAz4/Uo5zdqKW8zI/h120/pctoolstips.blogspot.com.png/></a><a expr_href=&quot;http://www.stumbleupon.com/submit?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title rel=external nofollow target=_blank><img border=0 src=https://lh5.googleusercontent.com/--bJvSbAaGKI/Ug5AufzVXxI/AAAAAAAAA0A/LZL9mRT5v_s/h120/pctoolstips.blogspot.com.png/></a><a expr_href=&quot;http://www.technorati.com/faves?add=&quot; + data:post.url rel=external nofollow target=_blank><img border=0 src=https://lh5.googleusercontent.com/-kqFfYGorLvg/Ug5A2MKyatI/AAAAAAAAA0I/dYoTa-zxNZY/h120/pctoolstips.blogspot.com.png/></a></p><div style=margin:5px 0px 10px 0px; padding:10px; width:590px;float:none; ><div style=float:left; width:272px; border-right:1px solid #ddd;><iframe allowtransparency=true frameborder=0 scrolling=no src=http://www.facebook.com/plugins/likebox.php?href=URL HERE&amp;width=292&amp;colorscheme=light&amp;show_faces=false&amp;border_color&amp;stream=false&amp;header=false&amp;height=62 style=border:none; overflow:hidden; width:292px; height:62px;/></div><div style=margin:15px 15px 0px 0px; padding:0px; float:right; width:260px;><iframe allowtransparency=true class=twitter-follow-button frameborder=0 scrolling=no src=http://platform.twitter.com/widgets/follow_button.html#_&amp;id=twitter-widget-0&amp;lang=en&amp;screen_name=USERNAME2&amp;show_count=true&amp;show_screen_name=true&amp;size=l style=width: 266px; height: 32px; title=Twitter Follow Button/><script src=http://platform.twitter.com/widgets.js type=text/javascript/></div></div><div class="email"><form action="http://feedburner.google.com/fb/a/mailverify" method="post" target="popupwindow" onsubmit="window.open(http://feedburner.google.com/fb/a/mailverify?uri=USERNAME1, popupwindow, scrollbars=yes,width=550,height=520);return true" class="emailform"><input type="hidden" value="USERNAME1" name="uri" /><input type="hidden" name="loc" value="en_US" /><input type="text" onblur="if (this.value == &quot;&quot;) {this.value = &quot;Enter your email...&quot;;}" onfocus="if (this.value == &quot;Enter your email...&quot;) {this.value = &quot;&quot;}" value="Enter your email..." name="email" class="emailinput" /><input type="submit" class="emailbutton" value="SignUp" title= /></form></div><div dir="ltr" style="text-align: Right;" trbidi="on"><a href="
          http://makemoneyonline72.blogspot.com/2015/01/add-social-sharing-icons-with-email.html" target="_blank" ><span style="font-size: xx-small;">Get This</span></a></div></center></b:if>

          Customize this Widget

          4- Replace USERNAME1 with your Feed Burner user name {by pressing Ctrl+F}

          5- Replace URL HERE with you Facebook fan page URL

          6- Replace USERNAME2 with you Twitter user name. 

          7- Save Targeted widget and Enjoy.

          Note: If this widget doesnt appear after paste Code, then find next [ <data:post.body/> ] code and paste widget code just after it. In case of me I was find this code for 4 time then paste widget code, So Widget will be show below every post. 

          I hope you enjoyed this featured post. And Im sure Its working for you. If you have any question and query please ask me in comment section and remember dont forget to share this post with your friends in social media sites.


          Read more

          Kamis, 17 Maret 2016

          Add Popup Email Subscription Widget with Light Box Effect

          ,
          This is really a great widget because any viewers can subscribe your blog by simply write own Email address in popup Email widget. It get the best attention of the visitors which makes them so effective in doing their job. A visitors either have to subscribe your blog or click on a cross icon to continue suffering on your blog. If you have quality content on your blog then many viewers will want subscribe your blog, so this widget will be very helpful for you.

          Note: The code I have provided below will show-up the subscription box when the page has been loaded.

          blogger-RSS-subscription-box


          Install Popup Email subscription Box in Blogger:



          - Go to Blogger and log-in to your account

          - Select your blog and navigate to the "Template" section

          - Hit on "Edit HTML" Button

          - Click anywhere inside the code and press Ctrl + F to open the search box

          - Find <body> tag and replace with the given below code

          <body onload=lightbox_open()>

          - Now just after that paste the given below code


          <div id="light"> <div style=position:absolute;left:-20px;top:-20px;text-align:center;font-size:31px;width:40px;height:40px;background-color:white;border:4px solid black;border-radius:100%;color:black;font-family: Impact, Haettenschweiler, "Franklin Gothic Bold", Charcoal, "Helvetica Inserat", "Bitstream Vera Sans Bold", "Arial Black", sans serif onClick="lightbox_close();">X</div>  <center><img style=width:400px;height:125px; src=https://lh5.googleusercontent.com/-wsjbg3uaeUU/VLbFISkW_xI/AAAAAAAAAWw/jYnp3D3MLQc/w400-h125-no/MakeMoneyOnline72.BlogSpot.png></img></center> <form id=sub action="http://feedburner.google.com/fb/a/mailverify?uri=makemoneyonline-72" method="post" target="popupwindow" onsubmit="window.open(http://feedburner.google.com/fb/a/mailverify?uri=makemoneyonline-72, popupwindow, scrollbars=yes,width=550,height=520);return true"><center> <p style=font-size:35px;margin-bottom:15px;>Subscribe To Our Mailing List</p> <input class=sbox id=sbox type=text name=uri placeholder=Your Email Address.../></center><input class=sbutton id=sbutton style=border:0; vertical-align: top; name=upload type=submit value=Subscribe/></form><center><p style=font-family:Source Sans Pro, sans-serif; ><b>P.S</b> I will never spam you...100% GUARANTEED!</p></center></div><div id="fade"></div><link href=http://fonts.googleapis.com/css?family=Source+Sans+Pro rel=stylesheet type=text/css/>
          <style>input:focus{outline: 0.5px solid #4c004c;}#sbutton {padding: 5px;font-size:30px;margin-top:10px;width:500px;margin-left:50px;:font-family: Candara, Calibri, Segoe, "Segoe UI", Optima, Arial, sans-serif;background-color:#DFDFDF;}form { margin:0px;font-family: Candara, Calibri, Segoe, "Segoe UI", Optima, Arial, sans-serif;}#sbox {width: 500px;height:30px;vertical-align:bottom;}#sbox:focus{border: 1px solid #4c004c;}#fade{    display: none;    position: fixed;    top: 0%;    left: 0%;    width: 100%;    height: 100%;    background-color: #000;    z-index:1001;    -moz-opacity: 0.7;    opacity:.70;    filter: alpha(opacity=70);}#light{    display: none;    position: fixed;    top: 29%;    left: 29%;    width: 600px;    height: 400px;    margin-left: -150px;    margin-top: -100px;                   padding: 10px;    border: 2px solid #FFF;    background: white;    z-index:1002;    overflow:visible;}</style><script>

          window.document.onkeydown = function (e){    if (!e){        e = event;    }    if (e.keyCode == 27){        lightbox_close();    }}function lightbox_open(){ window.scrollTo(0,0);    document.getElementById(light).style.display=block;    document.getElementById(fade).style.display=block; }function lightbox_close(){    document.getElementById(light).style.display=none;    document.getElementById(fade).style.display=none;

          }</script>

          Customization:


          * Change the Blog Image/Logo URL in red with your logo url ( you can make this url by uploading image/logo on Google + site )

          * Replace the Feed Burner "User Name" in pink with your Feed Burner User Name

          * Now its complete. Hit on "Save" template button

          Recommended: Free Download CustomizeMe SEO Friendly Template

          Do let me know how this widget is working on your blog.If you are having any trouble with this subscription box then leave your experience down in the comment section below. Ill fix any bugs present in this widget and off-course if you liked it just stay turned for more :)


          Read more
           

          Sharing Information Copyright © 2016 -- Powered by Blogger