• Trang chủ
  • Contact
  • Sitemap
  • Policy
  • Services
Thủ Thuật Windows, Internet, Blogspot
  • Thủ Thuật
  • Windows
  • Tutorials
  • Software
  • Internet
  • Blogspot
Home » Blogger » CSS » Hướng dẫn tạo trang 404 thân thiện cho blogger/blogspot

Hướng dẫn tạo trang 404 thân thiện cho blogger/blogspot

Posted by Akat Suki in Blogger,CSS at 12/08/2014 11, Comments
Nếu bạn đã đọc bài viết các thẻ điều kiện if else trong blogspot rồi thì có thể áp dụng kiến thức ấy và một số kiến thức về html và css để tạo ra trang báo lỗi 404 full tùy biến cho mình.

Hướng dẫn tạo trang 404 thân thiện cho blogger/blogspot

Tạo trang báo lỗi 404 full width cho blogspot

Trang báo lỗi 404 nếu thân thiện sẻ tạo được cảm dễ chịu cho độc giả khi họ vào một trang nào đó bị lỗi. Với bài viết này chỉ áp dụng thẻ điều kiện với trang 404 và một số kiến thức về html và css.

Code bài này không phải mình viết 100% mà là rip từ một site ở nước ngoài khi mình vô tình vô trang 404 của họ :3

Để tạo trang báo lỗi 404 bạn vào chỉnh sửa HTML và thêm đoạn code dưới đây vào trước thẻ đóng </body>
<b:if cond='data:blog.pageType == &quot;error_page&quot;'>
<div id='error-page'>
<div id='error-404'>
<div class='box-404'>404</div>
<h1>Trang bạn tìm kiếm không tồn tại</h1>
<p>Có thể URL bị hỏng hoặc đã bị quản trị viên blog xóa bỏ</p>
<p>Trở về trang chủ <a expr:href='data:blog.homepageUrl'><data:blog.title/></a></p>
</div>
</div>
</b:if>
Tiếp theo bạn thêm css sau vào trước thẻ đóng </style> hoặc
/* Error 404 Rip By Tips24h.net*/
#error-page{background-color:#e9e9e9;position:fixed!important;position:absolute;text-align:center;top:0;right:0;bottom:0;left:0;z-index:99999}#error-404{margin:11% auto}#error-404 .box-404{width:200px;height:200px;background:#21afa4;color:#fff;font-size:80px;line-height:200px;border-radius:10px;margin:0 auto 50px;position:relative}#error-404 .box-404::after{content:"width:0;height:0;bottom:-8px;border-color:#21afa4 transparent transparent;border-style:solid;border-width:9px 9px 0;position:absolute;left:47%}#error-404 h1{text-transform:uppercase}#error-404 p{line-height:1.7em;font-size:15px;font-family:arial}
Nếu hoàn thành xong hãy lưu mẫu và kiểm tra xem đã thành công hay chưa bằng cách truy cập vào đường dẫn tầm bậy trong blog của bạn để kiểm tra.

Hy vọng bài viết hướng dẫn tạo trang 404 đẹp cho blogger/blogspot có ích cho bạn.

Share!Tweet


Bạn đang xem bài viết Hướng dẫn tạo trang 404 thân thiện cho blogger/blogspot trên tips24h.net - Hướng dẫn tạo trang 404 thân thiện cho blogger/blogspot tương đương với đường dẫn http://www.tips24h.net/2014/12/huong-dan-tao-trang-404-than-thien-cho-blogspot.html. Nếu bạn thấy bài viết hữu ích hãy chia sẻ URL trên cho bạn bè, người thân của bạn. Vui lòng không sao chép nội dung bài viết trên www.tips24h.net nếu chưa được sự đồng ý của Admin

11 Responses to "Hướng dẫn tạo trang 404 thân thiện cho blogger/blogspot"

avatar
Reply
Tien Lam Thanhdelete1/03/2015

Bạn ơi trang của mình là http://www.muanhadat24h.net mình thực hiện trang 404 nhưng không được, bạn giúp mình kiểm tra với! tks bạn!

avatar
Reply
thuyet dangdelete1/23/2015

Trang mình cứ bị lỗi link thì sửa như nào ban http://www.bietthuvinhomes.net.vn/ lỗi thiếu url

avatar
Reply
Khoa BHLD-MTdelete4/12/2015

cảm ơn admin nhiều

avatar
Reply
Huy Nguyễndelete5/22/2015

|o|

avatar
Reply
Thông Tin Nhà Đấtdelete9/23/2015

mình làm như bạn nhưng trang của mình http://www.thongtinduannhadat.com/ mình thực hiện 404 nhưng vẫn ko thấy được,bạn xem cho mình với

avatar
Reply
Minh Nguyễndelete10/29/2015

hi cảm ơn bạn

avatar
Reply
Minh Nguyễndelete10/29/2015

hi cảm ơn bạn

avatar
Reply
Minh Nguyễndelete10/29/2015

bạn ơi mình còn 4% chưa tối ưu bộ nhớ cache bạn biết tối ưu cache ở chỗ nào chỉ giúp mình với

avatar
Reply
Phúc Võdelete1/15/2016

Cảm ơn bạn, mình chèn vào blog được rồi |o| http://toolgosvn.blogspot.com/

avatar
Reply
Tut24h .Blogspotdelete3/15/2016

Hi, mình dùng code 404 nhưng không được, xem hộ mình http://tut24h.blogspot.com/ . Cám ơn

avatar
Reply
Anh Nguyễn Ngọcdelete6/18/2016

Cách này rất hay, cảm ơn bạn chia sẻ

