05 Convites para o novo Orkut: Quem vai querer?

Novo Orkut: 5 Convites Para O Novo Orkut

Muito bem amigos, interrompemos a nossa programação normal (até parece) para anunciar que o Novo na Rede está com 5 (cinco) convites para o novo Orkut e que para recompensar a paciência e amizade de vocês que estão sempre por aqui, vamos fazer uma espécie de sorteio entre os leitores.

Na verdade essa é apenas uma pequena promoção que veio bem a calhar, sendo que os dois anos do Novo na Rede chegaram e passaram sem ser comemorados (eu sei, não tem desculpa :P).

Foi no dia 22 de novembro de 2007 que nasceu o Novo na Rede. Portanto, completamos 2 anos no último dia 22. Isso mesmo amigos, 2 anos de muita luta, sangue, suor e lágrimas (triste isso né? Fala sério!). Apesar de alguns problemas, os 2 anos do Novo foram antes de tudo uma benção na minha vida em todos os sentidos. E quem acompanha a blog sabe bem do que estou falando.

Já que não comemoramos como devíamos, hoje vamos ao menos dar um pequeno presente para 5 dos leitores do Novo na Rede.

Como vai funcionar?

Para ganhar o seu convite (além de ainda não ter o novo Orkut óbvio) você só precisa seguir duas regrinhas básicas:

1. Ir até o meu perfil no Orkut e se tornar meu amigo.

2. Vir até esta página e deixar um comentário dizendo que quer o convite e que já esteve no Orkut fazendo o pedido de amizade.

Prontinho! Eu vou conferir tudo e você leva o convite!

Atenção: Os cinco primeiros levam. Se um dos cinco não cumprir as regras, o sexto leva. E assim por diante! Depois eu atualizo esta página com os ganhadores ok?

Antes uma nota: Obrigado amor por sair espalhando a notícia que eu era um desprovido de Orkut (olha a maldade) e obrigado Vivi por responder ao chamado e me incluir nessa! :D

É isso aí amigos! Os comentários estão abertos e temos 5 convites para o novo Orkut!

Quem vai querer?


[Continue lendo]

Menu: Como criar um menu simples e eficiente para o seu blog!

E hoje, no nosso espaço "Quero Saber!" vamos atender ao pedido do amigo Ferreira que quer saber como criar um menu como esse que eu tenho aqui no Novo na Rede (Home, Sobre, Feed(rss), Política de Privacidade, Contato).

Importante: Antes de fazer qualquer alteração no seu blog salve uma cópia do seu template. Por mais que pareça besteira, por vezes um simples ponto a mais ou a menos pode estragar seu template e você acabar ficando perdido sem saber onde alterou e consequentemente não tendo como arrumar. Portanto, sempre salve uma cópia do seu template (depois não diga que eu não te avisei).

Para baixar seu template:

Clique em Expandir modelos de widgets e em seguida clique em Baixar modelo completo para salvar uma cópia do seu template no seu computador.

Importante 2: Leia todo o conteúdo do post antes de tentar fazer o que o tutorial está ensinando. Basta ter paciência e ler tudo com cuidado, seguindo os passos com atenção que não tem erro.

Menu Eu diria que este é um tutorial de nível médio, mas que requer muita atenção, um pouquinho de tempo e boa vontade para entender tudo e fazer as modificações necessárias para que o menu fique exatamente como você queira. Mas acredite, se você realmente tentar de verdade o resultado final vai valer a pena!

Passo 01: Adicionando o menu

Para adicionar o menu ao blog, você vai poder escolher onde quer que ele apareça. Para isso, procure pelo trecho responsável pelo cabeçalho no seu template, algo parecido com isso:

<div id='header-wrapper'>
<b:section class='header' id='header' maxwidgets='1' showaddelement='no'>
<b:widget id='Header1' locked='false' title='Novo na rede (Cabeçalho)' type='Header'/>
</b:section>
</div>

