Colorful Responsive Electronic Mail Subscription Box For Blogger

How to add together colorful responsive electronic mail subscription box on Blogger?

Hello, Bloggers! Here I am going to portion a unproblematic responsive Blogger Email subscription box widget/gadget alongside advert together with electronic mail cast section. Through which people tin subscribe your weblog to acquire your latest updates of your weblog post through Email notifications. This widget/gadget is quite responsive together with is likewise dandy inward appearance. You should role this widget/gadget.

Script codes to setup Email subscription box on your blog

1 ii three 4 five half dozen seven 8 nine ten xi 12 thirteen fourteen xv xvi 17 xviii nineteen twenty 21 22 23 24 25 26 27 28 29 thirty 31 32 33 34 35 36 37 38 39 forty 41 42 43 44 45 46 47 48 49 l 51 52 53 54 55 56 57 58 59 sixty 61 62 63 64 65 66 67 68 69 seventy 71 72 73 74 75 76 77 78 79 fourscore 81 82 83 84 85 86 87 88 89 ninety 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133

<style> #twist-blogger-sbox { padding: 0; margin: 0; width: 100%; /*---- Change width hither - You tin role pixels or inward per centum -----*/ height: 355px; border-radius: 1px; border: 0; background: #3A3939; /*------ Change background color of widget here--------*/ } #twist-blogger-sbox .tagline { padding: 5px 0px 0px 0px; line-height: 35px; height: 45px; font-size: 25px; /*----- Change the Font Size of Main Tagline hither -----*/ font-weight: normal; font-family: "Oswald",sans-serif; text-shadow: 0px -1px 0px #999; color: #FFF; text-align: center; background: #FF7400; /*---- Change background color of Tagline hither -----*/ border: 5px solid #FD6A00; border-bottom: 7px solid transparent; border-bottom-left-radius: 50px; } #twist-blogger-sbox .sub-tagline { font-family: "Oswald", sans-serif; font-size: 19px; /*--Sub Tagline Font Size - Change hither ---*/ color: #FFF; text-shadow: 0px -1px 0px #000; line-height: 30px; padding: 0px 10px 0px 10px; text-align: center; margin: 0; } #twist-blogger-sbox .item-list { margin: 10px 0px 0px 0px !important; } #twist-blogger-sbox .item-list > ul { padding: 0px 0px 0px 50px !Important; margin: 0 !important; } #twist-blogger-sbox .item-list > ul > li { font-family: "Oswald", sans-serif; font-size: 15px; /*----- Change Font Size of List hither ------*/ margin-left: 10px; color: #E8E8E8; /*------ Change font color of List hither ----*/ line-height: 24px; text-align: left; text-shadow: 0px -1px 0px #000; list-style: none !important; list-style-type: none !important; margin: 0px !important; padding: 0px !important; border: 0 !important; } #twist-blogger-sbox .rssform { padding: 0px 20px; margin: 16px 0px 16px 0px; } #twist-blogger-sbox .rssform input { padding: 8px; font-size: 13px; font-family: "Oswald", sans-serif; font-weight: normal; width: 100%; text-transform: uppercase; outline: none !important; border: none; border-radius: 1px; box-sizing: border-box !important; -moz-box-sizing:border-box; } #twist-blogger-sbox .rssform .button:hover { background: #ED6D00; /*----- Change Subscribe push hover color hither -----*/ } #twist-blogger-sbox .rssform .button { background: #FF7400; /*----- Change Subscribe push background color hither -----*/ color: #FFF!important; /*------ Change Font color hither ------*/ border: 0; margin-top: 15px; outline: none !important; transition: all .3s ease-in-out; width: 100%; padding: 6px !important; float: none; text-transform: uppercase; font-family: "Oswald", sans-serif; font-size: 18px; font-weight: normal; cursor: pointer; } #twist-blogger-sbox .lock-policy a { color:#818181; text-decoration:none !Important; } #twist-blogger-sbox .lock-policy { font-family: "Oswald",sans-serif; background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjSBUu9hSOlqww9uv5yixK7yEIBXRS8xLUh5PHvJ2Nnoi4uqiEVdGj-xhaL5CMSxFxh0OeYxfSxS_v0qBq0byQdlv_GRnRxHTMfu1ljmQWE_X0RRxv2Pj7Ny3kC5mQviZ2M8IFRK0QWsk0/s1600/Lock-twistblogger.png) no-repeat 10px -2px; /*--- picture URL of Lock appears inward footer ---*/ color: #818181; text-align: center; font-size: 12px; /*--- Font size of footer work ----*/ margin-left: 10px; padding: 0px; line-height: 30px; margin-top: -5px; } </style> <div id='twist-blogger-sbox'> <div class='tagline'> Wait! Did You Know? </div> <div class='sub-tagline'>Why should y'all subscribe?</div> <div class="item-list"> <ul> <li><div style='color: #FF5700; display: inline-block; font-size:17px; letter-spacing: 4px;'>&#10004;</div> Free Photoshop .PSD Templates</li> <li><div style='color: #FFE800; display: inline-block; font-size:18px; letter-spacing: 4px;'>&#10004;</div> Adobe Illustrator Tutorials</li> <li><div style='color: #FF5700; display: inline-block; font-size:19px; letter-spacing: 4px;'>&#10004;</div> 3D Animation Tutorials</li> <li><div style='color: #FFE800; display: inline-block; font-size:20px; letter-spacing: 4px; letter-spacing: 4px;'>&#10004;</div> Straight into your &#8594; INBOX</li> </ul> </div> <div class='rssform'> <form action='http://feedburner.google.com/fb/a/mailverify' method='post' target="popupwindow" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=howtolearnblogcom', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true"> <input type='text' name='email' placeholder='Enter your electronic mail address...' /> <input type="hidden" value="howtolearnblogcom" name="uri"/> <input type="hidden" name="loc" value="en_US"/> <input value="Subscribe Now" class="button" type="submit" /> </form> </div> <div class="lock-policy"> Powered past times <a href='http://www.howtolearnblog.com' rel='dofollow' target='_blank'>How To Learn Blogging</a> </div> </div>

How to setup subscribe box for Blogger (Blogspot)?

Follow these steps:

• Replace all the yellow marked name alongside your weblog feed name.
• Paste this code on a sidebar of your blog.
• Go to Theme department on your blog.
• Click on Add Gadgets on a sidebar. 
• Select HTML/JAVASCRIPT

• Modify together with Copy the inward a higher house codes.
• Put the in conclusion code on HTML/Javascript box.

I promise everything is clear. If y'all bring whatsoever sort of work regarding to setup subscribe box on Blogger's blog. Then, Please write your work below on comment box.