» » Code popup thông báo xuất hiện chỉ 1 lần khi vào trang web blogspot

Code popup thông báo xuất hiện chỉ 1 lần khi vào trang web blogspot

Code popup xuất hiện chỉ 1 lần khi vào trang web blogspot. Hướng tạo popup thông báo,banner quảng cáo xuất hiện chỉ 1 lần khi vào trang web blogspot.

Hôm nay Bít Tuốt sẽ hướng dẫn các bạn tạo code tạo popup thông báo hay banner thông báo,quảng cáo...chỉ lần đầu tiên vào website không xuất hiện thêm nữa khí vào đọc các bài viết khác nhau để không gây khó chịu cho người dùng


Code popup thông báo xuất hiện chỉ 1 lần khi vào trang web blogspot

Cách thực hiện như sau:

Bước 1: Thêm đoạn code sau lên trên thẻ đóng </head>

<style >
.modal-bg {
position: fixed;
height: 100%;
width: 100%;
background: rgba(0,0,0,.8);
z-index: 999;
display: none;
top: 0;
left: 0;
}
.modal {
visibility: hidden;
text-align:center;
top: -400px; 
left: 40%;
margin-left: -250px;
width: 690px;
background: url(modal-gloss.png) no-repeat -200px -80px;
position: absolute;
z-index: 9999;
padding: 30px 40px 34px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
border-radius: 5px;
-moz-box-shadow: 0 0 10px rgba(0,0,0,.4);
-webkit-box-shadow: 0 0 10px rgba(0,0,0,.4);
-box-shadow: 0 0 10px rgba(0,0,0,.4);
}

.modal.small { width: 200px; margin-left: -140px;}
.modal.medium { width: 400px; margin-left: -240px;}
.modal.large { width: 600px; margin-left: -340px;}
.modal.xlarge { width: 800px; margin-left: -440px;}

.modal .close-modal {
font-size: 42px;
line-height: .5;
position: absolute;
top: 24px;
right: 33px;
color: red;
text-shadow: 0 -1px 1px rbga(0,0,0,.6);
font-weight: bold;
cursor: pointer;
}
.big-link { display:block; margin-top: 100px; text-align: center; font-size: 70px; color: #06f; }
</style>
  <!-- <script type="text/javascript" src="jquery-1.4.4.min.js"></script> -->
  <script type="text/javascript" src="http://code.jquery.com/jquery-1.9.1.js"></script>
  <script type="text/javascript" src="https://seovnpro.googlecode.com/files/popup.js"></script>


<script type="text/javascript" >
    jQuery.noConflict();      /* dòng chống conflict jquery */
    jQuery(window).load(function() {
        if(document.cookie.indexOf("adf") == -1) /*  Bỏ dòng này thì nó hiện thông báo liên tục mỗi khi mở web lên rất là phiền  */
        {
            document.cookie = "popunder1=adf";
            jQuery('#myModal').bittuotblog(jQuery('#myModal').data());
        }
    });
</script>
<div id="myModal" class="modal">
   <img src="http://hyundaihillstate.com.vn/wp-content/uploads/2014/03/Untitled.png" />
   <a class="close-modal">X</a>
</div>


Chú ý:
- Các bạn thay đổi các thuộc trình trong css phủ hợp để hiển thị tốt trên web nhé
- Thay phần  <img src="link ảnh cảu bạn cần hiển thi" />   bằng hình ảnh của bạn nhé. Bạn có thể thay nó bằng đoạn text thông báo túy ý cũng dc
- Còn đối với đoạn này: <script type="text/javascript" src="http://code.jquery.com/jquery-1.9.1.js"></script> bạn có thể bỏ đi nếu nó không chạy thì có thể do bị xung đột jquery hoặc javascript.




Code popup thông báo xuất hiện chỉ 1 lần khi vào trang web blogspot

Code popup thông báo xuất hiện chỉ 1 lần khi vào trang web blogspot

Bạn đang xem Code popup thông báo xuất hiện chỉ 1 lần khi vào trang web blogspot tại Blog Bít Tuốt Đừng quên nhấn LIKE Chia Sẻ để ủng hộ Bít Tuốt Blog nếu bài viết có ích !
Like Bít Tuốt Blog trên Facebook để ủng hộ mình nhé

«
Next
Newer Post
»
Previous
Older Post

9 comments:

  1. Mình muốn sửa cho kích cỡ pop-up to hơn chút thì chỉnh sửa như nào ad?

    ReplyDelete
  2. anh có thể làm một hướng dẫn tại Tag nổi bật như trang blog của anh được không ạ.

    ReplyDelete
  3. bít ơi cho mình hỏi làm sao để auto hiển thị quảng cáo trong bài viết vậy

    ReplyDelete
  4. Nhận xét này đã bị tác giả xóa.

    ReplyDelete
  5. Bít Tuốt có bài nào làm Popup kiểu subcribe email khi cuộn hết bài không? Hoặc hiện khi vào trang web cũng được.
    Cảm ơn bạn trước!

    ReplyDelete
  6. sao ko lam hướng dẫn = youtube luôn

    ReplyDelete
  7. Bạn Bít mình là Quang hay nói chuyện trên facebook đó. Mình có làm theo hướng dẫn của bạn và thành công, nhưng mà khi chuyển https cho blogspot lên top nhanh kinh nhưng mà code này không hoạt động nữa. Bít có cách nào khắc phục không ?

    ReplyDelete