Chia sẻ Popup, intro hiển thị Mã Giảm Giá, Voucher, Khuyến Mãi, Coupon, Săn Deal mua sắm cho Blogspot tiếp thị liên kết
ɡɩλ✿ßảσ︵²ᵏ⁶ : Viết Blog Truyền Thông, Thiết Kế Đồ Họa Quảng Cáo, Làm Video Marketing.
Quảng bá sản phẩm
Thớt Gỗ
Giới thiệu công ty cung cấp,
ván ghép theo yêu cầu
, tới các doanh nghiệp chuyên sản xuất đồ gỗ nội thất, mộc gia dụng & đơn vị chuyên thi công lắp đặt Nhà Gỗ.
Thông Điệp : Vật Liệu Xanh, Bảo Vệ Môi Trường.
Code đăng bài viết dạng Popup giữa màn hình chia sẻ hiển thị Mã Giảm Giá, Voucher, Khuyến Mãi, Coupon, Săn Deal mua sắm :
Thông thường code Popup & Intro được sử dụng hiển thị khi vào trang chủ hoặc hiển thị sau 1 thời gian nào đó ở trang bất kỳ với mục tiêu quảng cáo, hiển thị form đăng ký, thông báo,....
Hôm nay Gia Bảo Blog giới thiệu kiểu đăng bài viết BlogSpot dàng cho Blogger viết lách kiếm tiền online theo mô hình tiếp thị liên kết ( Affiliate Marketing ) cách kiếm tiền trực tuyến hấp dẫn & hiệu quả từ nội dung Website.
Xem thêm bài viết : https://www.digitalnomad.vn/2021/03/mmo-kiem-tien-online-tu-website-khong-kho-nhung-phai-biet-cachVoi297.html
Danh sách nội dung bài viết liên quan đến code thiết kế làm đẹp nội dung & giao diện blogspot :
➠ Nên cài cái gì vào BlogSpot của bạn
➠ Series thẻ Html / Class, Id & thuộc tính trong Css
➠ Ký tự đặc biệt chèn vào nội dung Blog/Web Content
➠ Danh sách template blogger đẹp dùng viết blog content marketing & kiếm tiền trên mạng
➠ Tổng hợp thẻ xml, code html, css, javascript dùng chỉnh sửa template blogspot
➠ Tìm hiểu trang quản trị blogspot bao gồm chủ đề, bố cục, trang, cài đặt, bài đăng,... giúp người dùng chỉnh sửa nội dung bài viết & chỉnh sửa giao diện trang blog/web.
➠ Làm việc với ngôn ngữ lập trình (XML, HTML, CSS, Javascript,...) & ứng dụng dùng thiết kế web bằng blogspot.
➠ Chia sẻ Popup, intro hiển thị Mã Giảm Giá, Voucher, Khuyến Mãi, Coupon, Săn Deal mua sắm cho Blogspot tiếp thị liên kết
➠ Xây dựng Blog Content + UX + Internal link dùng làm nơi chia sẻ & viết quảng cáo Top 10 Google & cách viết Slogan Top Of Mind
➠ Danh sách template blogger đẹp dùng viết blog content marketing & kiếm tiền trên mạng
➠ Danh sách tiêu đề bài viết tuyển chọn sắp xếp theo từng chuyên mục
➠ Next
Code 1 - Kiểu đăng bài viết dạng Popup kết hợp Intro - Css sử dụng chung cho tất cả các bài viết trên trang Blogspot :
Phần 1 Code Css Chèn trên </head> :
<!--Css JavaScript mo rong -->
<!--Css Post Intro - mau 1 dang bai viet-->
<!--
position: Inherit;
position: relative;
-->
<b:if cond='data:blog.isMobileRequest'>
<!-- hiển thị trên Mobile -->
<style>
#intro_homepage{ position: Inherit;
display: table;
width: 80%;
height: 300px;
margin: 0!important;
padding: 0!important;
z-index: 999;
background-size: cover!important;
background: #3c3c3c;}
.intro_homepage_content{position:relative;z-index:3}
.intro_label h2{animation:zoomInUp 6s;font-size:25px;font-weight:700;color:rgba(255,255,255,.85);letter-spacinggg:0;margin:0 0 0;padding:0;font-family:"Roboto Condensed",sans-serif;text-transform:uppercase}
.intro_label p{animation: zoomInDown 4s; text-transform: uppercase; font-size: 16px; font-weight: 400; color: rgba(255,255,255,0.7); margin: 0; padding: 0; letter-spacing: 2px}
.intro_label{margin:0 auto;text-align:center;padding:0}
.intro_buttondown a{position:absolute;bottom:2%;left:50%;z-index:2;display:inline-block;-webkit-transform:translate(0,-50%);transform:translate(0,-50%);color:#fff;font:normal 400 20px/1 'Josefin Sans',sans-serif;letter-spacinggg:.1em;text-decoration:none;transition:opacity .3s}
.meta_{display:table-cell;vertical-align:middle;text-align:center}
@-webkit-keyframes slideUpso {
from {-webkit-transform: translate(-700px, 0)}
to { -webkit-transform: translate(0px, 0px)}
}
.intro_label h2{
-webkit-animation: slideUpso 3s;
-moz-animation: slideUpso 3s;
-ms-animation: slideUpso 3s;
-o-animation: slideUpso 3s;
animation: slideUpso 3s;
}
@-webkit-keyframes slideUpsos {
from {-webkit-transform: translate(0, 1000px)}
to { -webkit-transform: translate(0px, 0px)}
}
.intro_label p{
-webkit-animation: slideUpsos 3s;
-moz-animation: slideUpsos 3s;
-ms-animation: slideUpsos 3s;
-o-animation: slideUpsos 3s;
animation: slideUpsos 3s;
}
</style>
<b:else/>
<!-- hiển thị trên PC -->
<style>
#intro_homepage{ position: Inherit;
display: table;
width: 30%;
height: 300px;
margin: 0!important;
padding: 0!important;
z-index: 999;
background-size: cover!important;
background: #3c3c3c;}
.intro_homepage_content{position:relative;z-index:3}
.intro_label h2{animation:zoomInUp 6s;font-size:25px;font-weight:700;color:rgba(255,255,255,.85);letter-spacinggg:0;margin:0 0 0;padding:0;font-family:"Roboto Condensed",sans-serif;text-transform:uppercase}
.intro_label p{animation: zoomInDown 4s; text-transform: uppercase; font-size: 16px; font-weight: 400; color: rgba(255,255,255,0.7); margin: 0; padding: 0; letter-spacing: 2px}
.intro_label{margin:0 auto;text-align:center;padding:0}
.intro_buttondown a{position:absolute;bottom:2%;left:50%;z-index:2;display:inline-block;-webkit-transform:translate(0,-50%);transform:translate(0,-50%);color:#fff;font:normal 400 20px/1 'Josefin Sans',sans-serif;letter-spacinggg:.1em;text-decoration:none;transition:opacity .3s}
.meta_{display:table-cell;vertical-align:middle;text-align:center}
@-webkit-keyframes slideUpso {
from {-webkit-transform: translate(-700px, 0)}
to { -webkit-transform: translate(0px, 0px)}
}
.intro_label h2{
-webkit-animation: slideUpso 3s;
-moz-animation: slideUpso 3s;
-ms-animation: slideUpso 3s;
-o-animation: slideUpso 3s;
animation: slideUpso 3s;
}
@-webkit-keyframes slideUpsos {
from {-webkit-transform: translate(0, 1000px)}
to { -webkit-transform: translate(0px, 0px)}
}
.intro_label p{
-webkit-animation: slideUpsos 3s;
-moz-animation: slideUpsos 3s;
-ms-animation: slideUpsos 3s;
-o-animation: slideUpsos 3s;
animation: slideUpsos 3s;
}
</style>
</b:if>
<!--End Css Post Intro - mau 1 dang bai viet-->
<!--End Css JavaScript mo rong -->
<!--Css Post Intro - mau 1 dang bai viet-->
<!--
position: Inherit;
position: relative;
-->
<b:if cond='data:blog.isMobileRequest'>
<!-- hiển thị trên Mobile -->
<style>
#intro_homepage{ position: Inherit;
display: table;
width: 80%;
height: 300px;
margin: 0!important;
padding: 0!important;
z-index: 999;
background-size: cover!important;
background: #3c3c3c;}
.intro_homepage_content{position:relative;z-index:3}
.intro_label h2{animation:zoomInUp 6s;font-size:25px;font-weight:700;color:rgba(255,255,255,.85);letter-spacinggg:0;margin:0 0 0;padding:0;font-family:"Roboto Condensed",sans-serif;text-transform:uppercase}
.intro_label p{animation: zoomInDown 4s; text-transform: uppercase; font-size: 16px; font-weight: 400; color: rgba(255,255,255,0.7); margin: 0; padding: 0; letter-spacing: 2px}
.intro_label{margin:0 auto;text-align:center;padding:0}
.intro_buttondown a{position:absolute;bottom:2%;left:50%;z-index:2;display:inline-block;-webkit-transform:translate(0,-50%);transform:translate(0,-50%);color:#fff;font:normal 400 20px/1 'Josefin Sans',sans-serif;letter-spacinggg:.1em;text-decoration:none;transition:opacity .3s}
.meta_{display:table-cell;vertical-align:middle;text-align:center}
@-webkit-keyframes slideUpso {
from {-webkit-transform: translate(-700px, 0)}
to { -webkit-transform: translate(0px, 0px)}
}
.intro_label h2{
-webkit-animation: slideUpso 3s;
-moz-animation: slideUpso 3s;
-ms-animation: slideUpso 3s;
-o-animation: slideUpso 3s;
animation: slideUpso 3s;
}
@-webkit-keyframes slideUpsos {
from {-webkit-transform: translate(0, 1000px)}
to { -webkit-transform: translate(0px, 0px)}
}
.intro_label p{
-webkit-animation: slideUpsos 3s;
-moz-animation: slideUpsos 3s;
-ms-animation: slideUpsos 3s;
-o-animation: slideUpsos 3s;
animation: slideUpsos 3s;
}
</style>
<b:else/>
<!-- hiển thị trên PC -->
<style>
#intro_homepage{ position: Inherit;
display: table;
width: 30%;
height: 300px;
margin: 0!important;
padding: 0!important;
z-index: 999;
background-size: cover!important;
background: #3c3c3c;}
.intro_homepage_content{position:relative;z-index:3}
.intro_label h2{animation:zoomInUp 6s;font-size:25px;font-weight:700;color:rgba(255,255,255,.85);letter-spacinggg:0;margin:0 0 0;padding:0;font-family:"Roboto Condensed",sans-serif;text-transform:uppercase}
.intro_label p{animation: zoomInDown 4s; text-transform: uppercase; font-size: 16px; font-weight: 400; color: rgba(255,255,255,0.7); margin: 0; padding: 0; letter-spacing: 2px}
.intro_label{margin:0 auto;text-align:center;padding:0}
.intro_buttondown a{position:absolute;bottom:2%;left:50%;z-index:2;display:inline-block;-webkit-transform:translate(0,-50%);transform:translate(0,-50%);color:#fff;font:normal 400 20px/1 'Josefin Sans',sans-serif;letter-spacinggg:.1em;text-decoration:none;transition:opacity .3s}
.meta_{display:table-cell;vertical-align:middle;text-align:center}
@-webkit-keyframes slideUpso {
from {-webkit-transform: translate(-700px, 0)}
to { -webkit-transform: translate(0px, 0px)}
}
.intro_label h2{
-webkit-animation: slideUpso 3s;
-moz-animation: slideUpso 3s;
-ms-animation: slideUpso 3s;
-o-animation: slideUpso 3s;
animation: slideUpso 3s;
}
@-webkit-keyframes slideUpsos {
from {-webkit-transform: translate(0, 1000px)}
to { -webkit-transform: translate(0px, 0px)}
}
.intro_label p{
-webkit-animation: slideUpsos 3s;
-moz-animation: slideUpsos 3s;
-ms-animation: slideUpsos 3s;
-o-animation: slideUpsos 3s;
animation: slideUpsos 3s;
}
</style>
</b:if>
<!--End Css Post Intro - mau 1 dang bai viet-->
<!--End Css JavaScript mo rong -->
Phần 2 Code html, css & javascript dùng chèn trực tiếp vào trang chỉnh sửa & đăng bài viết Blogspot
ở chế độ Html
:
<script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
<style type="text/css">
#popup-giua-man-hinh .headerContainer,#popup-giua-man-hinh .bodyContainer,#popup-giua-man-hinh .footerContainer{max-width:300px;margin:0 auto;background:#FFF}
#popup-giua-man-hinh .padding{padding:0px}
#popup-giua-man-hinh .bodyContainer{min-height:600px}
#popup-giua-man-hinh .popUpBannerBox{position:fixed;background:rgba(0,0,0,0.9);width:100%;height:100%;top:0;left:0;
color:#FFF;z-index:999999;display:none}
#popup-giua-man-hinh .popUpBannerInner{max-width:300px;margin:0 auto}
#popup-giua-man-hinh .popUpBannerContent{position:fixed;top:-40px}
#popup-giua-man-hinh .closeButton{color:red;text-decoration:none;font-size:18px}
#popup-giua-man-hinh a.closeButton{float:right}
</style>
<div id="popup-giua-man-hinh">
<div class="popUpBannerBox">
<div class="popUpBannerInner">
<div class="popUpBannerContent">
<p><a href="#" class="closeButton"></a></p>
<!-- ==================== CODE HIỂN THỊ QUẢNG CÁO ====================-->
<!--intro-->
<div id='intro_homepage'>
<div class='meta_'>
<div class='intro_homepage_content'>
<div class='intro_label'>
<h2 class='_title'>
<i aria-hidden='true' class='fa fa-gg' style=' display:none; font-weight: 900;margin:0 20px 0 0'>
</i>Đọc Vị Bất Kỳ Ai
<i aria-hidden='true' class='fa fa-gg' style=' display:none; font-weight: 900;margin:0 0 0 20px'></i>
<aa style='padding: 0 10px; background: #52537d; border-radius: 10px;'>
Sách hay</aa>
</h2>
<!-- <p>Blog chia sẽ thủ thuật Miễn Phí</p>-->
<!--QC Ads-->
<div class="separator" style="clear: both; text-align: center;">
<center>
<a href="https://go.isclix.com/deep_link/4442979790914282835?url=https://tiki.vn/doc-vi-bat-ky-ai-de-khong-bi-lua-doi-va-loi-dung-p335501.html" style="margin-left: 0em; margin-right: 0em;"><img border="0" data-original-width="300" src="https://salt.tikicdn.com/cache/w1200/media/catalog/product/d/o/docvi.u3059.d20170716.t121650.343912.jpg" /></a>
</center>
</div>
<!-- <br /><p></p>-->
<div style="border: 5px outset #FF2904;text-align: center;padding:5px;font-family: Impact,Charcoal,sans-serif;font-size: 25px;letter-spacing: 2px;word-spacing: 2px;color: #18023B;font-weight: normal;text-decoration: overline;font-style: normal;font-variant: normal;text-transform: uppercase;">
<a href="https://go.isclix.com/deep_link/4442979790914282835?url=https://tiki.vn/doc-vi-bat-ky-ai-de-khong-bi-lua-doi-va-loi-dung-p335501.html">
Xem nơi bán
</a>
</div>
<!--End QC Ads-->
</div>
</div></div>
<div class='meta_'>
</div>
</div>
<!--End intro-->
<!-- ==================== END HIỂN THỊ QUẢNG CÁO ====================-->
</div>
</div>
</div>
<script type="text/javascript">
function showPopUpBanner() {
$('.popUpBannerBox').fadeIn("2000");
}
setTimeout(showPopUpBanner, 1000); //thời gian popup bắt đầu hiển thị
$('.popUpBannerBox').click(function(e) {
if ( !$(e.target).is('.popUpBannerContent, .popUpBannerContent *' ) ) {
$('.popUpBannerBox').fadeOut("2000");
return false;
}
});
$('.closeButton').click(function() {
$('.popUpBannerBox').fadeOut("2000");
return false;
});
</script>
</div>
<style type="text/css">
#popup-giua-man-hinh .headerContainer,#popup-giua-man-hinh .bodyContainer,#popup-giua-man-hinh .footerContainer{max-width:300px;margin:0 auto;background:#FFF}
#popup-giua-man-hinh .padding{padding:0px}
#popup-giua-man-hinh .bodyContainer{min-height:600px}
#popup-giua-man-hinh .popUpBannerBox{position:fixed;background:rgba(0,0,0,0.9);width:100%;height:100%;top:0;left:0;
color:#FFF;z-index:999999;display:none}
#popup-giua-man-hinh .popUpBannerInner{max-width:300px;margin:0 auto}
#popup-giua-man-hinh .popUpBannerContent{position:fixed;top:-40px}
#popup-giua-man-hinh .closeButton{color:red;text-decoration:none;font-size:18px}
#popup-giua-man-hinh a.closeButton{float:right}
</style>
<div id="popup-giua-man-hinh">
<div class="popUpBannerBox">
<div class="popUpBannerInner">
<div class="popUpBannerContent">
<p><a href="#" class="closeButton"></a></p>
<!-- ==================== CODE HIỂN THỊ QUẢNG CÁO ====================-->
<!--intro-->
<div id='intro_homepage'>
<div class='meta_'>
<div class='intro_homepage_content'>
<div class='intro_label'>
<h2 class='_title'>
<i aria-hidden='true' class='fa fa-gg' style=' display:none; font-weight: 900;margin:0 20px 0 0'>
</i>Đọc Vị Bất Kỳ Ai
<i aria-hidden='true' class='fa fa-gg' style=' display:none; font-weight: 900;margin:0 0 0 20px'></i>
<aa style='padding: 0 10px; background: #52537d; border-radius: 10px;'>
Sách hay</aa>
</h2>
<!-- <p>Blog chia sẽ thủ thuật Miễn Phí</p>-->
<!--QC Ads-->
<div class="separator" style="clear: both; text-align: center;">
<center>
<a href="https://go.isclix.com/deep_link/4442979790914282835?url=https://tiki.vn/doc-vi-bat-ky-ai-de-khong-bi-lua-doi-va-loi-dung-p335501.html" style="margin-left: 0em; margin-right: 0em;"><img border="0" data-original-width="300" src="https://salt.tikicdn.com/cache/w1200/media/catalog/product/d/o/docvi.u3059.d20170716.t121650.343912.jpg" /></a>
</center>
</div>
<!-- <br /><p></p>-->
<div style="border: 5px outset #FF2904;text-align: center;padding:5px;font-family: Impact,Charcoal,sans-serif;font-size: 25px;letter-spacing: 2px;word-spacing: 2px;color: #18023B;font-weight: normal;text-decoration: overline;font-style: normal;font-variant: normal;text-transform: uppercase;">
<a href="https://go.isclix.com/deep_link/4442979790914282835?url=https://tiki.vn/doc-vi-bat-ky-ai-de-khong-bi-lua-doi-va-loi-dung-p335501.html">
Xem nơi bán
</a>
</div>
<!--End QC Ads-->
</div>
</div></div>
<div class='meta_'>
</div>
</div>
<!--End intro-->
<!-- ==================== END HIỂN THỊ QUẢNG CÁO ====================-->
</div>
</div>
</div>
<script type="text/javascript">
function showPopUpBanner() {
$('.popUpBannerBox').fadeIn("2000");
}
setTimeout(showPopUpBanner, 1000); //thời gian popup bắt đầu hiển thị
$('.popUpBannerBox').click(function(e) {
if ( !$(e.target).is('.popUpBannerContent, .popUpBannerContent *' ) ) {
$('.popUpBannerBox').fadeOut("2000");
return false;
}
});
$('.closeButton').click(function() {
$('.popUpBannerBox').fadeOut("2000");
return false;
});
</script>
</div>
Code 2 chèn trực tiếp vào trang chỉnh sửa & đăng bài viết Blogspot
ở chế độ Html :
<script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
<style type="text/css">
#popup-giua-man-hinh .headerContainer,#popup-giua-man-hinh .bodyContainer,#popup-giua-man-hinh .footerContainer{max-width:960px;margin:0 auto;background:#FFF}
#popup-giua-man-hinh .padding{padding:20px}
#popup-giua-man-hinh .bodyContainer{min-height:500px}
#popup-giua-man-hinh .popUpBannerBox{position:fixed;background:rgba(0,0,0,0.9);width:100%;height:100%;top:0;left:0;
color:#FFF;z-index:999999;display:none}
#popup-giua-man-hinh .popUpBannerInner{max-width:300px;margin:0 auto}
#popup-giua-man-hinh .popUpBannerContent{position:fixed;top:150px}
#popup-giua-man-hinh .closeButton{color:red;text-decoration:none;font-size:18px}
#popup-giua-man-hinh a.closeButton{float:right}
</style>
<div id="popup-giua-man-hinh">
<div class="popUpBannerBox">
<div class="popUpBannerInner">
<div class="popUpBannerContent">
<p><a href="#" class="closeButton"></a></p>
<!-- ==================== CODE HIỂN THỊ QUẢNG CÁO ====================-->
<a href="https://go.isclix.com/deep_link/4442979790914282835?url=https://hoanghamobile.com/dien-thoai-di-dong/oppo-reno5-5g-chinh-hang"><img src="https://hoanghamobile.com/i/productlist/dsp/Uploads/2021/02/20/22222.png"/></a>
<!-- ==================== END HIỂN THỊ QUẢNG CÁO ====================-->
</div>
</div>
</div>
<script type="text/javascript">
function showPopUpBanner() {
$('.popUpBannerBox').fadeIn("2000");
}
setTimeout(showPopUpBanner, 1000); //thời gian popup bắt đầu hiển thị
$('.popUpBannerBox').click(function(e) {
if ( !$(e.target).is('.popUpBannerContent, .popUpBannerContent *' ) ) {
$('.popUpBannerBox').fadeOut("2000");
return false;
}
});
$('.closeButton').click(function() {
$('.popUpBannerBox').fadeOut("2000");
return false;
});
</script>
</div>
<style type="text/css">
#popup-giua-man-hinh .headerContainer,#popup-giua-man-hinh .bodyContainer,#popup-giua-man-hinh .footerContainer{max-width:960px;margin:0 auto;background:#FFF}
#popup-giua-man-hinh .padding{padding:20px}
#popup-giua-man-hinh .bodyContainer{min-height:500px}
#popup-giua-man-hinh .popUpBannerBox{position:fixed;background:rgba(0,0,0,0.9);width:100%;height:100%;top:0;left:0;
color:#FFF;z-index:999999;display:none}
#popup-giua-man-hinh .popUpBannerInner{max-width:300px;margin:0 auto}
#popup-giua-man-hinh .popUpBannerContent{position:fixed;top:150px}
#popup-giua-man-hinh .closeButton{color:red;text-decoration:none;font-size:18px}
#popup-giua-man-hinh a.closeButton{float:right}
</style>
<div id="popup-giua-man-hinh">
<div class="popUpBannerBox">
<div class="popUpBannerInner">
<div class="popUpBannerContent">
<p><a href="#" class="closeButton"></a></p>
<!-- ==================== CODE HIỂN THỊ QUẢNG CÁO ====================-->
<a href="https://go.isclix.com/deep_link/4442979790914282835?url=https://hoanghamobile.com/dien-thoai-di-dong/oppo-reno5-5g-chinh-hang"><img src="https://hoanghamobile.com/i/productlist/dsp/Uploads/2021/02/20/22222.png"/></a>
<!-- ==================== END HIỂN THỊ QUẢNG CÁO ====================-->
</div>
</div>
</div>
<script type="text/javascript">
function showPopUpBanner() {
$('.popUpBannerBox').fadeIn("2000");
}
setTimeout(showPopUpBanner, 1000); //thời gian popup bắt đầu hiển thị
$('.popUpBannerBox').click(function(e) {
if ( !$(e.target).is('.popUpBannerContent, .popUpBannerContent *' ) ) {
$('.popUpBannerBox').fadeOut("2000");
return false;
}
});
$('.closeButton').click(function() {
$('.popUpBannerBox').fadeOut("2000");
return false;
});
</script>
</div>
Code Intro đẹp hiển thị sản phẩm tiếp thị liên kết giữa trang
( mẫu 1 ) :
<style>
#intro_homepage{position:relative;display:table;width:100%;height:60vh;margin:0!important;padding:0!important;z-index:999;background:url(hinh-nen) no-repeat center center!important;background-size:cover!important}
#intro_homepage:before{content: ''; opacity: 1; position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: 0; background: linear-gradient(transparent, #050a18)}
#intro_homepage:after{content:'';z-index:0;position:absolute;top:0;right:0;bottom:0;left:0;background-image:linear-gradient(transparent,rgba(51, 51, 51, 0.15) 0%,rgba(12,23,36,0.4))}
.intro_homepage_content{position:relative;z-index:3}
.intro_label h2{animation:zoomInUp 6s;font-size:45px;font-weight:700;color:rgba(255,255,255,.85);letter-spacinggg:0;margin:0 0 .25em;padding:0;font-family:"Roboto Condensed",sans-serif;text-transform:uppercase}
.intro_label p{animation: zoomInDown 4s; text-transform: uppercase; font-size: 16px; font-weight: 400; color: rgba(255,255,255,0.7); margin: 0; padding: 0; letter-spacing: 2px}
.intro_label{margin:0 auto;text-align:center;padding:0}
.intro_buttondown a{position:absolute;bottom:10%;left:50%;z-index:2;display:inline-block;-webkit-transform:translate(0,-50%);transform:translate(0,-50%);color:#fff;font:normal 400 20px/1 'Josefin Sans',sans-serif;letter-spacinggg:.1em;text-decoration:none;transition:opacity .3s}
.meta_{display:table-cell;vertical-align:middle;text-align:center}
#intro_buttondown a span{position:absolute;top:-45px;left:50%;width:22px;height:22px;margin-left:-12px;border-left:1px solid #FFF;border-bottom:1px solid #fff;-webkit-transform:rotate(-45deg);transform:rotate(-45deg);-webkit-animation:sdb05 2s infinite;animation:sdb05 2s infinite;box-sizing:border-box}
#intro_buttondown a{animation:zoomInDownn 8s}
@-webkit-keyframes sdb05{0%{opacity:0}50%{opacity:1}100%{opacity:0}}
@keyframes sdb05{0%{opacity:0}50%{opacity:1}100%{opacity:0}}
#intro_buttondown a span:nth-of-type(1){-webkit-animation-delay:0s;animation-delay:0s}
#intro_buttondown a span:nth-of-type(2){-webkit-animation-delay:.2s;animation-delay:.2s}
#intro_buttondown a span:nth-of-type(3){-webkit-animation-delay:.4s;animation-delay:.4s}
.xem-hd{text-align:right;width:1080px;font-size:16px;color:#fff;text-transform:uppercase;letter-spacinggg:0;font-weight:300;position:absolute;bottom:20px;right:30px;z-index:9999}
.xem-hd a{color:rgba(255,255,255,.5);animation:slideToLeft 2s}
.xem-hd a:hover{color:#fff}
</style>
<div id='intro_homepage'>
<div class='meta_'>
<div class='intro_homepage_content'>
<div class='intro_label'>
<h2 class='_title'>
<i aria-hidden='true' class='fa fa-gg' style='margin:0 20px 0 0'/>
OPPO Reno5 5G chính hãng giá tốt
<i aria-hidden='true' class='fa fa-gg' style='margin:0 0 0 20px'/></h2>
<!--<p>An Khang Thịnh Vương - Vạn Sự Như Ý - Bác Sĩ Windows</p>-->
<!--QC Ads-->
<div class="separator" style="clear: both; text-align: center;"><a href="https://hoanghamobile.com/i/productlist/dsp/Uploads/2021/02/20/22222.png" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="370" data-original-width="370" src="https://hoanghamobile.com/i/productlist/dsp/Uploads/2021/02/20/22222.png" /></a></div><br /><p></p>
<div style="border: 5px outset #FF2904;text-align: center;padding:10px;font-family: Impact,Charcoal,sans-serif;font-size: 25px;letter-spacing: 2px;word-spacing: 2px;color: #18023B;font-weight: normal;text-decoration: overline;font-style: normal;font-variant: normal;text-transform: uppercase;">
<a href="https://go.isclix.com/deep_link/4442979790914282835?url=https://hoanghamobile.com/dien-thoai-di-dong/oppo-reno5-5g-chinh-hang">
Xem nơi bán
</a>
</div>
<!--End QC Ads-->
</div>
</div></div>
<div class='xem-hd'>
<!--
<a href='/' target='blank' title='Xem hướng dẫn'>Xem hd <i class='fa fa-angle-right'/>
</a>
-->
</div>
<section class='intro_buttondown' id='intro_buttondown'>
<a href='#continue'><span/><span style='margin-top: 10px'/><span style='margin-top: 20px'/></a>
</section>
<div class='meta_'>
</div>
</div>
<div id='continue'/>
#intro_homepage{position:relative;display:table;width:100%;height:60vh;margin:0!important;padding:0!important;z-index:999;background:url(hinh-nen) no-repeat center center!important;background-size:cover!important}
#intro_homepage:before{content: ''; opacity: 1; position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: 0; background: linear-gradient(transparent, #050a18)}
#intro_homepage:after{content:'';z-index:0;position:absolute;top:0;right:0;bottom:0;left:0;background-image:linear-gradient(transparent,rgba(51, 51, 51, 0.15) 0%,rgba(12,23,36,0.4))}
.intro_homepage_content{position:relative;z-index:3}
.intro_label h2{animation:zoomInUp 6s;font-size:45px;font-weight:700;color:rgba(255,255,255,.85);letter-spacinggg:0;margin:0 0 .25em;padding:0;font-family:"Roboto Condensed",sans-serif;text-transform:uppercase}
.intro_label p{animation: zoomInDown 4s; text-transform: uppercase; font-size: 16px; font-weight: 400; color: rgba(255,255,255,0.7); margin: 0; padding: 0; letter-spacing: 2px}
.intro_label{margin:0 auto;text-align:center;padding:0}
.intro_buttondown a{position:absolute;bottom:10%;left:50%;z-index:2;display:inline-block;-webkit-transform:translate(0,-50%);transform:translate(0,-50%);color:#fff;font:normal 400 20px/1 'Josefin Sans',sans-serif;letter-spacinggg:.1em;text-decoration:none;transition:opacity .3s}
.meta_{display:table-cell;vertical-align:middle;text-align:center}
#intro_buttondown a span{position:absolute;top:-45px;left:50%;width:22px;height:22px;margin-left:-12px;border-left:1px solid #FFF;border-bottom:1px solid #fff;-webkit-transform:rotate(-45deg);transform:rotate(-45deg);-webkit-animation:sdb05 2s infinite;animation:sdb05 2s infinite;box-sizing:border-box}
#intro_buttondown a{animation:zoomInDownn 8s}
@-webkit-keyframes sdb05{0%{opacity:0}50%{opacity:1}100%{opacity:0}}
@keyframes sdb05{0%{opacity:0}50%{opacity:1}100%{opacity:0}}
#intro_buttondown a span:nth-of-type(1){-webkit-animation-delay:0s;animation-delay:0s}
#intro_buttondown a span:nth-of-type(2){-webkit-animation-delay:.2s;animation-delay:.2s}
#intro_buttondown a span:nth-of-type(3){-webkit-animation-delay:.4s;animation-delay:.4s}
.xem-hd{text-align:right;width:1080px;font-size:16px;color:#fff;text-transform:uppercase;letter-spacinggg:0;font-weight:300;position:absolute;bottom:20px;right:30px;z-index:9999}
.xem-hd a{color:rgba(255,255,255,.5);animation:slideToLeft 2s}
.xem-hd a:hover{color:#fff}
</style>
<div id='intro_homepage'>
<div class='meta_'>
<div class='intro_homepage_content'>
<div class='intro_label'>
<h2 class='_title'>
<i aria-hidden='true' class='fa fa-gg' style='margin:0 20px 0 0'/>
OPPO Reno5 5G chính hãng giá tốt
<i aria-hidden='true' class='fa fa-gg' style='margin:0 0 0 20px'/></h2>
<!--<p>An Khang Thịnh Vương - Vạn Sự Như Ý - Bác Sĩ Windows</p>-->
<!--QC Ads-->
<div class="separator" style="clear: both; text-align: center;"><a href="https://hoanghamobile.com/i/productlist/dsp/Uploads/2021/02/20/22222.png" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="370" data-original-width="370" src="https://hoanghamobile.com/i/productlist/dsp/Uploads/2021/02/20/22222.png" /></a></div><br /><p></p>
<div style="border: 5px outset #FF2904;text-align: center;padding:10px;font-family: Impact,Charcoal,sans-serif;font-size: 25px;letter-spacing: 2px;word-spacing: 2px;color: #18023B;font-weight: normal;text-decoration: overline;font-style: normal;font-variant: normal;text-transform: uppercase;">
<a href="https://go.isclix.com/deep_link/4442979790914282835?url=https://hoanghamobile.com/dien-thoai-di-dong/oppo-reno5-5g-chinh-hang">
Xem nơi bán
</a>
</div>
<!--End QC Ads-->
</div>
</div></div>
<div class='xem-hd'>
<!--
<a href='/' target='blank' title='Xem hướng dẫn'>Xem hd <i class='fa fa-angle-right'/>
</a>
-->
</div>
<section class='intro_buttondown' id='intro_buttondown'>
<a href='#continue'><span/><span style='margin-top: 10px'/><span style='margin-top: 20px'/></a>
</section>
<div class='meta_'>
</div>
</div>
<div id='continue'/>
Code Intro đẹp hiển thị sản phẩm tiếp thị liên kết giữa trang
( mẫu 2 ) :
<style>
#intro_homepage{ position: relative;
display: table;
width: 100%;
height: 200px;
margin: 0!important;
padding: 0!important;
z-index: 999;
background-size: cover!important;
background: #3c3c3c;}
.intro_homepage_content{position:relative;z-index:3}
.intro_label h2{animation:zoomInUp 6s;font-size:45px;font-weight:700;color:rgba(255,255,255,.85);letter-spacinggg:0;margin:0 0 0;padding:0;font-family:"Roboto Condensed",sans-serif;text-transform:uppercase}
.intro_label p{animation: zoomInDown 4s; text-transform: uppercase; font-size: 16px; font-weight: 400; color: rgba(255,255,255,0.7); margin: 0; padding: 0; letter-spacing: 2px}
.intro_label{margin:0 auto;text-align:center;padding:0}
.intro_buttondown a{position:absolute;bottom:10%;left:50%;z-index:2;display:inline-block;-webkit-transform:translate(0,-50%);transform:translate(0,-50%);color:#fff;font:normal 400 20px/1 'Josefin Sans',sans-serif;letter-spacinggg:.1em;text-decoration:none;transition:opacity .3s}
.meta_{display:table-cell;vertical-align:middle;text-align:center}
@-webkit-keyframes slideUpso {
from {-webkit-transform: translate(-700px, 0)}
to { -webkit-transform: translate(0px, 0px)}
}
.intro_label h2{
-webkit-animation: slideUpso 3s;
-moz-animation: slideUpso 3s;
-ms-animation: slideUpso 3s;
-o-animation: slideUpso 3s;
animation: slideUpso 3s;
}
@-webkit-keyframes slideUpsos {
from {-webkit-transform: translate(0, 1000px)}
to { -webkit-transform: translate(0px, 0px)}
}
.intro_label p{
-webkit-animation: slideUpsos 3s;
-moz-animation: slideUpsos 3s;
-ms-animation: slideUpsos 3s;
-o-animation: slideUpsos 3s;
animation: slideUpsos 3s;
}
</style>
<div id='intro_homepage'>
<div class='meta_'>
<div class='intro_homepage_content'>
<div class='intro_label'>
<h2 class='_title'>
<i aria-hidden='true' class='fa fa-gg' style=' display:none; font-weight: 900;margin:0 20px 0 0'>
</i>OPPO Reno5 5G chính hãng
<i aria-hidden='true' class='fa fa-gg' style=' display:none; font-weight: 900;margin:0 0 0 20px'></i>
<aa style='padding: 0 10px; background: #52537d; border-radius: 10px;'>
giá tốt</aa>
</h2>
<!-- <p>Blog chia sẽ thủ thuật Miễn Phí</p>-->
<!--QC Ads-->
<div class="separator" style="clear: both; text-align: center;"><a href="https://hoanghamobile.com/i/productlist/dsp/Uploads/2021/02/20/22222.png" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="370" data-original-width="370" src="https://hoanghamobile.com/i/productlist/dsp/Uploads/2021/02/20/22222.png" /></a></div><br /><p></p>
<div style="border: 5px outset #FF2904;text-align: center;padding:10px;font-family: Impact,Charcoal,sans-serif;font-size: 25px;letter-spacing: 2px;word-spacing: 2px;color: #18023B;font-weight: normal;text-decoration: overline;font-style: normal;font-variant: normal;text-transform: uppercase;">
<a href="https://go.isclix.com/deep_link/4442979790914282835?url=https://hoanghamobile.com/dien-thoai-di-dong/oppo-reno5-5g-chinh-hang">
Xem nơi bán
</a>
</div>
<!--End QC Ads-->
</div>
</div></div>
<div class='meta_'>
</div>
</div>
#intro_homepage{ position: relative;
display: table;
width: 100%;
height: 200px;
margin: 0!important;
padding: 0!important;
z-index: 999;
background-size: cover!important;
background: #3c3c3c;}
.intro_homepage_content{position:relative;z-index:3}
.intro_label h2{animation:zoomInUp 6s;font-size:45px;font-weight:700;color:rgba(255,255,255,.85);letter-spacinggg:0;margin:0 0 0;padding:0;font-family:"Roboto Condensed",sans-serif;text-transform:uppercase}
.intro_label p{animation: zoomInDown 4s; text-transform: uppercase; font-size: 16px; font-weight: 400; color: rgba(255,255,255,0.7); margin: 0; padding: 0; letter-spacing: 2px}
.intro_label{margin:0 auto;text-align:center;padding:0}
.intro_buttondown a{position:absolute;bottom:10%;left:50%;z-index:2;display:inline-block;-webkit-transform:translate(0,-50%);transform:translate(0,-50%);color:#fff;font:normal 400 20px/1 'Josefin Sans',sans-serif;letter-spacinggg:.1em;text-decoration:none;transition:opacity .3s}
.meta_{display:table-cell;vertical-align:middle;text-align:center}
@-webkit-keyframes slideUpso {
from {-webkit-transform: translate(-700px, 0)}
to { -webkit-transform: translate(0px, 0px)}
}
.intro_label h2{
-webkit-animation: slideUpso 3s;
-moz-animation: slideUpso 3s;
-ms-animation: slideUpso 3s;
-o-animation: slideUpso 3s;
animation: slideUpso 3s;
}
@-webkit-keyframes slideUpsos {
from {-webkit-transform: translate(0, 1000px)}
to { -webkit-transform: translate(0px, 0px)}
}
.intro_label p{
-webkit-animation: slideUpsos 3s;
-moz-animation: slideUpsos 3s;
-ms-animation: slideUpsos 3s;
-o-animation: slideUpsos 3s;
animation: slideUpsos 3s;
}
</style>
<div id='intro_homepage'>
<div class='meta_'>
<div class='intro_homepage_content'>
<div class='intro_label'>
<h2 class='_title'>
<i aria-hidden='true' class='fa fa-gg' style=' display:none; font-weight: 900;margin:0 20px 0 0'>
</i>OPPO Reno5 5G chính hãng
<i aria-hidden='true' class='fa fa-gg' style=' display:none; font-weight: 900;margin:0 0 0 20px'></i>
<aa style='padding: 0 10px; background: #52537d; border-radius: 10px;'>
giá tốt</aa>
</h2>
<!-- <p>Blog chia sẽ thủ thuật Miễn Phí</p>-->
<!--QC Ads-->
<div class="separator" style="clear: both; text-align: center;"><a href="https://hoanghamobile.com/i/productlist/dsp/Uploads/2021/02/20/22222.png" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="370" data-original-width="370" src="https://hoanghamobile.com/i/productlist/dsp/Uploads/2021/02/20/22222.png" /></a></div><br /><p></p>
<div style="border: 5px outset #FF2904;text-align: center;padding:10px;font-family: Impact,Charcoal,sans-serif;font-size: 25px;letter-spacing: 2px;word-spacing: 2px;color: #18023B;font-weight: normal;text-decoration: overline;font-style: normal;font-variant: normal;text-transform: uppercase;">
<a href="https://go.isclix.com/deep_link/4442979790914282835?url=https://hoanghamobile.com/dien-thoai-di-dong/oppo-reno5-5g-chinh-hang">
Xem nơi bán
</a>
</div>
<!--End QC Ads-->
</div>
</div></div>
<div class='meta_'>
</div>
</div>
Các code trên thích hợp dùng đăng bài tiếp thị liên kết - cách kiếm tiền online hiệu quả dành cho các blogger viết lách.
Tham khảo :
- https://www.dichvumaytinhhcm.com/vn/thu-thuat/details/huong-dan-tao-popup-quang-cao-giua-man-hinh-website-blog-250
- https://www.sharetemplateseo.com/2016/11/popup-quang-cao-giua-man-hinh-cho-blogspot.html
- https://megacode.vn/files/view/huong-dan-tao-popup-quang-cao-giua-man-hinh-website-blog-4642.html
- https://www.nguyentruongson.info/2016/06/huong-dan-tao-popup-quang-cao-hien-giua-man-hinh-website-blogspot.html
- https://www.share123.vn/2013/12/huong-dan-tao-popup-quang-cao-giua-man.html
- https://www.zubicloud.com/thu-thuat-tao-popup-quang-cao-hien-thi-giua-trang-cho-website-blogspot
- [Popup đăng ký] https://www.bacsiwindows.com/2017/12/tao-popup-dang-ky-nhan-bai-viet-qua-email-tuyet-dep-cho-blogspot.html
- [Popup thông báo] https://www.giaodien.blog/2020/11/tao-thong-bao-popup-giua-ma-hinh-blog.html
- https://chiase78.blogspot.com/2017/12/tao-popup-quang-cao-giua-man-hinh.html
- [Intro] https://www.bacsiwindows.com/2017/11/tao-intro-tuyet-dep-cho-blogspot-chi-tu-css-va-html.html
- [Intro] https://www.honghaiblog.tech/2018/07/share-intro-hieu-ung-tuyet-ep-cho.html
- [Intro menu ] https://tempbacsiwindows.blogspot.com/2018/05/tao-menu-kem-intro-ep-cho-blogspot.html
Flagship, giá hời, đời cũ, cấu hình ngon, xem phim, chơi game, nghe nhạc cực đã. :
+ Iphone 11 :
Xem Tại Đây
+ Iphone 12 :
Xem Tại Đây
+ Iphone 13 :
Xem Tại Đây
+ Samsung Galaxy S20 FE :
Xem Tại Đây
+ Samsung Galaxy S22 Ultra 5G :
Xem Tại Đây
+ Vivo V23 5G 8GB/128GB :
Xem Tại Đây
+ Vivo V25e 4G 8GB/128GB :
Xem Tại Đây
+ Redmi Note 11 Pro 5G :
Xem Tại Đây
+ Xiaomi 12 Pro :
Xem Tại Đây
Điện Thoại Giá Rẻ, Chạy Grab, Tài Xế Công Nghệ :
+ Poco M4 Pro :
Xem Tại Đây
+ Oppo A54 :
Xem Tại Đây
+ Xiaomi Redmi Note 11 :
Xem Tại Đây
+ Samsung Galaxy A23 :
Xem Tại Đây
Smartphone Gaming Giá Rẻ, Tải App Kiếm Tiền Online, Cài Đặt Ứng Dụng Học Tập, Giải Trí, Xem Phim Nghe Nhạc, Chơi Game Online, :
+ Tecno Poca 3 :
Xem Tại Đây
+ Realme narzo 50i Prime :
Xem Tại Đây