Se você quiser que o menu apareça antes do cabeçalho do blog cole o código do menu antes do código do cabeçalho. Se quiser que apareça depois, cole o código do menu depois do código do cabeçalho.

Ah! O código do menu:

<div class='menu' id='menu'>
<ul>
<li>
<a href='http://novonarede.blogspot.com' shape='rect' title='Página inicial'>Home</a>
</li>
<li>
<a href='http://novonarede.blogspot.com/2007/11/de-tudo-um-pouco.html' shape='rect' title='De tudo um pouco'>Sobre</a>
</li>
<li>
<a href='http://feeds.feedburner.com/novonarede/' shape='rect' title='Feed Posts'>Feed(rss)</a>
</li>
<li>
<a href='http://novonarede.blogspot.com/2009/02/politica-de-privacidade.html' shape='rect' title='Política de Privacidade'>Política de Privacidade</a>
</li>
<li>
<a href='http://novonarede.blogspot.com/2007/11/faca-contato.html' shape='rect' title='Faça contato'>Contato</a>
</li>
</ul>
</div>

Ps: Como você deve ter percebido, os links que estão no menu são os do Novo na Rede e para alterá-los, você vai ter que pegar os seus links e substituir os meus pelos seus! :D

Para adicionar mais links ao menu, basta adicionar mais trechos <li> antes da tag </ul>. Por exemplo:

<li>
<a href=SeuLinkAqui' shape='rect' title='Título do link aqui'>Título do link aqui</a>
</li>

Passo 02: Adicionando estilo ao menu

Procure pelo trecho abaixo:

/* Header

Além desse trecho você vai notar que existe todo um código relativo ao Header (cabeçalho do blog): #header-wrapper / #header-inner

Vale o mesmo que você fez quando adicionou o código do menu. Se colocou o código do menu acima do código do cabeçalho no Passo 01, coloque o código do estilo do menu antes (ou acima) do Header. E se colocou o código do menu depois do código do cabeçalho, coloque o estilo do menu depois do Header.

* Menu
----------------------------------------------- */
.menu {
width: 100%;
height:27px;
margin: -46px 0 0 0;
padding: 0;
float: left;
font-size:13px;
font-family:sans-serif,Verdana,Tahoma,Helvitica;
}
.menu ul {
width: 100%;
height:27px;
margin: -38px 0 0 0;
padding: 8px 9px 12px 9px;
list-style-type: none;
float: left;
}
.menu li {
margin: 0;
display: inline;
}
.menu li a {
margin: 0;
padding: 8px 9px 12px 9px;
text-decoration: none;
color: #2BA94F;

}
.menu li a:hover {
background: #2BA94F;
padding: 8px 9px 12px 9px;
color: #ffffff;
}

Clique em SALVAR e seu menu está pronto!

Entendendo o estilo do menu

Controla o menu em si, o tipo de fonte e os estilos de lista, assim como o espaçamento:

.menu {
width: 100%;
height:27px;
margin: -46px 0 0 0;
padding: 0;
float: left;
font-size:13px;
font-family:sans-serif,Verdana,Tahoma,Helvitica;
}
.menu ul {
width: 100%;
height:27px;
margin: -38px 0 0 0;
padding: 8px 9px 12px 9px;
list-style-type: none;
float: left;
}

Controla o link normal e o link antes de ser visitado:

.menu li {
margin: 0;
display: inline;
}
.menu li a {
margin: 0;
padding: 8px 9px 12px 9px;
text-decoration: none;
color: #2BA94F;
}

Controla o link depois de ser visitado:

.menu li a:hover {
background: #2BA94F;
padding: 8px 9px 12px 9px;
color: #ffffff;
}

Uma coisa que você precisa levar em conta:

Tanto o código do menu, quanto os estilos que estão neste tutorial são os que uso aqui no blog. Para você usá-los de acordo com o estilo do seu blog, você vai precisar alterar as cores dos links.

Primeiro você vai precisar saber os códigos das cores que você quer usar. Para isso, você pode consultar a tabela de cores que já postei aqui no blog clicando aqui!

