Code trang trí tết đẹp cho website

[PVS]

Hôm này mình sẽ hướng dẫn cho các bạn cách chèn code tết cho website, cực nhanh và đơn giản, nhưng cũng không kém phần đẹp mắt.

Cách làm như sau:
Vào ACP => Template => Footer => chèn vào cuối cùng đoạn code sau:

<style type="text/css">body{padding-bottom:20px}</style><a href="http://vnxf.vn" target="_blank"><img style="position:fixed;z-index:9999;top:0;left:0" src="images/banner_left.png" _cke_saved_src="images/banner_left.png"/></a><a href="http://vnxf.vn/" target="_blank"><img style="position:fixed;z-index:9999;top:0;right:0" src="images/banner_right.png"/></a><div style="position:fixed;z-index:9999;bottom:-50px;left:0;width:100%;height:104px;background:url(images/nentet.png) repeat-x bottom left;"></div><a href="http://vnxf.vn/" target="_blank"><img style="position:fixed;z-index:9999;bottom:20px;left:20px" src="images/banner_header.png"/></a>

Và để đẹp mắt hơn với pháo hoa ngày tết nữa các bạn làm theo cách sau nhé, cách này mình mới thử tên xenforo thôi, những mã nguồn khác các bạn tự mày mò tùy biến thêm.
Cách làm như sau:
Bước 1: Dowload file bên dưới về up lên thư mục gốc của hosting ngang hàng với admin.php
Bước 2: Vào ACP => mở template page_container_js_head lên chèn vào cuối cùng đoạn

<script type="text/javascript" src="FireWorksNewYear.js"></script>

Như vậy là xong rồi.

Quay ra trang chủ và cảm nhận nhé, thật đơn giản phải không? Code này có thể chèn cho bất kỳ mã nguồn nào không nhất thiết phải là xenforo nhé.

Demo:

Chúc các bạn thành công.

Nguồn: bvn.vn​

 

[Jindo_Katori]

Phải chờ 1 năm nữa mới được sài code này lâu vãi ra.
Bác!
Làm phát xe tăng kỷ niệm 40 năm giải phóng tất cả các mem cùng sài cho nó xôm bác.

 

[PVS]

Phải chờ 1 năm nữa mới được sài code này lâu vãi ra.
Bác!
Làm phát xe tăng kỷ niệm 40 năm giải phóng tất cả các mem cùng sài cho nó xôm bác.

để mình tìm ảnh làm xem thử

 

[ntphong]

đang tải về ko có file hình thì làm sau cài đây bác. bổ sung file hình giúp bác ơi.

 

[PVS]

để mình tìm lại xem còn không @@

 

[ntphong]

để mình tìm lại xem còn không @@

Hình ảnh treo đ1o bác, tải về giải nến ra chỉ có mỗi file này FireWorksNewYeard.js nên mới nhờ bác bổ sung hình đó.

 

[PVS]

Update nha

 

[tranthanh]

đà làm nhưng cái hình hơi to che mất 1 số phần không đọc được .

 

[PVS]

thì chỉnh cho nó nhỏ lại, như hình demo là mình tự làm đó @@

 

[ntphong]

Đs4 ok rùi, thank bác. quá đẹp luôn.

 

[ntphong]

Bác ơi xem giúp cái này,

sao khi lên diie65n thoại cho nó mất dc bác. như gì vào giao diện nhỏ nó che mất tiêu bài viết rùi.

 

[PVS]

à cái này không responsive @@

 

[Jindo_Katori]

à cái này không responsive @@

thế thì e ko dám sài.
mem của e toàn mobile như e

 

[chanhnghiem]

à cái này không responsive @@

cái này ko responsive thì có cách nào không hiển thị trên mobile không a. như wordpress hàm
if (wp_mobile)
else
if (wp_pc)

 

[PVS]

có thì chắc có, nhưng phải nhờ các cao nhân chuyên về responsive này giúp đỡ ^^

 

[NimGiaMinh]

<style type="text/css">
body{padding-bottom:20px}
@media (max-width: 767px) {
  .banner_left img,.banner_right img{
display:none;
}
}
@media (min-width: 768px) and (max-width: 991px) {
  .banner_left img,.banner_right img{
width:100px;
}
}

@media (min-width: 992px){
  .banner_left img,.banner_right img{
width:150px;
}
}
</style>
<div class="banner_left" style="position:fixed;z-index:9999;top:0;left:0">
<a href="http://vnxf.vn" target="_blank">
<img  src="images/banner_left.png" _cke_saved_src="images/banner_left.png"/>
</a>
</div>
<div class="banner_right" style="position:fixed;z-index:9999;top:0;right:0" >
<a href="http://vnxf.vn/" target="_blank">
<img src="images/banner_right.png"/>
</a>
</div>
<div style="position:fixed;z-index:9999;bottom:-50px;left:0;width:100%;height:104px;background:url(images/nentet.png) repeat-x bottom left;">
</div>
<a href="http://vnxf.vn/" target="_blank">
<img style="position:fixed;z-index:9999;bottom:20px;left:20px" src="images/banner_header.png"/>
</a>

Dùng code này để responsive

 

[daklak1985]

<style type="text/css">
body{padding-bottom:20px}
@media (max-width: 767px) {
  .banner_left img,.banner_right img{
display:none;
}
}
@media (min-width: 768px) and (max-width: 991px) {
  .banner_left img,.banner_right img{
width:100px;
}
}

@media (min-width: 992px){
  .banner_left img,.banner_right img{
width:150px;
}
}
</style>
<div class="banner_left" style="position:fixed;z-index:9999;top:0;left:0">
<a href="http://vnxf.vn" target="_blank">
<img  src="images/banner_left.png" _cke_saved_src="images/banner_left.png"/>
</a>
</div>
<div class="banner_right" style="position:fixed;z-index:9999;top:0;right:0" >
<a href="http://vnxf.vn/" target="_blank">
<img src="images/banner_right.png"/>
</a>
</div>
<div style="position:fixed;z-index:9999;bottom:-50px;left:0;width:100%;height:104px;background:url(images/nentet.png) repeat-x bottom left;">
</div>
<a href="http://vnxf.vn/" target="_blank">
<img style="position:fixed;z-index:9999;bottom:20px;left:20px" src="images/banner_header.png"/>
</a>

Dùng code này để responsive

Chèn vào đâu vậy,tớ chèn vào trước </header> không đc

 

[daklak1985]

Làm sao để hình câu đối đó mất trên điện thoại đc nhĩ?mình chỉ muốn nó hiển thị trên máy tính thôi,thanks giúp với cậu @PVS

 

[leejuu]

Cái này đã có ai chỉnh để hiện lên trang điện thoại chưa vậy. cho mình hướng dẫn với . sắp tết rồi

 

[daklak1985]

Code trên tất cả các dòng điện thoại khác vẫn ẩn đc nhưng riêng dòng ipad có kích thước màn hình 768x1024 thì nó không ẩn,nó vẫn hiển thị 2 banner ở 2 bên,ai biết cách fix không hướng dẫn mình với,thanks !