Blog mới của Nguyễn Lâm Blog. Welcome

Tạo Trang Báo Lỗi 404 Đẹp Và Đơn Giản

Trong bài viết này, mình sẽ hướng dẫn cách tạo trang lỗi 404 đẹp và đơn giản trên blogspot.

Tạo Trang Báo Lỗi 404 Đẹp Và Đơn Giản

Bạn có thể xem demo bên dưới:


Cách tạo trang báo lỗi 404:

Bước 1: Vào Blogger ➤ Chủ đề ➤ Chỉnh sửa HTML.

Bước 2: Bạn hãy chèn mã HTML này vào nơi bạn muốn nó được hiển thị. Nhưng cũng không phải dán bừa đâu, hải ở trong thẻ điều kiện <b:if cond='data:view.isError'>

<div class="error__content">
  <div class="error__text">
   Quay xe đi bạn, hết đường rùi!
  </div>
 </div>

Bước 3: Các bạn chèn mã CSS này vào thẻ đóng </head> hoặc ]]></b:skin>

.error__content {
background-image: url(https://static.wikia.nocookie.net/qube-assets/f2/3962/images/404/404-page-theme-3.svg)
background-position: center 10px;
background-repeat: no-repeat;
background-size: 150%;
background-color: #ee1a41;
color: #0e191a;
min-height: 70vw;
position: relative;
text-align: center;
}
.error__text {
-webkit-box-sizing: border-box;
box-sizing: border-box;
font-size: 20px;
font-weight: 500;
margin: auto!important;
padding-top: 44vw;
width: 60vw;
}
@media only screen and (max-width: 1023px) and (min-width: 768px)
.error__text {
width: 732px;
}
@media only screen and (min-width: 768px)
.error__text {
margin: 0 auto;
}

Sau đó bấm Save để lưu lại. Đơn giản và nhanh gọn như cách nyc bỏ bạn.

 quangsangit

4 comments

  1. đổi tên Anh Trai Nắng thành Anh Trai Nắng Blog dùm a nha. Thanks!
    1. Oke :v
  2. copy không ghi nguồn
    1. bongowiki