Lista de Blogues... com Blogumus

Depois de escrever um artigo sobre o Blogumus, é altura de voltar à serie de artigos sobre a Lista de Blogues e mostrar como podemos utilizar a nuvem Blogumus em conjunto com o elemento Bloglist ou a Lista de Blogues. 8)

Atenção: antes de tentar modificar o código do blogue, é recomendado que salve sempre o modelo actual!

Neste caso não é preciso muito coisa para implementar uma Lista de Blogues com o efeito da nuvem Blogumus, bastando para isso adicionar o código a seguir onde desejamos que vá aparecer no blogue, como por exemplo na barra lateral (sidebar).

Para colocar esta Lista, primeiro vamos à aba Modelo e depois Editar HTML para abrir o Editor de HTML, onde está toda a codificação presente no blogue e identificar a linha de código referente à barra lateral (Sidebar), que pode parecer algo como:

<b:section class='sidebar' id='sidebar' preferred='yes'>

Ou então se tiverem por habito colocar títulos nos elementos presentes no blogue (Mesmo naqueles elementos onde não desejamos que o titulo esteja visível ;) ), podem clicar em qualquer parte DENTRO do Editor de HTML e utilizar Ctrl+F (No Firefox, pelo menos...) para abrir a caixa de pesquisa onde se digita o titulo do elemento pretendido.

A outra opção é utilizar a opção Avançar para o widget, mas neste caso se o elemento em causa for de HTML/Javascript teremos que ir pelo nome que o Blogger atribui que será HTMLnumero.

Enfim, após localizarem a secção (<b:section) onde querem colocar a Lista de Blogues com o efeito da nuvem Blogumus, o que neste exemplo é a barra lateral (Sidebar), colocamos o código a seguir LOGO abaixo da linha de inicio da secção que deve ser algo similar à apresentada acima:

<b:widget id='BlogList99' locked='false' title='A minha Lista de blogues' type='BlogList'>
<b:includable id='main'>
<b:if cond='data:title'>
<h2><data:title/></h2>
</b:if>
<div class='widget-content'><center>
<script src='URL-SITE-ALOJAMENTO/swfobject.js' type='text/javascript'/>
<div id='flashcontent'>Blogumulus by <a href='http://www.roytanck.com/'>Roy Tanck</a> and <a href='http://www.bloggerbuster.com'>Amanda
Fazani</a> | Distributed by <a href='http://blogger-templates-designs.blogspot.com/'>Blogger Templates Designs</a></div>
<script type='text/javascript'>
var so = new
SWFObject(&quot;URL-SITE-ALOJAMENTO/tagcloud.swf&quot;,
&quot;tagcloud&quot;, 
&quot;295&quot;, <!-- largura="295" -->
&quot;250&quot;, <!-- altura="250" -->
&quot;7&quot;,
&quot;#2e3335&quot;);
// uncomment next line to enable transparency
so.addParam(&quot;wmode&quot;, &quot;transparent&quot;);
so.addVariable(&quot;tcolor&quot;, &quot;0x045FB4&quot;);
so.addVariable("hicolor", "0x79C7E8");
so.addVariable(&quot;mode&quot;, &quot;tags&quot;);
so.addVariable(&quot;distr&quot;, &quot;true&quot;);
so.addVariable(&quot;tspeed&quot;, &quot;100&quot;);
so.addVariable(&quot;tagcloud&quot;,
&quot;<tags><b:loop values='data:items' var='item'><a expr:href='data:item.blogUrl' style='12' target='_blank'><data:item.blogTitle/></a></b:loop></tags>&quot;);
so.addParam(&quot;allowScriptAccess&quot;, &quot;always&quot;);
so.write(&quot;flashcontent&quot;);
</script>
<b:include name='quickedit'/></center>
</div>
</b:includable>
</b:widget>

Linhas sete(7) e 12 em destaque no código acima é onde será necessário colocar os endereços URL para que o efeito Blogumus funcione.

Podem fazer algumas modificações para que a Lista de Blogues se ajuste melhor à aparência do vosso blogue, bastando para isso lerem o artigo anterior onde explico como...

Uma palavra de Aviso sobre a implementação deste tipo de Lista de Blogues: Só irá aparecer o nome de cada blogue na lista, ou seja, nada de titulo do ultimo artigo, nada de imagem ou favicon e essas coisas.

Mas se essa pequena desvantagem não for importante para si, então força! Basta seguir as indicações e instalar a dita cuja no seu blogue. :D

Qualquer duvida, pode deixar nos comentários. ;)

Termino deixando aqui um exemplo do como fica a lista a funcionar:

DEMONSTRAÇÃO

E agora que expliquei sobre o Blogumus, em breve publicarei então um tutorial sobre como colocar uma Lista de Blogues com este efeito.

Até Breve. :-F

Este Artigo foi útil?
Então se quiser, pode pagar-me um café. ;)

Escolhe com Sabedoria:

Deixa o teu comentário no Formulário Incorporado (NOTA: As respostas directas aos comentários só são possíveis utilizando este Formulário.) , ou no Antigo Formulário em uma nova janela, ou então no Formulário em Pop Up .

LER AS REGRAS ANTES DE COMENTAR! MOSTRAR EMOTICONS
Ler Antes de Comentar ◊  As Regras dos Comentários:
  • O comentário precisa ter relação com o assunto!
  • O comentário que deixares é da tua inteira Responsabilidade!
  • Comentários anónimos São permitidos,MAS:

    • Por favor, evita comentar em MAIÚSCULAS .
    • Por favor, não faças Spam.
    • Por favor, não utilizes termos obscenos ou ofensivos.
    • Comentários considerados Spam ou ofensivos serão apagados.
◊  Para deixares a URL do teu blogue, comenta com OpenID, ou com a opção NOME/URL.
◊  Podes usar algumas tags HTML como:
  • @<strong>Nome</strong> para mencionar a quem se responde o comentário.
  • <em>Fulano disse:<i>Texto Citado</i></em> para colocar uma Citação.
  • Para inserir um link ou um vídeo do YouTube, basta só escrever o endereço URL como texto normal.
  • <i>Texto em Itálico</i>
  • <b>Texto em Negrito</b>
    • HTML EXTRA:
    • [im]URL DA IMAGEM[/im] para colocar uma imagem.
    • [ma]Texto rolando[/ma] para colocar texto rolando.
    • [si="2"]Texto com tamanho determinado[/si] Altera o numero para determinar o tamanho da letra.
    • [co="red"]Texto em cor[/co] Altera a cor do texto.
    • [ce]Texto centrado[/ce] centraliza o texto.
    • [ma+]Texto rolando para a direita[/ma+]
    • [box]"encaixotar" o texto[/box]
    • [mark]Texto Marcado[/mark]
    • [card="blue"]Texto com fundo[/card] Altera a cor de fundo do comentário.
    • [im#]URL DA IMAGEM[/im] para colocar uma imagem que ocupe TODA a largura.
    • [hi="yellow"]Texto Destacado[/hi]
  • ATENÇÃO: Comentários com imagens ou vídeos com conteúdo ofensivo ou inadequado serão REMOVIDOS, SEM EXCEPÇÃO!!!
FECHAR
NOTA: os códigos dos emoticons devem ser inseridos separados das restantes palavras ou pontuação. OCULTAR EMOTICONS

0 comentários :

Enviar um comentário