Páginas

30 enero 2010

Gadgets visibles o no. solo en páginas individuales

Paginas estaticas

Aunque las páginas individuales o estáticas de Blogger, que acaban de aparecer, aún están en borrador o fase de prueba. podemos jugar un poco con estas para que luzcan un poco diferentes a las páginas de las entradas. Algo que cambiaría la apariencia de las páginas estáticas seria mostrar u ocultar gadgets.

Es decir, que el gadget será exclusivo para las páginas estáticas y por lo tanto no aparezca en todas las páginas de nuestro blog. O si lo prefieres que sea de forma inversa, que el gadget aparezca en todas las páginas de nuestro blog excepto en las páginas estáticas.

Para explicar esto, voy a suponer que quiero ocultar un gadget solo en las páginas estáticas. Puedes hacerlo con el o los gadgets que quieras.

[1] Para localizar el gadget que ocultaré, cuyo nombre es "Archivo del Blog":
Primero que nada debo entrar en Diseño>Edicion HTML>Expandir plantillas de artilugios

[2] Después con 'Ctrl + F' buscaré "Archivo del Blog", sin las comillas. Hasta encontrar algo así:

<b:widget id='BlogArchive1' locked='false' title='Archivo del Blog' type='BlogArchive'>
<b:includable id='toggle' var='interval'>
<b:if cond='data:interval.toggleId'>
<b:if cond='data:interval.expclass == "expanded"'>
<a class='toggle' expr:href='data:widget.actionUrl + "&action=toggle" + "&dir=close&toggle=" + data:interval.toggleId + "&toggleopen=" + data:toggleopen'>
<span class='zippy toggle-open'>▼ </span>
</a>
<b:else/>
<a class='toggle' expr:href='data:widget.actionUrl + "&action=toggle" + "&dir=open&toggle=" + data:interval.toggleId + "&toggleopen=" + data:toggleopen'>
<span class='zippy'>► </span>
</a>
</b:if>
</b:if>
</b:includable>
<b:includable id='interval' var='intervalData'>
<b:loop values='data:intervalData' var='i'>
<ul>
<li expr:class='"archivedate " + data:i.expclass'>
<b:include data='i' name='toggle'/>
<a class='post-count-link' expr:href='data:i.url'><data:i.name/></a>
(<span class='post-count'><data:i.post-count/></span>)
<b:if cond='data:i.data'>
<b:include data='i.data' name='interval'/>
</b:if>
<b:if cond='data:i.posts'>
<b:include data='i.posts' name='posts'/>
</b:if>
</li>
</ul>
</b:loop>
</b:includable>
<b:includable id='menu' var='data'>
<select expr:id='data:widget.instanceId + "_ArchiveMenu"'>
<option value=''><data:title/></option>
<b:loop values='data:data' var='i'>
<option expr:value='data:i.url'><data:i.name/> (<data:i.post-count/>)</option>
</b:loop>
</select>
</b:includable>
<b:includable id='flat' var='data'>
<ul>
<b:loop values='data:data' var='i'>
<li class='archivedate'>
<a expr:href='data:i.url'><data:i.name/></a> (<data:i.post-count/>)
</li>
</b:loop>
</ul>
</b:includable>
<b:includable id='posts' var='posts'>
<ul class='posts'>
<b:loop values='data:posts' var='i'>
<li><a expr:href='data:i.url'><data:i.title/></a></li>
</b:loop>
</ul>
</b:includable>
<b:includable id='main'>
<b:if cond='data:title'>
<h2><data:title/></h2>
</b:if>
<div class='widget-content'>
<div id='ArchiveList'>
<div expr:id='data:widget.instanceId + "_ArchiveList"'>
<b:if cond='data:style == "HIERARCHY"'>
<b:include data='data' name='interval'/>
</b:if>
<b:if cond='data:style == "FLAT"'>
<b:include data='data' name='flat'/>
</b:if>
<b:if cond='data:style == "MENU"'>
<b:include data='data' name='menu'/>
</b:if>
</div>
</div>
<!-- b:include name='quickedit'/ -->
</div>
</b:includable>
</b:widget>

[3] Puedes ver que el gadget comienza con un <b:widget ......> y tiene muchisimos elementos, pero solo me interesa la etiqueta:
<b:includable id='main'>
[...........]
</b:includable>
No importa que este antes, despues o dentro de ella, pero que sea esa etiqueta exacta.

[4] Dentro de esa etiqueta colocaremos otra etiqueta, que será la que muestre u coulte el gadget solo en algunas páginas del Blog. La colocaremos de la siguiente manera para:

