Como bloquear o mouse em seu blog

Aqui veremos um dos muitos truques para proteger seu blog de cópia. No entanto, sempre haverão outros métodos para gravar o texto ou imagem bloqueados, esteja certo. O script que veremos aqui impede a utilização do botão direito do mouse, desabilitando assim a forma mais usada de gravação e cópia. O script é muito fácil de instalar, e funciona nos navegadores Internet Explorer, Firefox e Opera com sucesso. Quanto a outros, não sei. Para proteger seu blog deste modo, proceda assim:

1. Entre em Layout -- Editar HTML.

2. Clique em Adicionar um Gadget.

3. Na janela pop-up que abrirá então, escolha a opção HTML/Javascript.

4. E, finalmente, cole o código abaixo neste gadget e salve. Depois disso é só verificar seu blog para comprovar o funcionamento do script.

Código necessário:

<script> function click() { if (event.button==2||event.button==3) { oncontextmenu='return false'; } } document.onmousedown=click document.oncontextmenu = new Function("return false;") </script>

Imagem na barra lateral

Aqui uma dica para os que ainda estão começando a blogar, e ainda não conhecem as principais funcionalidades e gadgets do Blogger. Quando eu ainda estava aprendendo a blogar, queria a qualquer custo colocar uma imagem na barra lateral, e como não entendia HTML só consegui fazer isto quando descobri este gadget. Então aqui está a dica para os que não conhecem.

Para adicionar uma imagem na barra lateral de seu blog, há dois modos. Um é usando HTML básico, a outra é a que mostraremos aqui. Então, faça o seguinte.

1. Vamos para a página Layout, à partir de seu painel no Blogger.
2. Clique em Adicionar um Gadget.
3. Escolha a opção Imagem, que é como a figura acima mostra.
4. Aí, carregue a imagem que quiser, ponha um link para a imagem no campo Link; ponha uma legenda, se quiser, e um título para o gadget. Clique em Salvar.

Pare para um descanso...

5. Ainda na página Layout, vamos para Editar HTML.
6. Clique em Expandir modelos de widgets.
7. Aí, busque o título do gadget da imagem. Digamos que eu criei um gadget onde carreguei a imagem, coloquei um link na imagem e salvei. O título deste gadget pode ser Imagem. Após achar o nome, veja o código, que será como o abaixo:

<b:widget id='Image1' locked='false' title='Imagem' type='Image'>

<b:includable id='main'>
<b:if cond='data:title != ""'>
<h2><data:title/></h2>
</b:if>
<div class='widget-content'>
<b:if cond='data:link != ""'>
<a expr:href='data:link'>
<img expr:alt='data:title' expr:height='data:height' expr:id='data:widget.instanceId + "_img"' expr:src='data:sourceUrl' expr:width='data:width'/>
</a>
<b:else/>
<img expr:alt='data:title' expr:height='data:height' expr:id='data:widget.instanceId + "_img"' expr:src='data:sourceUrl' expr:width='data:width'/>
</b:if>
<br/>
<b:if cond='data:caption != ""'>
<span class='caption'><data:caption/></span>
</b:if>
</div>
<b:include name='quickedit'/>
</b:includable>
</b:widget>

O trecho do código acima, logo no começo, que marquei com vermelho, é o título do gadget, que você terá achado na tag.
8. Logo abaixo do título, ache o trecho <a expr:href='data:link'> que acima eu marquei em verde, e substitua-o por <a expr:href='data:link' target='_blank'>. A seguir salve as alterações no template, e confira se está funcionando.

Gadget Postagens Recentes

Eu achava que esta ferramenta do Blogger era muito conhecida de todos. No entanto, como recentemente vi que há muitos que não a utilizam simplesmente porque não a conhecem ou não sabem como montar, estou deixando a dica aqui. Não há nada mais fácil do que adicionar este gadget que mostra as últimas postagens publicadas em seu blog. Então, para os que não sabem como fazer, vamos lá.

1. Vamos na página Layout -- Elementos de página de seu blog, à partir do painel do Blogger.
2. Clique em Adicionar um gadget.
3. Na janela pop-up que aparecerá, selecione a opção Feed, que aparece como na imagem abaixo.