Não tem segredo, os códigos de cores para o estilo do menu vão estar sempre com o símbolo e os números assim: #ffffff (este é o código relativo a cor branca, já o preto por exemplo é assim: #000000).

Basicamente é isso pessoal! Espero que vocês gostem e que consigam fazer as adaptações necessárias, mas qualquer coisa é só dizer (os comentários estão aí para isso).

Faça bom uso!

Imagem: Fotos Grátis


[Continue lendo]

Como colocar anúncios entre o título e o conteúdo do post

SOS Money

Como eu disse no post anterior, estamos de volta amigos! E hoje, no nosso espaço "Quero Saber!" vamos atender ao pedido do amigo Wander e vamos aprender como colocar anúncios entre o título e o conteúdo do post.

Importante: Antes de fazer qualquer alteração no seu blog salve uma cópia do seu template. Por mais que pareça besteira, por vezes um simples ponto a mais ou a menos pode estragar seu template e você acabar ficando perdido sem saber onde alterou e consequentemente não tendo como arrumar. Portanto, sempre salve uma cópia do seu template (depois não diga que eu não te avisei).

Para baixar seu template:

Clique em Expandir modelos de widgets e em seguida clique em Baixar modelo completo para salvar uma cópia do seu template no seu computador.

Importante 2: Leia todo o conteúdo do post antes de tentar fazer o que o tutorial está ensinando. Basta ter paciência e ler tudo com cuidado, seguindo os passos com atenção que não tem erro.

Fase 01: Quais anúncios você usa?

A pergunta aqui é pertinente, pois tem gente que usa anúncios UOL e outros usam AdSense, além da turma que gosta de variar e fazer vários testes (levante a mão quem quiser me acompanhar \o).

Vamos ver:

Se você usa anúncios UOL, verá algo assim:

<script type="text/javascript">
<!--

Conteúdo do anúncio

-->
</script>

Já você que usa anúncios AdSense, verá algo assim:

<script type="text/javascript"><!–

Conteúdo do anúncio

//–>
</script>

