Tạo Hộp Đăng Kí Nhận Tin Mới Cho Blogsot

Tạo Hộp Đăng Kí Nhận Tin Mới Cho Blogsot

Tạo hộp Theo dõi qua Email / Follow by Email nổi bật & hiện đại cho Blogspot Blogger là một thủ thuật blog nâng cao và cực kỳ chuyên nghiệp. Ấn tượng đậm nét cho blog của bạn khi người dùng nhìn vào, mang dáng dấp mạnh mẽ và cực ký quý phải, nổi bật lên hẵn toàn trang web, và đó chính là điều gây chú ý với người dùng internet để họ nhập email nhận bản tin.

Để thực hiện thủ thuật này, chỉ cần chèn đoạn mã code sau vào HTML/Javascript và Lưu lại.

Tạo một Widget HTML/Javascript nhé. Hãy vào Blog Title → Layout → Add Widget → HTML/JavaScript và chèn đoạn mã code sau vào và Lưu lại.

<center><form action="http://feedburner.google.com/fb/a/mailverify" method="post" target="popupwindow" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=Tên bạn', 'popupwindow', 'scrollbars=yes,width=70%,height=520');return true" class="login"> <h1>SUBSCRIBE TODAY</h1><img src="http://png.findicons.com/files/icons/2198/dark_glass/128/mail_appt.png" alt="Smiley face" align="LEFT" height="48" width="48" /> <center><font size="3" color="white"><span style="line-height:25px"> Sign up and receive our free Newsletter  </span></font></center><br/> <input type="hidden" value="Tên bạn" name="uri" /> <input type="email" name="email" class="login-input" placeholder="Email Address" autofocus /> <input type="hidden" name="loc" value="en_US" /> <input type="submit" value="Subscribe" class="login-submit" /></form></center><style>a.tt{ position:relative; z-index:24; color:#3CA3FF; font-weight:bold; text-decoration:none;}a.tt span{ display: none; }a.tt:hover{ z-index:25; color: #aaaaff; background:;}a.tt:hover span.tooltip{ display:block; position:absolute; top:0px; left:0; padding: 15px 0 0 0; width:200px; color: #993300; text-align: center; filter: alpha(opacity:90); KHTMLOpacity: 0.90; MozOpacity: 0.90; opacity: 0.90;}a.tt:hover span.top{ display: block; padding: 30px 8px 0; background: url(bubble.gif) no-repeat;}a.tt:hover span.middle{ /* different middle bg for stretch */ display: block; padding: 0 8px; }a.tt:hover span.bottom{ display: block; padding:3px 8px 10px; color: #548912;}::-moz-focus-inner { padding: 0; border: 0;}:-moz-placeholder { color: #bcc0c8 !important;}::-webkit-input-placeholder { color: #bcc0c8;}:-ms-input-placeholder { color: #bcc0c8 !important;}.input { font: 12px/20px "Lucida Grande", Verdana, sans-serif; color: #404040; background: #ebc9a2;}.input { font-family: inherit; font-size: 12px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}.login { padding: 18px 20px; width: 80%; background: #3f65b7; background-clip: padding-box; border: 1px solid #172b4e; border-bottom-color: #142647; border-radius: 5px; background-image: -webkit-radial-gradient(cover, #437dd6, #3960a6); background-image: -moz-radial-gradient(cover, #437dd6, #3960a6); background-image: -o-radial-gradient(cover, #437dd6, #3960a6); background-image: radial-gradient(cover, #437dd6, #3960a6); -webkit-box-shadow: inset 0 1px rgba(255, 255, 255, 0.3), inset 0 0 1px 1px rgba(255, 255, 255, 0.1), 0 2px 10px rgba(0, 0, 0, 0.5); box-shadow: inset 0 1px rgba(255, 255, 255, 0.3), inset 0 0 1px 1px rgba(255, 255, 255, 0.1), 0 2px 10px rgba(0, 0, 0, 0.5);}.login > h1 { margin-bottom: 20px; font-size: 24px; font-weight: bold; text-align: center; color: #fff; text-shadow: 0px 1px 0px #999, 0px 2px 0px #888, 0px 3px 0px #777, 0px 4px 0px #666, 0px 5px 0px #555, 0px 6px 0px #444, 0px 7px 0px #333, 0px 8px 7px #001135;}.login-input { display: block; width: 90%; height: 37px; margin-bottom: 20px; padding: 0 9px; color: white; text-shadow: 0 1px black; background: #2b3e5d; border: 1px solid #15243b; border-top-color: #0d1827; border-radius: 4px; background-image: -webkit-linear-gradient(top, rgba(0, 0, 0, 0.35), rgba(0, 0, 0, 0.2) 20%, rgba(0, 0, 0, 0)); background-image: -moz-linear-gradient(top, rgba(0, 0, 0, 0.35), rgba(0, 0, 0, 0.2) 20%, rgba(0, 0, 0, 0)); background-image: -o-linear-gradient(top, rgba(0, 0, 0, 0.35), rgba(0, 0, 0, 0.2) 20%, rgba(0, 0, 0, 0)); background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.35), rgba(0, 0, 0, 0.2) 20%, rgba(0, 0, 0, 0)); -webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.3), 0 1px rgba(255, 255, 255, 0.2); box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.3), 0 1px rgba(255, 255, 255, 0.2);}.login-input:focus { outline: 0; background-color: #32486d; -webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.3), 0 0 4px 1px rgba(255, 255, 255, 0.6); box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.3), 0 0 4px 1px rgba(255, 255, 255, 0.6);}.lt-ie9 .login-input { line-height: 35px;}.login-submit { display: block; width: 100%; height: 37px; margin-bottom: 15px; font-size: 14px; line-height: 10px; font-weight: bold; color: #294779; text-align: center; text-shadow: 0 1px rgba(255, 255, 255, 0.3); background: #adcbfa; background-clip: padding-box; border: 1px solid #284473; border-bottom-color: #223b66; border-radius: 4px; cursor: pointer; background-image: -webkit-linear-gradient(top, #d0e1fe, #96b8ed); background-image: -moz-linear-gradient(top, #d0e1fe, #96b8ed); background-image: -o-linear-gradient(top, #d0e1fe, #96b8ed); background-image: linear-gradient(to bottom, #d0e1fe, #96b8ed); -webkit-box-shadow: inset 0 1px rgba(255, 255, 255, 0.5), inset 0 0 7px rgba(255, 255, 255, 0.4), 0 1px 1px rgba(0, 0, 0, 0.15); box-shadow: inset 0 1px rgba(255, 255, 255, 0.5), inset 0 0 7px rgba(255, 255, 255, 0.4), 0 1px 1px rgba(0, 0, 0, 0.15);}.login-submit:active { background: #a4c2f3; -webkit-box-shadow: inset 0 1px 5px rgba(0, 0, 0, 0.4), 0 1px rgba(255, 255, 255, 0.1); box-shadow: inset 0 1px 5px rgba(0, 0, 0, 0.4), 0 1px rgba(255, 255, 255, 0.1);}.login-help { text-align: center;}.login-help > a { font-size: 11px; color: #d4deef; text-decoration: none; text-shadow: 0 -1px rgba(0, 0, 0, 0.4);}.login-help > a:hover { text-decoration: underline;}</style>

Thay Tên bạn thành địa chỉ Feed của bạn nha. Và trong điều kiện để người dùng có thể đăng ký được khi nhập email vào, bạn cần tạo Feedburner cho blog của bạn.Bạn vào hướng dẫn Cách đăng ký và sử dụng FeedBurner cho Blogspot mà trước đây Terocket từng giới thiệu để tạo Feed nha.

Chúc các bạn thành công

Unknown

Add Comment

Thủ-Thuật-Blogger