4. Após ter clicado em Feed, uma janela como a mostrada na figura abaixo aparecerá. No campo em branco URL do Feed, cole o seguinte endereço: http://mestreblogger.blogspot.com/feeds/posts/default . Substitua o mestreblogger.blogspot.com pelo endereço de seu blog. Por exemplo: meublog.blogspot.com . Então, clique em Continuar.

5. Você será redirecionado para uma janela como a da figura abaixo. Escolha o nome do gadget, quantas postagens deverão aparecer na lista, e clique em Salvar.

Agora está pronto! Você já terá o gadget instalado e funcionando corretamente.

Contador de visitas Feed Jit

Segundo o informador de visitantes e visitas, o Google Analytics, uma boa parte dos visitantes que encontram o Mestre Blogger à partir da busca do Google estavam procurando por "Contador de visitas". Como até agora só fizemos uma postagem à respeito, e nada que mereça tanta atenção, estamos dando aqui as instruções para como instalar o Feed Jit, um contador bem útil e fácil de adicionar em seu blog, além de ser totalmente confiável. Ele contém as seguintes opções:

• Mapa que mostra de onde estão visitando o seu blog. O mapa funciona com o Maps Google.
• Mostra quais as páginas mais populares no blog, e quantas visitas recebem.
• Mostra quais os links mais clicados em seu blog.

Há quatro versões que podem ser instaladas.

1. Live Traffic Feed - Mostra em quais páginas e de onde estão chegando.
2. Live Traffic Map - Mostra de onde estão visitando o blog.
3. Recommend Reading - Recomenda outras páginas dizendo "Visitantes que viram esta página também gostaram de..."
4. Page Popularity - Popularidade da página.

Aqui vamos mostrar como instalar o Mapa, que é o principal modelo.

1. Primeiro, entre em www.feedjit.com/joinjs/ 
2. Agora vamos para a segunda opção (da esquerda para a direita).
3. Se quiser modificar a aparência do mapa, clique em First Customize it! como está mostrado na imagem no fim desta postagem. Então você pode escolher uma das opções que eles dão ou fazer como você mesmo quiser.
4. Após ter decidido como ficará o seu modelo de Feed Jit, copie o código dado na área de texto logo acima da demonstração de como ficará o seu modelo.
5. Vá para o seu painel do Blogger. Entre em Layout -- Elementos de página.
6. Clique em Adicionar um Gadget .
7. Selecione a opção de gadgets HTML/Javascritpt, na janela que abrirá.
8. Cole neste gadget o código obtido lá no Feed Jit e salve.
9. Visualize o blog e veja lá o seu modelo. Logo você verá os visitantes, assinalados por pontinhos vermelhos no mapa...

Imagem: modificando as opções do mapa Feed Jit.

Modificando o link enviar postagem

Hoje você verá como modificar o ícone do rodapé das postagens chamado Enviar postagem que serve para enviar a postagem à alguém, por e-mail. O ícone fornecido pelo Blogger não atrai atenção, e para blogueiros iniciantes não significa nada e por isso mesmo muitas vezes deixam de usá-lo. Por isso, vejamos como modificá-lo para outra imagem, ou para uma frase qualquer.

1. Primeiro, caso você ainda não tenha a opção de mostrar o ícone ativada, vamos para Layout -- Elementos de página .

2. Na seção Postagens no blog clique em Editar.

 

3. Na janela que aparecerá marque a opção Mostrar links Enviar esta Postagem e salve as alterações.

4. Agora, vamos na para Layout -- Editar HTML. Marque a caixa Expandir modelos de widgets.

5. Busque o seguinte 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://www.blogger.com/img/icon18_email.gif' width='18'/>
</a>
</span>


6. Modifique o trecho
<img alt='' class='icon-action' height='13' src='http://www.blogger.com/img/icon18_email.gif' width='18'/>

por

<img alt='Enviar postagem' class='icon-action' src='http://url_de_sua_imagem'/> .

Substitua http://url_de_sua_imagem pelo endereço da imagem que substituirá a antiga. (Para achar ícones grátis sugiro o site http://www.iconfinder.net/ ).

7. Se você preferir substituir o ícone por uma frase como "Envie esta postagem à um amigo" ou "Recomende", substitua o trecho

<img alt='' class='icon-action' height='13' src='http://www.blogger.com/img/icon18_email.gif' width='18'/>