Preste bastante atenção, se os seus anúncios são parecidos com esses você deve ficar ligado nos destaques em vermelho (é claro que os seus anúncios não tem nada em vermelho, só estou usando o vermelho aqui para destacar melhor tá?). Isso vale para o UOL o AdSense e qualquer outro que tenha trechos parecidos com os mostrados acima destacando o conteúdo do código do anúncio (<!-- e --> ou <!- e //->).

Agora você vai querer saber por que isso é importante certo? Hein?

Isso é importante porque se você jogar um anúncio que contenha os trechos mostrados acima direto no código do Blogger, não vai aparecer anúncio nenhum no seu blog e você vai pensar que fez coisa errada. Então, preste MUITA atenção agora!

Substitua (troque mesmo) os caracteres destacados em vermelho nos códigos acima da seguinte forma:

Este < por este &lt;

Este > por este &gt;

Por exemplo, no caso do AdSense ficaria assim:

<script type="text/javascript">&lt;!–

Conteúdo do anúncio

//–&gt;
</script>

Fase 02: Inserindo o código do anúncio no código do Blogger

Agora que você já sabe se o seu anúncio precisa ser alterado ou não e já sabe como fazer, vamos ver onde e como adicioná-lo no código do Blogger.

Em primeiro lugar, como já disse acima, salve uma cópia do seu template (sei que está ficando chato, mas prefiro isso ao ver gente reclamando que eu estraguei o seu blog).

Procure pelo código abaixo e adicione o seu código do anúncio modificado logo DEPOIS dele:

<div class='post-header-line-1'/>

Em seguida, clique em SALVAR e pronto!

Isso irá fazer seus anúncios aparecerem em todas as partes do blog entre o título dos posts e o seu conteúdo.

Fase 02: Alternativa

AnunciosNoPost Fazendo da forma como foi explicado os anúncios aparecerão em todas as páginas do blog, arquivos, categorias, etc. Inclusive na home (página inicial).

O problema aí é que você pode não querer "poluir" tanto essas páginas não é mesmo?

Se você quiser fazer como eu faço aqui, ou seja, que os anúncios apareçam somente quando o post é aberto individualmente (como está aparecendo na imagem aí do lado esquerdo), existe um truque simples, mas que faz a diferença!

No mesmo local onde eu indiquei para que você adicionasse os anúncios (abaixo do trecho <div class='post-header-line-1'/>), adicione o código, mas dessa vez, como está abaixo:

<b:if cond='data:blog.pageType == "item"'>

Seu anúncio modificado aqui

</b:if>

Como você deve ter visto, são duas tags (b:if abrindo e fechando) que vão antes e depois do seu anúncio modificado. Não é legal?

Heim? O que essas tags fazem?

Ei, você não estava prestando atenção né?

As tags fazem com que os anúncios apareçam apenas no post aberto individualmente, assim como acontece aqui no Novo. Se não acredita, faça o teste. Clique aqui para ir até a página inicial do blog e tente encontrar por lá um anúncio (um anúnciozinho que seja) embaixo do título de algum post. Agora, se você rolar a barra voltando ao início vai ver os anúncios aqui na página individual do post. Bacana né? :D

Bom pessoal, basicamente é isso!

Tirando as brincadeiras do Tio Tico, o tutorial está certinho e tudo funciona como tem que ser, não se preocupe!

Faça o teste e experimente, qualquer dúvida já sabe, deixe nos comentários logo abaixo. Isso se a sua dúvida for sobre este post. Agora, se tem alguma outra dúvida, não fique perdendo tempo aí! Vá até a página Quero Saber e deixe seu recado que logo sua dúvida será respondida em forma de post com direito a link e tudo mais!

Aqui você acabou de aprender direitinho como colocar anúncios entre o título e o conteúdo do post.

Faça bom uso!

Imagem: Rafael Ortman


[Continue lendo]

Novo de Novo: Muito trabalho, mas estamos de volta!

Olá amigos, depois de um longo e tenebroso inverno (tá! nem tão longo e muito menos tenebroso! nem inverno é… deixa quieto :P) estamos de volta! :D

Você sabe, eu sei, nós sabemos que o Novo na Rede é o meu blog do coração e que eu jamais o abandonaria né? Não sabe? Fique sabendo!

O Novo foi o meu primeiro blog e é sem dúvida aquele do qual eu mais gosto. Primeiro porque me propiciou conhecer ela (você sabe) e me ajudou a aprender o básico e conseguir caminhar com as próprias pernas como faço hoje.

No dia 22 de novembro o Novo na Rede completa 2 anos de existência e a festa já começou!

Hoje quero primeiro pedir desculpas por ficar esses dias sem postar, mas as razões são boas.

Para começar, vamos falar da nova cara do Novo (Novo de Novo ;)).

NovoAntesEDepois

Já faz tempo que o Novo precisava de uma repaginada, mas como o tempo nunca sobra, enfim… finalmente consegui um tempinho e fiz um novo template. E como é novo mesmo amigos, tenham paciência e em caso de falhas, por favor, avisem o tio Tico! ;)

Agora vamos ao trabalho:

Esse mês foi muito, mas muito produtivo! E quero dividir com vocês o que andei fazendo!

Fluindo o Olhar

FluindoAntesEDepois

O Fluindo o Olhar é um blog que trata de temas variados, na maioria das vezes falando de coisas que acontecem com todos nós, mas de forma mais leve e principalmente de forma a nos fazer pensar.

Jenny Rugeroni, Marcus Alencar e Viviane Righi são os autores do blog e cada um deixa ali sua marca, suas ideias e principalmente uma lição sempre. Como descrevem o blog: "…para motivar olhares a fluírem através de suas reflexões"

O trabalho no template do Fluindo o Olhar foi um desafio e tanto porque o blog é escrito a seis mãos como eu disse, então agradar três ao invés de um não é fácil! Mesmo não chegando a conversar com a Jenny ou com o Marcus, tratando sempre com a amiga Vivi que fez esse papel de intermediar as negociações e se entender com seus outros dois sócios! :D

