Saiba Como:..."Personalizar rótulos de rodapé pós-"..."etiquetas de post-footer"
Autor: Edilene brandao da silva | Publicado: 2010-11-06T10:02:00-07:00

 Personalizar rótulos de rodapé pós- Um tempo atrás vi como adicionar ícones para as guias do post-footer, agora vamos adicionar alguns estilos simples, que irá destacar formulário.

Na marca de edição de HTML para expandir o modelo e olhar a parte relativa às etiquetas.  
Destacadas em negrito é o rótulo &lt;data:label.name/&gt; que é responsável por gerar as etiquetas, em seguida, adicione a marcação de cor vermelho.
class='post-labels'&gt; &lt;span
&lt;b:if cond='data:post.labels'&gt;
&lt;data:postLabelsLabel/&gt;
valores = 'data: post.labels' var='label'&gt; &lt;b:loop
&lt;a expr:href='data:label.url' rel='tag'&gt;class='etiquetas'&gt; &lt;span&lt;data:label.name/&gt;&lt;/ Span&gt;&lt;/ A&gt;
dados cond = ': &lt;b:if label.isLast != "true"'&gt;&nbsp; ,&nbsp;&lt;/ B: if&gt;
== Cond = 'data: &lt;b:if blog.pageType "item"'&gt;
&lt;Expr Script: src = "/ feeds/posts/default/- /" + data: label.name +  "alt = json-in-script &amp; callback = related_results_labels &amp;  max-results = 20?" 'Tipo = "text / javascript '/&gt;
&lt;/ B: if&gt;
&lt;/ B: loop&gt;
&lt;/ B: if&gt;
&lt;-! QuickEdit lápis -&gt;
name='postQuickEdit'/&gt; &lt;b:includable 'post' data =
&lt;/ Span&gt;

Bem ali, você pode excluir a vírgula separando as abas, é marcada com um fundo preto.
Se nós somos o lugar da vírgula pode acrescentar algo imagem decorativa ou de caráter unicode.

style = "vertical-align: middle; &lt;span color:#000; 1px 1px 1px font-size:24px;text-shadow: #505050"&gt; &amp;#10087;&lt;/ Span&gt;


 Salve as alterações e adicionar os estilos para os separadores, pouco antes ]]&gt;&lt;/ B: skin&gt;

. Cloud {padding: 4px;color: # ffffff;opacidade: 0,6;text-shadow: 0 3px 2px # 000000;background: none repeat scroll 0 0 # 990000;}
 . Tags: hover {opacidade: 0,9;}
Ao fundo, mudar a cor de fundo, a  cor da fonte na sombra de texto "&nbsp;&nbsp; de cor", que usamos para pintar o  texto e opacidade para o efeito hover.Qualquer estilo que podemos adicionar e visualizar os resultados ou continuar mudando.
. Cloud {padding: 4px;color: # ffffff;-Moz-border-radius: 5px 5px 5px 5px;background: none repeat scroll 0 0 # 990000;text-shadow:-1px 1px 1px-# 555;-Moz-box-shadow: 3px 3px 3px # 000000;}. Tags: hover {opacidade: 0,9;}&nbsp;original post:\/fonte e créditos: http://gemablog-.blogspot.com/
Personalizar las etiquetas de post-footer Hace un tiempo vimos la  forma de añadir iconos a las etiquetas del post-footer, hoy vamos a  añadirle unos sencillos estilos de forma que las resaltaremos.

En edición de html marcamos para expandir la plantilla y buscamos la parte que afecta a las etiquetas.  
Resaltado en negrita está la etiqueta &lt;data:label.name/&gt; que es la encargada de generar las etiquetas, a continuación añadiremos lo marcado en color rojo.
&lt;span class='post-labels'&gt;
&lt;b:if cond='data:post.labels'&gt;
&lt;data:postLabelsLabel/&gt;
&lt;b:loop values='data:post.labels' var='label'&gt;
&lt;a expr:href='data:label.url' rel='tag'&gt;&lt;span class='etiquetas'&gt;&lt;data:label.name/&gt;&lt;/span&gt;&lt;/a&gt;
&lt;b:if cond='data:label.isLast != &amp;quot;true&amp;quot;'&gt;&nbsp; ,&nbsp;&lt;/b:if&gt;
&lt;b:if cond='data:blog.pageType == &amp;quot;item&amp;quot;'&gt;
&lt;script expr:src='&amp;quot;/feeds/posts/default/-/&amp;quot; +  data:label.name +  &amp;quot;?alt=json-in-script&amp;amp;callback=related_results_labels&amp;amp;max-results=20&amp;quot;'  type='text/javascript'/&gt;
&lt;/b:if&gt;
&lt;/b:loop&gt;
&lt;/b:if&gt;
&lt;!-- quickedit pencil --&gt;
&lt;b:include data='post' name='postQuickEdit'/&gt;
&lt;/span&gt;

Ahí mismo podemos eliminar la coma que separa las etiquetas, está marcado con fondo negro.
Si queremos en el lugar de la coma podemos añadir algo decorativo una imagen o carácter unicode.

&lt;span style="vertical-align: middle; color:#000; font-size:24px;text-shadow: 1px 1px 1px #505050"&gt;&amp;#10087;&lt;/span&gt;


Guardamos los cambios y añadimos los estilos para las etiquetas justo antes de ]]&gt;&lt;/b:skin&gt;

.etiquetas {padding:4px;color:#ffffff;opacity:0.6;text-shadow:0 3px 2px #000000;background:none repeat scroll 0 0 #990000;}
 .etiquetas: hover {opacity:0.9;}
En background cambiamos el color  de fondo, el color de fuente en "color" text-shadow lo utilizamos para  dar sombra el al texto y opacity para el efecto hover.Cualquier estilo podemos añadirlo y ver el resultado o seguir cambiando.
.etiquetas {padding:4px;color:#ffffff;-moz-border-radius: 5px 5px 5px 5px;background:none repeat scroll 0 0 #990000;text-shadow: -1px -1px 1px #555;-moz-box-shadow: 3px 3px 3px #000000;}.etiquetas:hover {opacity:0.9;}  11/06/2010  1 opiniones                   ♡ Etiquetas: Blogger  &nbsp; CSS   &nbsp;      Si te ha gustado ¡ Compártelo !