Titulo do Post Colorido

O tutorial de hoje, é super simples e foi eu que fiz. Não sei se já existe e tal, só sei que foi eu que fiz. Eu vi que dava pra colocar negrito, itálico e sublinhado no título dos posts, então, fui ver se dava pra deixar o título com várias cores, e acabei conseguindo. O código é super simples, de boa.

Quando você for colocar o título do post, cole esse código:

<span style="color: #COR;">Palavra1</span> <span style="color: #COR;">Palavra2</span> <span style="color: #Cor;">Palavra

3</span>

Aonde está em negrito, você coloca a cor em códigos, claro. E onde está em itálico a palavra que você quer que fique com aquela cor. E assim vai indo, até todas as palavras ficarem coloridas.

Fontes para Download

No site dafont.com tem milhares e milhares de fontes maravilhosas para fazer download. Selecionei 5 das minhas preferidas para vocês baixarem as que gostarem. Clique na imagem para fazer o download.

Backgrounds Neutros

Backgrounds neutros para você usar no seu blog. Os bgs foram retirados do site super últil Subtle Patterns, visitem assim que puderem porque lá é cheio de backgrounds lindos para todos os tipos de gostos. Ao todo são 14 backgrounds.

 
 

 

 

Como Usar o @Font-Face

Como usar o @Font-Face, que é uma propriedade das fontes no Html.

A tag @font-face destina-se a especificar um tipo de fonte em uma página, site ou blog.

Lembre-se que você deve fornecer uma lista de fontes terminando com uma fonte genérica para exibir seus textos. Por exemplo:

font-family: "Lucida Grande", "Lucida Sans", Verdana, Sans-Serif;
}

Por exempo, queremos usar a fonte "RegencyScriptFLF Regular" no CSS. Observe as regras CSS a seguir ::

@font-face {
font-family: "RegencyScriptFLF Regular";
src: url("http://site/fontes/RegencyScriptFLF-Regular.ttf");
}

Como vocês podem ver, nós sempre colocamos no nome da fonte, e embaixo você vai ter que sempre colocar a Url da fonte, como mostra acima. Não é complicado, viram ?

Então sempre que for usar o @Font-Face, você irá usar esse formato, substituindo as partes em negrito:

@font-face {
font-family: "NOME DA FONTE";
src: url("URL DA FONTE");
}

Mini Music Player Colorido

Como fazer mini music players coloridos para colocar no blog. Exemplo:

1. Entre no MP3 Player (x)
2. Lá na página, haverá três abas, clique na que diz 'Players'
3. Na página, aparecerá várias opções de players, escolha o 'Mini'.
4. Aparecerá uma página com um player e um menu ao lado. Nesse menu, clique em 'Generator' (x)
5. Irá abrir uma página tipo essa aqui, certo?
Ótimo! Agora vamos personalizar o player. Se você observar, na página terá um player preto, ele é o preview do que você está fazendo,  ou seja, tudo o que você modificar ali, aparecerá naquele player preto.
Na parte que tem um menu drop down, são as categorias. Iremos editar primeiro a categoria 'General'.
6. Em 'MP3' você vai colocar o link da musica que você quer que fique no player.
Para fazer isso, entre nesse site aqui. E pesquise pela música que você quer. Pesquisei por All Time Low, da The Wanted, mas você pesquisa pela que você quiser, lógico.
Irão aparecer várias opções da música que você pesquisou, clique em uma. 
Assim que você clicar em uma, irá aparecer uma pergunta tosca que matemática, tipo essa (x). Aí é só colocar a resposta lá e clicar em 'download'. (não irá fazer o download).
Aparecerá uma página, e lá estará: "MP3 URL:" acompanhado do seu código. Copie esse código e cole lá na página do Mini MP3, onde se pede.
7. Abaixo de 'mp3' terá width e height, ou seja, largura e altura do player. Ajuste do modo que quiser.
8. Se você quiser que a música se inicie sozinha, marque a opção '1' do autoplay. Caso queira que tenham que clicar no play do player pra musica começar, deixe como '0'.
Agora personalizaremos as cores do player.  10. Na aba de categorias, selecione a opção 'colors' (x).
11. Em bgcolor você escolhe a cor do fundo do player
12. Em loadingcolor você escolhe a cor da linha que vai passando, no decorrer do carregamento da musica.
13. Em buttoncolor você escolhe a cor do play e do pause
14. Em slidercolor você escolhe a cor do botton que fica andando no decorrer da musica.
Você pode usar essa ou essa tabela de cores. Lembrando que quando você for colocar o código das cores, você NÃO PODE colocar com esse negócio '#'. Tipo, se eu for colocar a cor branca, o código será esse: #FFFFFF, mas eu tenho que tirar isso # e deixar só o código.
Seu player está pronto! Agora para coloca-lo no seu blog, é só copiar o código que está na caixinha, e colar em um widget de HTML/JavaScript.

Separar Postagens e Widgets

Ao invés de deixar os posts/widgets da página colados, você pode deixar um espaço entre eles.

Separar Área dos Posts

1. No HTML do seu blog, aperte F3 e procure por .main-inner .column-center-outer { 2. Apague todo o código que o acompanhe, ou seja, do código procurado até a } 3. E no lugar, cole:

.post-outer {
	margin: 3px 8px 15px;
	background:#fff; /* Cor do fundo dos posts */
	padding: 5px 5px;
	padding: 5px;
	box-shadow: inset 0 0 0px #B2D3D7, 0 0 3px #d9d7d7; /* Sombra */
	border-radius: 8px; /* Bordas Arredondadas */
	}

Visualize e se estiver tudo separadinho, salve.

 Separar Widgets

1. No HTML do seu blog, aperte F3 e procure por /* Widgets

2. Abaixo dessa tag, haverá um código que começa assim .sidebar .widget {

3. Apague todo esse código e o que o acompanha, ou seja, o título do código até a }

4. E no lugar cole isso:

.sidebar .widget {
	width:100% !important;
	background:#fff; /* Cor do fundo dos widgets */
	padding-left: 10px;
	padding-bottom: 10px;
	padding-right:10px;
	padding-top: 5px;
	margin: 30px 0;
	box-shadow: inset 0 0 0px #B2D3D7, 0 0 3px #d9d7d7; /* Sombra */
	border-radius: 8px; /* bordas arredondadas */
	}

Visualize e se estiver tudo separado, salve.

Mudar a Cor da Seleção de Texto do Computador

Como mudar a cor (de azul para a que deseja) da seleção de texto do seu computador.

1. Na sua desktop (página inicial, onde fica os ícones de navegação e tal), aperte o botão direito do mouse, e clique em 'Personalizar', a ultima opção.

2. Vai aparecer uma página, clique em 'Cor da Janela' [x]

3. Na outra página que aparecer, clique em 'Configurações de Aparência Avançada...' [x]

4. Na janelinha que abrir, em 'Item', selecione Itens Selecionados [x]

5. Ao lado você poderá escolher o tamanho da fonte e a cor da seleção de texto [x]

Aí é só você personalizar de acordo com o que você quer o tamanho e a cor, e clicar em 'ok'. Pronto, sua seleção de texto do pc estará colorida.