Para verificar que la validación de una plantilla de blog puede utilizar las herramientas del servicio de validación W3C Markup visitando http://validator.w3.org/ allí, nos introduce la url del blog y puede determinar la cantidad de errores de nuestro blog. Antes de realizar la validación, es preferible utilizar otros blogs a juicio, si no eliminar los resultados de widget en el error de percepción o copiar todo el contenido del widget del Bloc de notas.
Cómo hacer un Blog plantilla XHTML Valido / HTML5 válido
1. Ingresar a tu Blogger > Plantillas > Editar HTML > ampliar Widget plantillas comprobar configuración
2. Cambio declaración 'DOCTYPE, encontrar el código de abajo
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns='http://www.w3.org/1999/xhtml' xmlns:b='http://www.google.com/2005/gml/b' xmlns:data='http://www.google.com/2005/gml/data' xmlns:expr='http://www.google.com/2005/gml/expr'>
<head>
Quite todo el código anterior y reemplazarlo por el siguiente código
<!DOCTYPE html>
<HTML>
<head>
<meta charset='utf-8'/>
Después del cambio del código de</html> a</HTML>
3. Elimine el comentario existente en la declaración de CSS, búsque de código guion como (-) y eliminarlos. ejemplo:
/* ----------------------
Name: Leet Blogger Responsive Template
Date : 16 Jan 2014
Url : https://www.facebook.com/sec.researcher
-------------------------*/
Resultados se convierten en
/* Name: Leet Blogger Responsive Template
Date : 16 Jan 2014
Url : https://www.facebook.com/sec.researcher */
4. Retire la etiqueta meta <b:include data='blog' name='all-head-content'/>
5. Quitar la barra por defecto blogger, de exploración <body>código de búsqueda y agregue el código siguiente en primer lugar
<!-- <body><div></div> -->
6. quitar icono QuickEdit imágenes destornillador, mira para el código <b:include name='quickedit'/>
Si usted ha encontrado todo limpio, no olvide si añades más tarde un nuevo widget para quitar el código de nuevo.
7. Eliminación del icono del Post, busque el siguiente código
<span class='post-icons'>
<!-- email post links -->
<b:if cond='data:post.emailPostUrl'>
<span class='item-action'>
<a expr:href='data:post.emailPostUrl' expr:title='data:top.emailPostMsg'>
<img alt='' class='icon-action' height='13' src='http://img1.blogblog.com/img/icon18_email.gif' width='18'/>
</a>
</span>
</b:if>
<!-- quickedit pencil -->
<b:include data='post' name='postQuickEdit'/>
</span> <div class='post-share-buttons'>
<b:include data='post' name='shareButtons'/>
</div> </div>
Eliminar y sustituir por el siguiente código
<span class='post-icons'>
<!-- email post links -->
<b:if cond='data:post.emailPostUrl'>
</b:if>
</span>
</div>
8. Añadir tipos type = "text/javascript" en todo tipo de código JavaScript y tipo de type = "text/css" para todo el css existente, ya sea en las plantillas, Entradas o en un widget. ejemplo:
<script src="https://code.jquery.com/jquery-1.10.2.js"></script>
<script src="http://example.com/style.css"></script>
Cambie a
<script type="text/javascript" src="https://code.jquery.com/jquery-1.10.2.js"></script>
<script type="text/css" src="http://example.com/style.css"></script>
9. Esconder navegación de página en la Página principal, mira el código <b:include name='nextprev'/> reemplazar con el código siguiente
<b:if cond='data:blog.homepageUrl != data:blog.url'>
<!-- navigation -->
<b:include name='nextprev'/>
</b:if>
10. Agregar atributos Alt en todas las imágenes, ejemplos
<img height='75' src='http://2.bp.blogspot.com/-pZbPoP7mzbo/AAAAAAAAAAI/AAAAAAAAEAE/zYIMzugrwL0/s512-c/photo.jpg' width='75'/>
El cambio se convierte como abajo
<img alt='no image' height='75' src='http://2.bp.blogspot.com/-pZbPoP7mzbo/AAAAAAAAAAI/AAAAAAAAEAE/zYIMzugrwL0/s512-c/photo.jpg' width='75'/>
11. Retire todas las etiquetas meta que resulten Error en plantilla de blog. Uso meta etiquetas consiguiendo un HTML 5 válido.
<b:if cond=’data:blog.pageType == "item"’>
<title><data:blog.pageName/> | <data:blog.title/></title>
<b:else/>
<title><data:blog.pageTitle/></title>
</b:if>
<b:if cond=’data:blog.url == data:blog.homepageUrl’>
<meta content='Your Blog Description' name='description'/>
<meta content=’Keywords of your blog’ name=’keywords’/></b:if>
<link href=’http://pcsencilla.blogspot.com/atom.xml’ rel=’alternate’ title=’Atom’ type=’application/atom+xml’/>
<link href=’http://pcsencilla.blogspot.com/feeds/posts/default’ rel=’alternate’ title=’RSS Feeds’ type=’application/atom+xml’/>
<link href=’http://pcsencilla.blogspot.com/openid-server.g’ rel=’openid.server’/>
<link href=’http://pcsencilla.blogspot.com/favicon.ico’ rel=’icon’ type=’image/x-icon’/>
<meta content=’verification code from google webmaster’ name=’google-site-verification’/>
<meta content=’alexa verification code’ name=’alexaVerifyID’/>
<meta content=’verification code from bing’ name=’msvalidate.01′/>
<meta content=’your Name’ name=’Author’/>
12. Resolver error css plantillas bundle, eliminar código <b:skin><![CDATA[
vuelva a colocar el siguiente código
<link type='text/css' rel='stylesheet' href='//www.blogger.com/static/v1/widgets/3950009988-widget_css_bundle.css' /> <style type="text/css"> <!-- /*<b:skin><![CDATA[*/]] <style>
13. Ocultar widgets en la Página principal.
<b:if cond='data:blog.homepageUrl != data:blog.url'>
El widget oculto que quieras
</b:if>
14. Poner bajo el siguiente script justo debajo de <head>
<!--[if IE]><script type='text/javascript' src='http://html5shiv.googlecode.com/svn/trunk/html5.js'></script><![endif]-->
15. En el momento de publicar fotos quitar atributos Anchor='1' y border='0' y agregar el atributo title y alt. El siguiente ejemplo es un blogspot de formato de imagen estándar.
<div class="separator" style="clear: both; text-align: center;">
<a href="http://2.bp.blogspot.com/-pZbPoP7mzbo/AAAAAAAAAAI/AAAAAAAAEAE/zYIMzugrwL0/s512-c/photo.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="http://2.bp.blogspot.com/-pZbPoP7mzbo/AAAAAAAAAAI/AAAAAAAAEAE/zYIMzugrwL0/s512-c/photo.jpg" /></a></div>
Cambiarlo a
<div class="separator" style="clear: both; text-align: center;">
<a href="http://2.bp.blogspot.com/-pZbPoP7mzbo/AAAAAAAAAAI/AAAAAAAAEAE/zYIMzugrwL0/s512-c/photo.jpg" style="margin-left: 1em; margin-right: 1em;"><img alt="Blogger" title="Blogger" src="http://2.bp.blogspot.com/-pZbPoP7mzbo/AAAAAAAAAAI/AAAAAAAAEAE/zYIMzugrwL0/s512-c/photo.jpg" /></a></div>
16. Nunca use etiqueta <center> para hacer un uso centrado, escribir o dibujar el siguiente código si no quieres ocasionar tampoco un error html en la entrada o en el widget html.
<div style="text-align: center;">Fill Widget</div>
![Adele - 19 (2008) [24 bit FLAC] vinyl](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiJLMDyvJ6gwfCMmPJsLsoyyW6eri44sj9TZ7npfJZ6Jh1zGcgbo258zsHt6Ih53N1lmgL0LJOeqfAWTlxKhOT5x45hciRDd7LgSu_HQa-XyEYewtLHBaC-UF5KZd9tk5pvMXBsEEXxXtc/s72-c/adele8.jpg "Adele - 19 (2008) [24 bit FLAC] vinyl")
![The Black Eyed Peas - Greatest Hits 2CD (2009) [FLAC]](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgOUkrYoF6PaClSuvXN7saQbw1AsZ0cWC6ROL_M28O7pdqbNbiY_7EECuBbeSyV6zVKoodtczzfK-gWcrI70Bq5tzUUhgEQ3ybtGLDPvXwe2yYXFRzXmS3OCvHZISh3LwJrgfmiG5J-zF8N/s72-c/black_ayes_peas_a.jpg "The Black Eyed Peas - Greatest Hits 2CD (2009) [FLAC]")
0 Comments