por

<p style='font-size:100%'>Envie esta postagem à um amigo</p>.

e modifique o texto mostrado em verde pela frase convidando à enviar a postagem.

8. Finalmente, se você quiser mostrar uma imagem juntamente com a frase, cole primeiro o código da imagem e depois o texto como mostrados nos passos 6 e 7.

Salve as alterações e visualize o seu blog. Está pronto!

Como montar uma janela pop-up

Bem, anteriormente já havíamos postado algumas dicas sobre as janelas pop-ups em blogs, mas agora tudo vai junto com algumas dicas novas e está mais fácil de acompanhar.

Os pop-ups são estas janelinhas que aparecem automaticamente quando você entra em algum site (se você estiver com o bloqueador de pop-ups desativado) e também ao ser clicados alguns tipos de link. Aqui vamos mostrar os três tipos de pop-up principais.

---

n° 1 - Modo automático simples

Descrição: Este é o modo simples de pop-up que aparece tão logo carrega o blog em que ele está instalado (automaticamente). Se você tiver o bloqueador de pop-ups ativado eles não funcionarão em seu computador.

Código:

<script language="javascript">window.open('http://url_da_página_pop-up','Info','width=200,height=250,scrollbars=no,resizable=no,status=no,left=100,top=47');
</script>

Modificações no código:

Todos os trechos mostrados em verde no código podem ser modificados de acordo com a sua vontade. Modifique http://url_da_página_pop-up pelo endereço completo da página que deverá abrir como pop-up. Modifique 200 de width=200 pelo tamanho da largura da página e 250 de height=250 pela altura. resizable=no define se a janela será redimensionável. Caso deseje permitir isto, modifique no por yes. Modifique o no de scrollbars=no para yes caso você queira que a janela tenha barras de navegação.


Como adicionar:

Após acessar o painel de sua conta no blogger, vá para a página Layout -- Elementos de página. Selecione Adicionar um gadget e na janela com as opções de gadgets que aparecerá escolha HTML/Javascript. A seguir, cole o código do pop-up no gadget e, após modificar os campos desejados, salve o gadget e visualize o blog. Este código também pode ser adicionado em uma postagem qualquer.


n° 2 - Modo automático avançado

Descrição: Praticamente o mesmo pop-up anterior, porém desta vez o código contém um sistema de cookies que impede que o pop-up abra mais de uma vez na mesma janela. Após ter aparecido uma vez você poderá atualizar a página quantas vezes quiser que o pop-up não será ativado novamente.

Código:

<script>

function openpopup(){
var popurl="http://url_da_página_pop-up"
winpops=window.open(popurl,"","width=200,height=250,")
}
function get_cookie(Name) {
var search = Name + "="
var returnvalue = "";
if (document.cookie.length > 0) {
onset = document.cookie.indexOf(search)
if (onset != -1) {
onset += search.length
end = document.cookie.indexOn(";", onset);
if (end == -1)
end = document.cookie.length;
returnvalue=unescape(document.cookie.substring(onset, end))
}
}
return returnvalue;
}
function loadornot(){
if (get_cookie('poppedup')==''){
openpopup()
document.cookie="poppedup=yes"
}
}
loadornot()
</script>

Modificações no código:

Modifique http://url_da_página_pop-up pelo endereço da página que abrirá em pop-up. Modifique o 200 de width=200 para o tamanho da largura da janela e 250 de height=250 para a altura.

Como adicionar: Siga os mesmos passos do modo anterior.



n° 3 - Modo OnClick
Descrição: A janela a ser aberta é exatamente como a do n° 1, porém ativa-se ao ser clicado um link. Alguns bloqueadores de pop-ups não funcionam com janelas clicadas.

Código:

<a onclick="window.open('http://url_da_página_pop-up','Info','status=yes,scrollbars=yes,resizable=yes,width=200,height=250,left=100,top=47');" href="javascript:void(0)">Texto do link</a>


Modificações no código: As modificações no código também são como as do exemplo n° 1, exceto pelo trecho Texto do link, que você modificará para o texto do link que abrirá a janela. javascript:void(0) é o que aparecerá na barra de status. Não haverá diferença prática modificando-se este último trecho.
Como adicionar: Esta forma de pop-up pode ser adicionada na barra lateral (seguindo-se os passos do exemplo n° 1) ou numa postagem qualquer.



