Tweet Estilos para Texto com CSStext - Aplicativo Online

  Mais uma dica para quem quer aprender praticando  CSS . É também uma excelente ferramenta para desenvolvedores de sites e para quem cria templates ou deseja customizar detalhes de texto nos novos templates do “Designer Blogger”
O CSStext createsastyle “traduz” um texto para CSS no estilo que você desejar. Nele podemos determinar o espaçamento entre  letras (Letter spacing), palavras (Word spacing) tamanho de letra em pixel ou em porcentagem (Font size), cor da letras, com ou sem bordas, espessura das bordas, tipos de borda, com ou sem fundo, alinhamento (Text-align), enfim… Tem ainda a opção [+] Advanced options onde podemos definir margin, padding (distancia entre o texto e a margem) largura e altura do bloco de texto.

Leia mais...

Tweet Laranja Rosa – Blogger Template

Eu amo os tons de laranja por isso tive muito prazer em desenvolver esse layout. É um desenho bem feminino que pode ser usado para um blog pessoal. Tem espaço discreto para publicidade (opcional). Sua visualização, com todos os detalhes de bordas e sombras é bem melhor no Firefox.

DEMO ► Veja o template

DOWNLOAD ► Pasta compactada com documento XML e imagens

DOWNLOAD ► Apenas o XML

........................................................................

Propriedades:

• Menu de navegação no header (Editável em Elemento de Página)
• Destaque para postagem mais recente
• Postagens separadas por blocos
• Sidebar com uma coluna
• Ícones sociais com efeito hover na sidebar
• Script para postagens resumidas com thumbnails
• Script para artigos relacionados
• Três colunas no rodapé
• Elementos de página no header e footer

 .................................................................................................

Estrutura do layout



Para mudar os ícones sociais, caso queira troca-los, clic na aba “Editar HTML” e procure pelo trecho abaixo e coloque o endereço da sua imagem no local indicado em vermelho.

#sectionmy .sectionmy2 h2.rss {
background:url('http://i9.photobucket.com/albums/a65/mamanunes/feedSub.png') no-repeat top left;
}
#sectionmy .sectionmy2 h2.email {
background:url('http://i9.photobucket.com/albums/a65/mamanunes/new-mail-sub.png') no-repeat top left;
}
#sectionmy .sectionmy2 h2.twitter {
background:url('http://i9.photobucket.com/albums/a65/mamanunes/_twitter.png') no-repeat top left;
}
#sectionmy .sectionmy2 h2.faceboock {
background:url(http://i9.photobucket.com/albums/a65/mamanunes/_facebook.png) no-repeat top left;
}

Para direcionar o link para sua página, procure em seu HTML o  trecho abaixo e faça as alterações.

<h2 class='subscription rss'><a href='SEU-URL-RSS-FEED'>Assine este Feed</a></h2>

<h2 class='subscription email'><a href=' SEU-URL-FEED-EMAIL-SUBSCRIPTION '>Receba novidades via EMAIL</a></h2>

<h2 class='subscription twitter'><a href='SEU-URL-TWITTER'>Siga-me no TWITTER</a></h2>

<h2 class='subscription faceboock'><a href='SEU-URL-TWITTER'>Siga-me no Faceboock</a></h2>

Se tiver algum problema para instalar, não se acanhe. Escreva pelo formulário de contato ou email e eu terei prazer em ajudar.

DEMO ► Veja o template

DOWNLOAD ► Pasta compactada com documento XML e imagens

DOWNLOAD ► Apenas o XML

Um abraço!

Leia mais...

Tweet Hoje é o Dia do Blogueiro Sabia?

Pois é. Tem dia pra tudo nesse mundo e  eu já havia me esquecido dessa data. Ainda bem que a querida Cristiane Fetter  do blog TÔ DOIDA  me lembrou.

Engraçado, quando comecei a blogar em 2004, essas coisas eram importantes. Comemorar o dia do amigo, o dia da solidariedade, blogagem coletiva e os benditos  "memes" que enlouqueciam a gente. Quase não haviam blogueiros. A maioria dos blogs eram de mulheres que escreviam seu cotidiano, poesias e postavam suas tarefas em Paint Shop, gifs, papéis de carta, coisas de mulher; o sucesso de um  blog estava diretamente ligado as visitas e comentários constantes em blogs. Uma troca bem interessante, diferente de hoje com tantas redes sociais, Twitter, Facebook, Orkut e sei lá mais quantos outros, eu mesma "participo" de uns tantos mas confesso que é mais por curiosidade em saber como funciona.

Leia mais...

Tweet Find Ícons – O Maior Banco de Ícones da Web

