|
Custom 404 error Blogger |
"The 404 or Not Found error message is a
HTTP standard response code indicating that
the client was able to communicate with the
server, but the server could not find what was
requested." In simple words the page that will
be displayed when the actual page is not
found is called a 404 Error Page. Now
Blogger Error pages use the same
template .This would help template designers
in making up custom beautiful 404 Pages.This
tutorial will help you in setting up a Custom
stylish mouse hover effect 404 page for your
Blog.You may seen many 404 designs and
images but this is very stylish and and made
up of no image .This will also make your blog
more professional.This is the much needed
one for Every developing or developed blog. Lets see the Live Demo
By Default, your Blogger Error page will display error message
You can Customize this message beautifully to something else from the Blogger Settings.
Follow Following Steps To Create 404 Error Page
- »Go to Blogger>> setting>>search Preference
- »Select 404 Error Page
- »Copy Following Code and paste There.
CODE:
<style type="text/css"> #error-404
{ border: 20px solid #1B1B1B; border-
radius: 240px 240px 240px 240px;
height: 240px; margin: 0 auto 40px;
text-align: center; transition: all 0.8s
ease 0s; width: 240px; }
#error-404:hover { border-color:
#333; } #error-404 span { color:
#FA4C29; font-size: 100px; font-weight:
bold; line-height: 240px; } .large-heading
{ font-size: 48px; line-height:
1.2em; } .light-heading { font-weight:
400; } .status-msg-bg { background-
color: transparent; } .sidebar-
wrapper, .page-header { display:
none; } .main-wrapper { margin-right:
0; } .outer-wrapper { min-height:
0; } .status-msg-border { border: 0
none; } </style> <div id="error-404">
<span>404</span>
</div> <h1 class="large-heading"
style="text-align: center;">Page not
found.</h1> <h2 class="light-heading"
style="text-align: center;">Please check that there isn’t a type in your
URL.</h2>
No comments:
Post a Comment
Notice: Don't add "backlink". Text with Link will automatically Removed.