n° 4 Modo OnMouseOver

Descrição: Este modo é quase exatamente igual ao n° 3, sendo que a única diferença é que ele é ativado ao passar-se o mouse sobre o link (onMouseOver), e não ao ser clicado, como no exemplo anterior.

Código:


<a onmouseover="window.open('http://url_da_página_pop-up','Info','status=yes,scrollbars=yes,resizable=yes,width=200,height=250,left=100,top=47');" href="javascript:void(0)">Texto do link</a>


Modificações no código: Modifique tudo como no exemplo n° 3.

Como adicionar: Também este código pode ser adicionado como no n° 3

---

E aí você tem os principais modos de pop-up. No entanto, quanto ao pop-up automático, lembre-se de não exagerar com isso porque se usado demasiadamente pode incomodar seus visitantes e fazê-los fechar o blog o quanto antes. Também o modo onMouseOver pode ser muito irritante, por isso tome cuidado na sua utilização.

Como centralizar o cabeçalho

A postagem de hoje será bem curtinha. Vou mostrar como centralizar o texto do cabeçalho de acordo com o pedido de um leitor. Para fazer isto há um jeito muito simples que se consegue editando o HMTL do template. Então, faça o seguinte:

1. Após entrar em sua conta no Blogger entre na página Layout -- Editar HTML.
2. Busque este trecho de código: #header h1 { . (Use a busca de página com as teclas CTRL + F)
3. Logo abaixo deste código cole isto: text-align: center; .
4. O resultado ficará assim:
#header h1 {
text-align: center;
5. Salve as alterações e visualize o blog a seguir. Você verá o título de seu blog centralizado no cabeçalho, direitinho.

Abraços e bom final de semana! ;)

Como ocultar um elemento de página

Do mesmo modo que muitas vezes queremos ocultar a navbar do blogger (ver aqui), as vezes seria conveniente que pudessemos ocultar um simples elemento de página (ou gadget), que não mais queremos, mas que pode vir a ser útil depois. Para isso existe um meio muito fácil utilizando-se de códigos CSS. Vejamos como fazer isso em três passos simples.

Digamos que você quer ocultar o gadget de seu Perfil do blogger, na barra lateral. Proceda assim:

1. Vá para a página LAYOUT -- EDITAR HTML. Agora, procure pelo nome do gadget que você quer ocultar (no caso, o seu Perfil). Por exemplo, "Quem sou eu". Para procurar utilize as teclas CTRL+F e digite o nome, como mostrado na figura abaixo.
   
2. Você encontrará o título nesta linha: <b:widget id='Profile1' locked='false' title='Quem sou eu' type='Profile'/>. Então, copie o id do perfil; neste caso, como você vê, o id é Profile1.
3. Agora busque a tag ]]></b:skin> e cole imediatamente antes dela o código #Profile1 { display:none; }. O resultado ficará algo assim:
   
   Naturalmente, se o gadget a ser oculto for outro você deverá modificar o nome Profile1 para o ID do gadget que você deseja ocultar. Então, salve as alterações e confira o seu blog.

Para remover a barra de navegação do blogger (blogger navbar)

Opções para a barra de navegação - falta o botão EXCLUIR. Àqueles que não sabem, a Blogger Navbar, ou barra de navegação do Blogger, é aquela barrinha que aparece sobre o cabeçalho dos blogs (veja a figura abaixo), com um campo para pesquisa do blog, um link para o blogger e algumas outras opções.

A principal utilidade desta barra para os visitantes é que fornece o campo para pesquisa no blog; ora, o campo de pesquisa pode ser facilmente adaptado à barra lateral de seu blog e após isso a barra não tem grande utilidade. Na página ELEMENTOS DE PÁGINA da opção LAYOUT da edição de seu blog (ver imagens abaixo) você pode modificar o visual da barra escolhendo entre quatro opções; no entanto, não lhe é dado remover a barra, como nos outros elementos de página. O único modo de remover a barra é, portanto, pela edição de HTML. Para fazer isto, que é bem simples, vá para o painel de sua conta no blogger, entre na página LAYOUT de seu blog, acesse a sub-página EDITAR HMTL e busque a tag ]]></b:skin>⁽¹⁾ . Logo antes desta tag cole o seguinte código: #navbar { display:none; }. Procendendo-se corretamente o resultado será esse:

