Les nouveautés et Tutoriels de Votre Codeur | SEO | Création de site web | Création de logiciel

Loading...

seo Create a 404 Page Not Found error page for Blogger 2013

Seo Master present to you:
Create a 404 Page Not Found error page for BloggerFor user-friendly access to a page that does not exist in Blogspot, recently google has supported the navigation error and very helpful. This article will guide you in a different way to create 404 Page Not Found error page. One of Google's new update features to customize 404 error page. 404 (404 error) is a very common error messages, to inform the user when a web address is not found. Failure to find the things you want is an angry, to avoid annoying when readers get a message 404 dry sites often create a custom error page is beautiful or funny.


How do
1. Upgrade to a new type of interface, go to Settings / Search preferences and find a Custom Page Not Found   click Edit. Click to enlarge offline
Create a 404 Page Not Found error page for Blogger

<!-- Start-->     <b:if cond='data:blog.pageType == "error_page"'> <style> #error-not-found {     background: #ff0000;     background: url(http://www.matrixar.com/--Ri7FNhfPuU/T3p0_rWUvLI/AAAAAAAAHzU/v_V5cF2O9YM/s1600/bg_body.gif)no-repeat top center,-moz-radial-gradient(center 40%, circle cover, #ff0000 0%, #880000 100%);     background: url(http://www.matrixar.com/--Ri7FNhfPuU/T3p0_rWUvLI/AAAAAAAAHzU/v_V5cF2O9YM/s1600/bg_body.gif)no-repeat top center,-webkit-gradient(radial, center 40%, 0,  center 40%, 800, from(#ff0000), to(#880000) );             text-align:center;         position:fixed;         top:0px;         right:0px;         bottom:0px;         left:0px;         padding-top:270px;         z-index:999999; } #error-not-found  h1 {         font-size:640px!important;         position:absolute;         font-family:impact,sans serif!important;         top:70px;         left:50%;         letter-spacing: -8px;         margin-left:-502px!important;         width:960px;         z-index:-2;         color:rgba(0,0,0,.09)!important; } #error-not-found  h2 {         font-family:arial black,sans serif!important;         text-transform:uppercase;         font-size:81px;         line-height:66px!important;         letter-spacing: -3px;         color:#fff!important;         margin:0!important;         padding:0!important; } #error-not-found p a, #error-not-found p a:visited, #error-not-found p a:hover{         font-family:arial black,sans serif!important;         text-transform:uppercase;         font-size:56px;         line-height:40px!important;         border:none;         font-weight: bold;         color:rgba(0,0,0,.5)!important;         margin:0!important;         padding:0!important;         text-decoration:none!important; } </style> <div id='error-not-found'>  <h2>404</h2> <br/> <h2>Ups..sorry</h2>  <h2>Page Not Found</h2>  <p> <a href='/' title='Go Home'> Back Home page</a></p>             </div> </b:if>                <!-- end-->

2. Copy the code below into the window that appears and click the Save is complete.
Source: Thanks +Đinh Công Thành

2013, By: Seo Master

seo Create 404 error page motion with CSS3 2013

Seo Master present to you:
Create 404 error page motion with CSS3
One of Google's new update features to customize 404 error page. 404 (404 error) is a very common error messages, to inform the user when a web address is not found. Failure to find the things you want is an angry, to avoid annoying when readers get a message 404 dry sites often create a custom error page is beautiful or funny. This article Hong Hoa Vi will guide create a simple error page with an animation entirely in CSS3.

Be sure to check out the demo before you started to work offline
How do
1. Upgrade to a new type of interface, go to Settings / Search preferences and find a Custom Page Not Found   click Edit. Click to enlarge offline
404error
2. Copy the code below into the window that appears and click the Save is complete

<div class="box"><div class="cover_pan"></div></div>
<style type='text/css'>
.box{background:url(https://lh3.googleusercontent.com/--Spv9VuEKYE/T3WIVthTICI/AAAAAAAAC3E/o1Ng-OEp5SA/s1600/rect2996.png) no-repeat 0 0;height:486px}
.cover_pan{background:#fff url(https://lh4.googleusercontent.com/--KGP4XXtrTM/T3WIWNH6-bI/AAAAAAAAC3I/zaRC49pVYf8/s1600/image2993.png) repeat 1055px bottom;height:486px;margin-left:1px;overflow:hidden;position:relative;width:99.5%;z-index:-1;-moz-animation-name:pan;-moz-animation-duration:40s;-moz-animation-iteration-count:infinite;-moz-animation-timing-function:linear;-webkit-animation-name:pan;-webkit-animation-duration:40s;-webkit-animation-iteration-count:infinite;-webkit-animation-timing-function:linear}
@-moz-keyframes pan{0%{background-position:1338px bottom}
100%{background-position:left bottom}
}
@-webkit-keyframes pan{0%{background-position:1338px bottom}
100%{background-position:left bottom}
}
</style>


Guide customization
If you do not like customization, it is enough but if you are "vóc doctor" and want to edit something, follow the instructions below. The idea here is to create two classes, a class photo on the mask (classbox ) and the background image layer motion (class cover_pan ).
1. Dimensions
You can completely customize the size of the class box and class cover_pan depending on the size of the image and the size of your blog.
2. Photo
In the above code has 2 photos, a class box background image and a background image of classcover_pan . Currently, both of these two images 800px size match the size Blog Design but you can also change the second photo.
For class photo box is required gif or png opacity necessary to mask the cover. Photos classarbitrary cover_pan , you can select any image as long as the size matches.
2. Speed
Here we give the background horizontal run continuously with endless loop. Movement speed is 40s.There are many things you can change, but I raised this discovery for you. Try to learn a little about CSS3 and seek Google directions!
I wish you success 
Source by: Hong Hoa Vi

2013, By: Seo Master
Powered by Blogger.
Design by Dev Nasser