Mostrar el gadget solo en páginas estáticas y ocultarlo en las demás:
<b:includable id='main'>
<b:if cond='data:blog.pageType == "static_page"'>
[...........]
</b:if>
</b:includable>

Ocultar el gadget solo en páginas estaticas y mostrarlo en las demás:
<b:includable id='main'>
<b:if cond='data:blog.pageType == "item"'>
[...........]
</b:if>
</b:includable>

5 comentarios:

  1. Hola Santy, comenté por vez primera en tu blog el otro día.

    Excelente ayuda la que provees hoy. Opino que una página estática, ayuda a ofrecer una mejor imagen a un blog, y lo acerca más y más a ser un verdadero website personal. Me parece que esa es la tendencia.

    Y con tu consejo de hoy, colaboras con la personalización de tales páginas estáticas, lo cual podría estar todavía lejano en el futuro de blogger.

    Hasta pronto y un abrazo!

    ResponderBorrar
  2. Muy buenas Santy!

    Es la primera vez que entro en tu blog, y he entrado porque estaba buscando justo esto, el problema es que soy un paquete y no tengo ni idea de blogs... Todo esto de paginas estáticas me suena a chino!

    Yo te cuento lo que quiero hacer, a ver si es esto que explicas (que creo que si...).

    Yo tengo este blog: http://www.paraquetitotengaunavidaplena.es

    Como ves, tengo una imagen de cabecera (la que pone POR UNA VIDA PLENA, y otra debajo, que es la de los blocs de notas con el boli.

    Lo que quiero hacer es que salgan los dos si entras en www.paraquetitotengaunavidaplena.es, pero que la de los blocs no salga si entras por ejemplo en:

    http://www.paraquetitotengaunavidaplena.es/2010/01/aprender-hacer-jabon-hecho.html


    Hablamos del mismo tema??

    Gracias por tu ayuda!Me pongo tu blog en favoritos, que me vendrá bien!

    ResponderBorrar
  3. Arny Joaquín, saludos de nuevo xD!! Así es parece que Blogger se esmera en hacer primero lo mas difícil y después lo mas sencillo.

    Imaginemos que hará en un par de meses o años. :-I Por mientras nosotros los Bloggers tenemos que hacer lo que este a nuestro alcance para ver un bosquejo de lo que queremos. Igual prefiero a Blogger.com que a Wordpress.

    Saludos xD!!


    Tito Belascoain, que tal!!

    Hablamos de algo sumamente parecido, pero te recomiendo que leas todo el post de arriba y después sigas aquí.

    En el paso numero 2 debes buscar "Image1" sin comillas con la combinación de teclas "Ctrl + F", hasta encontrar algo así:

    <b:widget id='Image1' locked='false' title='' type='Image'>
    <b:includable id='main'>
    [............]
    </b:includable>
    </b:widget>

    En tu caso no hagas el paso cuatro de las instrucciones de arriba utiliza el paso 4 de aquí abajo.

    [4] Dentro de esa etiqueta colocaremos otra etiqueta, que será la que muestre u coulte el gadget solo en algunas páginas del Blog. La colocaremos de la siguiente manera para:

    Mostrar el gadget, en tu caso la imagen, solo en la página inicial del blog:

    <b:widget id='Image1' locked='false' title='' type='Image'>
    <b:includable id='main'>
    <b:if cond='data:blog.url == data:blog.homePage'>
    [............]
    </b:if>
    </b:includable>
    </b:widget>

    Ten un poco de paciencia y suerte con ello ;)!!

    ResponderBorrar
  4. Tengo una consulta, weno cree un blog como trabajo pa un profesor de un instituto pero como ya tenia algo de experiencia fué fácil.

    Pero lo k nunca pude hacer fue k los gadgets y otros elementos se vean SOLO en la pagina principal donde se ven todas las entradas (Un rectangulo con resumen y su leer mas para cada entrada) y NO en las entradas (Es decir luego de hacer Click en Leer mas)...

    Y si pudieras explicarme un pokito mas acerca de las "Paginas estaticas" ;)

    ResponderBorrar
  5. Hola Santi muy interesante tu articulo estuve incursionando con los códigos que dejaste para tratar de ocultar un Gadget HTML/Javascript donde agrego una cabecera adicional a mi blog pero no he podido ocultar el Gadget.. te dejo mi blog para que me heches una manita... Gracias de ante mano... ENLACE

    ResponderBorrar

Si necesitas ayuda mas personalizada deja un <a href='URL'>ENLACE</a> hacia tu blog.