Khi Comment hãy click vào "Thông báo cho tôi" để theo dõi phản hồi mới nhất từ admin

Bài đăng Mới hơn
Bài đăng Cũ hơn
Trang chủ
Đăng ký:Đăng Nhận xét (Atom)

Thủ Thuật Windows


Xem tất cả thủ thuật Windows »

Internet Tips


Xem tất cả thủ thuật Internet »

Thủ thuật Hot

  • 5 cách xác định phiên bản Windows là 32 hay 64 bit
    5 cách xác định phiên bản Windows là 32 hay 64 bit
    Đối với nhiều người khi mới làm quen với Windows thì có thể bạn chưa biết cách để xác định xem máy tính của mình đang chạy Windows 32bit ha...
  • Sửa lỗi mất Snipping Tool trong Windows
    Sửa lỗi mất Snipping Tool trong Windows
    Snipping Tool là công cụ giúp bạn chụp ảnh màn hình khá đơn giản, hiệu quả và thiết thực để bạn có thể lưu lại những h...
  • Tạo shortcuts cho website trên desktop
    Tạo shortcuts cho website trên desktop
    Để tiện lợi cho việc truy cập các trang web mà bạn yêu thích thì bạn có thể bỏ ra vài giây để tạo shortcuts riêng trên destop của mình. ...
  • Top 10 website boot traffic tốt nhất 2018
    Top 10 website boot traffic tốt nhất 2018
    Boot traffic cho website bằng autosurf exchange thông qua các trang web trao đổi exchange nhìn thì có vẻ xấu nhưng chả có gì là tuyệt đối c...
  • Cách chuyển file DWG sang PDF với 4 bước đơn giản
    Cách chuyển file DWG sang PDF với 4 bước đơn giản
    Vừa qua mình có làm một số đồ án với phần mềm auto cad với file đuôi là DWG và lục lọi một hồi thì biết được cách để chuyển nó sang dạng PD...
  • Cách làm tăng chất lượng file mp3 lên 320kbps
    Cách làm tăng chất lượng file mp3 lên 320kbps
    Khi tải những bài hát miễn phí từ Mp3.zing.vn hoặc một số trang tải nhạc tại Việt Nam với tài khoản miễn phí bạn chỉ có thể tải về với chấ...
  • Sửa lỗi CPU và Disk chạy 99 100% trên Windows 7 | 8
    Sửa lỗi CPU và Disk chạy 99 100% trên Windows 7 | 8
    Mình đang sử dụng Windows 8 và mấy ngày nay liên tục thấy CPU và Disk chạy lên 99 và 100% mà chả hiểu lý do gì nhưng tìm cách để fix lỗi ...
  • Các thẻ điều kiện trong blogspot
    Các thẻ điều kiện trong blogspot
    Thẻ điều kiện trong blogspot là thành phần khá hữu ích để bạn có thể tùy chỉnh hiển thị ở những trang nhất định như trang chủ, trang tĩnh, ...
  • Hướng dẫn sử dụng firebase làm host lưu trữ cho website/blog
    Hướng dẫn sử dụng firebase làm host lưu trữ cho website/blog
    Như bài viết trước mình đã nói Google Drive Web Hosting sẻ ngừng hoạt động từ ngày 31/08/2016 nên những ai đang sử dụng dịch vụ cũ của goog...
  • Cách xóa JavaScript chặn hiển thị màn hình PageSpeed Insights
    Cách xóa JavaScript chặn hiển thị màn hình PageSpeed Insights
    JavaScript chặn hiển thị hay Remove render-blocking Javascipt là lỗi bạn hay thấy khi kiểm tra tối ưu hóa website bằng công cụ PageSpeed I...

Chuyên Mục

BloggingBrowseFacebookSEOSoftwareToolsTricksTutorialsWindowsWordpress
cho thuê căn hộ river gate

About Tips24h.net

thủ thuật windows, internet | tips24h.net

Tips24h.net | Blog chia sẻ các thủ thuật Windows, Internet, các thủ thuật blogger/blogspot và nhiều thủ thuật tin học, thủ thuật SEO, tool hoàn toàn miễn phí. Hy vọng bạn sẻ tìm được nhiều điều bổ ích khi ghé thăm website

Thủ Thuật Hay

  • Cách xóa dữ liệu web trên Google Chrome và Firefox
  • Bán hàng Facebook có bị phạt hay không?
  • Khóa thư mục không cần phần mềm trên Windows 7 8
  • Cách xác định phiên bản Windows 32 hay 64bit
  • Cách tạo bài đăng chuẩn HTML5 cho blogspot
  • Hướng dẫn cách gửi email ẩn danh
  • Cách chia sẻ dữ liệu trên Windows bằng Bluetooth
  • Hướng dẫn cách kiểm tra proxy live hay die

Bài viết nên xem

  • Tải về Unikey mới nhất phiên bản 4.2 RC3
  • Hướng dẫn cách cài đặt alexa widget cho website/blog
  • Cách xác minh tài khoản Facebook bằng điện thoại
  • Cách tăng lưu lượng truy cập cho blog/website
  • Sửa lỗi CPU và Disk chạy 99 100% trên Windows 7 | 8
  • Phần mềm xem phim chất lượng và tiện lợi nhất
  • Chặn lời mời chơi game từ Facebook
  • Hướng dẫn diệt virus trong profile Facebook

lh

Tên

Email *

Thông báo *

Develop by Tips24h.net

Powered by http://www.masteriapartmentforrent.net/

Cho thuê căn hộ The Tresor | co tuong | Bán căn hộ RiverGate

Copyright Thủ Thuật Windows, Internet, Blogspot 2016

▲