O Find Icons é o mais completo buscador de ícones que eu conheço. São mais de 300.000 ícones.
Podemos encontrar exatamente o que procuramos, no tamanho e formato que queremos. Por exemplo : Se você procura um ícone para o Twitter, digita twitter na caixa de busca, certo?  Na página com os resultados da busca você verá na coluna esquerda, todas as opções de fundo, filtro, modelo, etc….

Leia mais...

Tweet Widget de Paginação com barra rolante (Scroll)

ATENÇÃO!
Atualização em  27/07/2010. 
*IMPORTANTE: Para  garantir o funcionamento no caso de problemas com a hospedagem do script, não esqueça de baixa-lo e guarda-lo em seus arquivos como está indicado no final deste post.

A widget de paginação numerada mais comum que vemos em sites e blogs tem essa aparência:

...............................

 ......................................

Esta que veremos aqui foi nossa querida @Gema nos apresentou. Criada por Abu Farhan , tem a mesma função mas com estilo diferente: Não mostra os quadradinhos de navegação nem o  “Pages (…)”. Ela apresenta uma linha com os números e um efeito deslizante (scroll) . Segundo seu criador, o mais importante é que ela pode apresentar mais de 500 postagens. Você poderá ver seu funcionamento na HOME deste blog.

Leia mais...

Tweet Colocar um Botão flutuante “Follow Us” - Twitter

“Podemos colocar um ícone Twitter como imagem flutuante com posição fixa. Isso vai atrair o visitante para clicar nele. Você pode conferir a demo Emocutez Veja,  na posição inferior direita da tela, há um gracioso ícone Follow Us onTwitter.”
Esse botão e o tutorial  foram publicados por Ipiet  e eu achei lindinho, além de fácil de colocar.  Por isso traduzi para vocês.
Como fazer? Siga este passo a passo.

Leia mais...

Tweet Aprender e praticar CSS3

Para quem quer aprender um pouco sobre CSS3 há alguns sites onde se pode aprender praticando.  Um deles é o “CSS Please” . Você só precisa entrar no site e vai encontrar um painel com os códigos do lado esquerdo, que podem ser editados alterando os valores. O resultado aparece simultaneamente num quadro ao lado direito. Pode-se mudar o ângulo, as cores, sombras, background. Tudo. É bastante interessante.

Leia mais...

Tweet Designer Blogger – Tutorial Básico I

Aprenda passo a passo, com imagens,  como criar um modelo exclusivo para seu blog no Blogger. Agora ficou mais fácil, vamos ver como funciona. Fiz esse tutorial principalmente para quem nunca nem tentou fazer alterações ou para quem ainda não tem seu espaço na Internet. O Blogger está dando um Show!
Para acessar o Designer de Modelo do Blogger você deve fazer seu login através do Draft Blogger . Crie um blog para fazer seus testes.

Leia mais...

Tweet Bem Vindo “Blogger Template Designer”

Finalmente, o Blogger lançou o novo recurso chamado "Blogger Template Designer". Ele permite personalizar a aparência e o layout do seu blog com apenas alguns clics, sem precisar entender nada de CSS e HTML.  Há muitos modelos incríveis na blogosfera, e  muitos metabloggers de plantão para dar uma forcinha mas certamente você gostará de criar seu próprio modelo, com seu estilo e sem pagar nada (hehe)  O Blogger agora facilitou tudo!
Como usar este “blogueiro designer” do Blogger? 
Está em versão beta, para testes,  então você só poderá ter acesso através do Blogger in Draft . Crie um blog para fazer seus testes. No opção  “Layout”, clic no ícone“ Designer de Modelo”.

Leia mais...

Tweet Fundos Profissionais Para Twitter

 Mude o background, sua imagem de fundo da página principal do Twitter com as criações do  Tweety got Back . O site tem vários modelos, lindos, divididos por categorias. A gente pode escolher e clicar numa das miniaturas e ver como ficará a página com o back instalado e depois, com um só clic, aplica-la em nossa página. Muito simples.  Visitando o blog podemos assistir um vídeo bem interessante sobre o trabalho e a criatividade desse pessoal especial.

Leia mais...

Tweet Tutorial Para Criar Menu ► “Menubuilder”

  Veja como criar um menu de maneira fácil e gratuita, sem precisar de cadastro ou registro, usando o aplicativo “Menubuilder” .
Para quem não sabe, menu é aquela área com links para outras páginas ou sites que você queira indicar, muito útil  para direcionar seus leitores para página com informações tipo: “contato”, “sobre o blog”, “home”, etc..., como vemos no modelo. O Menu pode ser horizontal ou vertical. Em geral usamos o vertical

Leia mais...