O resultado você pode conferir clicando aqui!

Benefícios da Previdência

BeneficiosAntesEDepois

O blog Benefícios da Previdência de responsabilidade do Catarino (quem não conhece o Catarino do diHITT levante a mão) é um blog muito especial e que ajuda muita gente, ajuda principalmente quem já batalhou a vida inteira e agora precisa de um descanso, que são as pessoas que estão para se aposentar ou já se aposentaram.

Quando o Catarino entrou em contato comigo pedindo para reformular a cara do blog Benefícios da Previdência, me deixou bem livre para fazer o que eu achasse melhor e pensei que uma cor mais viva e letras maiores seriam o ponto de partida. E foi o que aconteceu.

O blog hoje está com a cara do dono e eu me sinto feliz por ter feito um template que facilite a participação das pessoas e principalmente ajude a encontrar as preciosas informações que o Catarino tem para oferecer.

Contatos imediatos

ContatosPagina Não sei se teve alguém que perdeu (se perdeu, perdeu mesmo) a promoção de comemoração dos 2 anos de vida do Café com Notícias do meu amigo Wander Veroni.

O Wander entrou em contato comigo perguntando se eu não poderia contribuir com o aniversário do blog e como amigo não pede, manda, topei na hora!

Da minha parte, ofereci a criação de um template básico para o vencedor da promoção. E não é que para a minha surpresa, encontrei um sujeito nota 1.000 na figura do ganhador.

Olha que eu já devia ter entregue esse template antes, mas como andava na correria e o tal do Apolinário Júnior foi tão legal comigo que acabou essa história de prazo de entrega e também de template básico. É como eu digo, sabendo levar, você consegue tudo do tio Tico! :P

Fiz mais um amigo e o mais importante, acredito que consegui tornar realidade o sonho de um blogueiro que tem um excelente texto e agora uma moldura para destacá-lo. Quem quiser conferir é só clicar aqui!

Apolinário, parabéns meu amigo e felicidades com a nova casa!

Motivos não faltam

Bom pessoal, motivos não faltam, tenho trabalhado e muito, dentro e fora da rede, sempre com muito sucesso, graças a Deus. Além dos templates, também tenho feito:

Ikaro Brasil: Escrevo textos diariamente para o blog Ikaro Brasil com tutoriais, dicas de programas e serviços e muito mais. Confira!

Master New Media: Traduções semanais de textos do inglês para o português. Os textos também tratam de tutoriais, programas, serviços e dicas de como se tornar um blogueiro de sucesso. Confira!

Além disso, trabalhos de webdesign e criação de projetos (ainda sigilosos) tem pipocado e eu sei que isso não é desculpa!

Acreditem amigos, o Novo está de cara nova, mas a disposição e o carinho desse sujeito que vos escreve continuam os mesmos com relação aos amigos, leitores e esse espaço tão querido.

Obrigado mais uma vez a todos que confiam e confiaram no meu trabalho. Espero continuar correspondendo da melhor maneira possível.

Obrigado aos amigos que sempre estão do meu lado e apesar de ficar tanto tempo sem postar nada (isso vai mudar, sério) continuam visitando esse blog e deixando seus comentários.

Obrigado a quem está chegando agora (sinta-se em casa).

E obrigado a você, é, você aí, também conhecida como amor da minha vida (por mim é claro, para os outros é Letícia Castro heim?)! MUITO OBRIGADO por acreditar em mim e resolver seguir esse caminho ao meu lado. ;)

MUITO OBRIGADO a todos os amigos e conto com vocês nesse mês de comemoração!


[Continue lendo]

TUTORIAIS E DICAS:
 

Posts Recentes

Novo na Rede


Pode perguntar que se eu souber respondo sem problemas! A idéia aqui é essa!
Este é um blog voltado para quem está começando, tanto em matéria de blogs, quanto na internet em geral.
Todos são bem-vindos!

Estatísticas do Blog

Top Comentaristas: