Xin chào các bạn mình đã quay lại rồi đây đã lâu rồi mình không đăng bài thì hôm nay mình xin chia sẻ chút thủ thuật nhỏ, tạo trang báo lỗi 404 giống
Twitter cực ngầu.
|
Tạo Trang Báo Lỗi 404 Giống Twitter |
Bước 1: Chèn đoạn code bên dưới sau thẻ
<body>
<b:if cond='data:blog.pageType == "error_page"'>
<style>
body {overflow:hidden!important}
#fb-error-page{position:relative;display:table;width:100%;height:100vh;margin:0!important;padding:0!important;z-index:999;background:#1DA1F3;}
.fb-error-page_content{position:relative;z-index:3}
.intro_label h2{font-size:40px;font-weight:500;color:#fff;font-family:"Roboto",sans-serif;}
.intro_label p{font-size: 16px; font-weight: 400; color: #f3f3f3; margin: 0; padding: 0; letter-spacing: 2px}
.intro_label{margin:0 auto;text-align:center;padding:2}
.btn-error-page {color: #fff!important; display: inline-block; margin: 1.5em 3px; font-size: 14px; font-weight: 500;}
.btn-error-page:after{content:'\f111';font-family:fontawesome;color:#fff!important;font-size:3px;vertical-align: middle;margin-left: 5px;}
.btn-error-page:last-child:after{display:none!important}
.btn-error-page :hover {text-decoration:underline!important;color:#fff!important}
.meta_{display:table-cell;vertical-align:middle;text-align:center}
.intro_label img{position: inherit;display: table;margin-left: 40%;}
.intro_label a:hover{color:#fff;text-decoration:underline;}
</style>
<div id='fb-error-page'>
<div class='meta_'>
<div class='fb-error-page_content'>
<div class='intro_label'>
<h2 class='_title'>Rất tiếc, trang đó không tồn tại!</h2>
<p>
<span style='color: white;'>Bạn có thể</span> <a href='https://www.nguyenngocquidz.tk/' rel='nofollow' target='_blank'><span style='color: white;'>tìm kiếm trên Nguyễn Ngọc Quí Đz</span></a> <span style='color: white;'>bằng cách sử dụng ô tìm kiếm bên dưới hoặc</span><a href='https://www.nguyenngocquidz.tk/' rel='nofollow' target='_blank'> <span style='color: #f9f9f9;'>quay lại trang chủ.</span></a>
</p>
<br/>
<style>
#abt-search-btn {
background: none repeat scroll 0 0 #359BED;
border: 0 none;
border-radius: 0 0 0 0;
color: #FFFFFF;
font-weight: 700;
padding: 10px 20px;
}
#abt-search-box {
border: 1px solid #d2d2d2;
background: none repeat scroll 0 0 #FFFFFF;
padding: 10px;
width: 186px;
}
</style>
<form action='/search' id='searchthis' method='get' style='display:inline;'>
<input id='abt-search-box' name='q' placeholder='Nhập chữ có dấu...' size='40' type='text'/>
<input id='abt-search-btn' type='submit' value='Tìm kiếm'/>
</form>
<br/>
<a class='btn-error-page' href='#go_back' onclick='goBack()' title='Quay lại trang trước'>Quay lại trang trước</a><a class='btn-error-page' href='/' title='Đi tới Bảng tin'>Đi tới Bảng tin</a><a class='btn-error-page' href='/lienhe' title='Truy cập Trung tâm trợ giúp của chúng tôi'>Truy cập Trung tâm trợ giúp của chúng tôi</a>
</div>
</div></div>
</div>
<script> function goBack() { window.history.back(); } </script>
</b:if>
Lưu HTML và xem kết quả.
hay
Trả lờiXóa<3
XóaBác Quí bỏ cái link rút gọn chỗ liên kết tui đi
Trả lờiXóarồi đấy
XóaTương tác nhé <3
Trả lờiXóađã quay lại rồi à, bài viết hữu ích lắm !
Trả lờiXóaYES <3
Xóalâu rồi ko hoạt động
Trả lờiXóatại không onl pc á :v
XóaPC ông bị sao à
Xóattt nha bac
Trả lờiXóattt
Xóattt ông nhé
Trả lờiXóattt
Xóatemplate lỗi hay sao
Trả lờiXóaĐúng rồi :( Blogger bị gì á vô Template là đứng đơ tab
Xóaa
Trả lờiXóa?
Xóa