---

Imagens:

Barra de navegação na página ELEMENTOS DE PÁGINA.

Como achar uma tag na edição de HTML.

Deixando o Link dos Comentários Mais Atrativo

Nesta postagem explicarei como modificar o link dos comentários abaixo das postagens. Muitos visitantes que não conhecem direito os blogs do google não entendem o que significa a mensagem abaixo de cada postagem "0 comentários", e apenas por isso não deixam o seu comentário. Para modificar o escrito no link, eis o que se deve fazer:

1. Acesse www.blogger.com-->faça login-->vá para a página LAYOUT-->vá para a sub-página EDITAR HTML.

2. Antes de começar a editar o HTML, tome uma precaução: baixe o modelo completo. Caso algo errado aconteça no modelo de seu blog tudo que você tem a fazer para recuperá-lo é baixar o modelo gravado (veja imagem abaixo).

3. Clique em REVERTER MODELOS DE WIDGET PARA O PADRÃO no fundo da janela (veja imagem abaixo).

4. Uma mensagem como a da figura abaixo aparecerá. Selecione OK.

5. Agora volte para o alto da janela. Acima da área onde ficam os códigos, você verá a opção EXPANDIR MODELOS DE WIDGETS. Selecione esta opção e aguarde alguns segundos (ver figura abaixo).

6. Busque o seguinte código no HTML de seu blog (para buscar o código, pressione as teclas Ctrl + F e digite na janela que aparecerá alguns caracteres do código):

<span class='post-comment-link'><b:if cond='data:blog.pageType != "item"'> <b:if cond='data:post.allowComments'> <a class='comment-link' expr:href='data:post.addCommentUrl'expr:onclick='data:post.addCommentOnclick'><b:if cond='data:post.numComments==1'>1<data:top.commentLabel/><b:else/><data:post.numComments/><data:top.commentLabelPlural/></b:if></a> </b:if></b:if> </span>

7. Modifique o código acima pelo mostrado abaixo: <span class='post-comment-link'> <b:if cond='data:post.allowComments'> <a class='comment-link' expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><b:if cond='data:post.numComments == 0'> <p style='font-size:100%'>Seja o primeiro a comentar!</p> <b:else/> <b:if cond='data:post.numComments== 1'><p style='font-size:100%'>1 visitante comentou nesta postagem. Deixe seu comentário.</p><b:else/><p style='font-size:100%'><data:post.numComments/> visitantes comentaram nesta postagem. Deixe seu comentário..</p></b:if></b:if></a></b:if> </span><b:if cond='data:blog.url ==data:blog.homepageUrl'></b:if>

Modifique as partes do código mostradas em azul para as mensagens que você quiser que apareça. A primeira mensagem é para 0 comentários, a segunda para 1 comentário e a terceira para 'n' comentários, sendo 'n' um número maior que 1. Modifique os números mostrados em amarelo para o tamanho em que o link deve aparecer.

8. Caso você deseje que uma imagem apareça no lugar do link, ou mesmo junto a ele, adicione o código da imagem junto a parte mostrada em azul.

Bom proveito!

Teve alguma dificuldade ao seguir a dica acima? Deixe um comentário nesta postagem. Você será respondido o mais breve possível.

Como modificar o URL de seu Blog e adicionar código de transposição ao URL antigo

Às vezes, por um motivo ou outro, você quer mudar o URL (endereço) de seu blog para outro do qual você gostou mais ou que só agora ficou disponível. Para isso faça o seguinte:

Acesse www.blogger.com e faça o login. Nas opções de edição de seu blog vá para CONFIGURAÇÕES-->PUBLICAÇÃO. Nesta página você verá o endereço de seu blog, com uma opção para modificá-lo. Digite o novo endereço e clique em SALVAR CONFIGURAÇÕES.

Agora que seu blog tem outro endereço não vá deixar seus leitores na mão, sem saberem para onde foi seu blog! Faça o seguinte:

1. Volte para o painel (www.blogger.com)
2. Clique em CRIAR BLOG
3. No novo blog que você estará criando, deixe o endereço antigo de seu outro blog. Selecione um modelo qualquer para o blog no próximo passo e finalmente clique em CONCLUIR
4. Clique COMEÇAR A USAR O BLOG
5. Vá para a página LAYOUT-->EDITAR HTML-->Busque a parte do código
   </head>
   Logo antes dela cole este código:
   <meta http-equiv="refresh"content="10;URL=http://endereço.do.blog"></meta>
   Modifique endereço.do.blog para o novo endereço de seu outro blog. (não esqueça do http://). Salve o modelo.
6. Crie uma postagem no novo blog. Escreva na postagem algo mais ou menos assim:
   "http://endereçoantigodoblog.blogspot.com moveu-se para http://novoendereçodoblog.blogspot.com. Caso você não seja redirecionado em 10 segundos para o novo blog, clique aqui."
   Modifique http://endereçoantigodoblog.blogspot.com pelo endereço antigo do primeiro blog e http://novoendereço.blogspot.com pelo endereço para o qual ele se mudou. Deixe um link em clique aqui para o novo endereço do blog e modifique o resto do texto como quiser. Publique a postagem e visualize o blog.

Teve alguma dificuldade ao seguir a dica acima? Deixe um comentário nesta postagem! Você será respondido o mais breve possível.

Editando o Cabeçalho - Algumas dicas

Dicas para modificar ou editar o cabeçalho de seu blog.

Para ocultar o Cabeçalho -

1. Após o login em www.blogger.com vá para a página LAYOUT-->EDITAR HTML. Antes de tudo, baixe o modelo de seu blog utilizando o link apresentado na janela EDITAR HTML. Assim, caso algo errado aconteça na edição de HTML, tudo que você tem a fazer é baixar o modelo antigo para as coisas ficarem como estavam. 2. Busque a tag

]]></b:skin>

3. Logo antes desta tag, cole o código a seguir

#Header1 { display:none; } #header-wrapper { display:none; }

4. Salve as alterações e visualize o blog.

Para remover definitivamente o Cabeçalho -

Você pode já ter tentado remover o cabeçalho de seu blog do mesmo modo como você remove os elementos de página, isto é, clicando para editar e depois no botão EXCLUIR. No entanto, se você já tentou remover, você com certeza percebeu que o botão não está presente na edição do cabeçalho. Para modificar isto, faça o seguinte:

1. Vá para a página LAYOUT-->EDITAR HTML. Baixe o modelo do blog. 2. Busque a tag

<body>

3. Logo após esta tag, você verá o seguinte código (no lugar onde está o escrito Título do Blog estará o título de seu blog):

<div id='header-wrapper'><b:section class='header' id='header' maxwidgets='1'><b:widget id='Header1' locked='false' title=Título do Blog (Cabeçalho)' type='Header'/></b:section></div>

4. Modifique o código locked='false' para locked='true' e salve as alterações. 5. Vá para LAYOUT-->ELEMENTOS DE PÁGINA. Clique EDITAR o cabeçalho - você verá que agora o botão EXCLUIR não está mais oculto.

Para centralizar o título de seu blog no Cabeçalho -

1. Após o login em www.blogger.com vá para LAYOUT-->EDITAR HTML e busque este código

<div id='header-wrapper'><b:section class='header' id='header' maxwidgets='1'><b:widget id='Header1' locked='false' title='Dicas para Bloggers(Cabeçalho)' type='Header'/></b:section></div>

2. Logo antes de id='header-wrapper' cole align='center'. Salve as alterações e visualize o blog.

Como remover a barra de navegação do Blogger

Para remover a barra de navegação do Blogger (veja figura abaixo)

em seu blog, siga os seguintes passos:

1. Acesse www.blogger.com
2. Após o entrar com sua conta do blogger clique em Layout ---> Editar HTML.
3. Na parte de CSS do HTML de seu blog busque este código: ]]></b:skin>
   (Para achar esta tag na "confusão" de códigos do seu blog pressione as teclas Ctrl+F e na janela que aparecerá digite a tag que você está buscando).
4. Imediatamente antes da ]]></b:skin> , cole o seguinte código: #navbar-iframe {height:0px; visibility:hidden; display:none}
   Se você proceder corretamente o resultado será este: #navbar-iframe {height:0px; visibility:hidden; display:none} ]]></b:skin>
5. Salve o seu template e visualize o blog

Bom proveito!