Como usar Jotform

pausa pra admirar a beleza da menina da foto e dos coturnos dela

 Chega uma hora na vida de qualquer blogueira na qual ela vai precisar fazer um formulário. Seja pra página de contato, seja pra uma pesquisa ou pra um sorteio, ele vai ser necessário. E pra essa necessidade existe uma solução: o Jotform.
 O Jotform é um site no qual você pode criar formulários de modo simples e rápido, e é super prático de se arrumar ou mudar qualquer coisa depois, caso você precise, e de se ver as respostas que o seu formulário teve.
 Eu acho a plataforma bem simples de se usar, mas como a fofa da Thaís me pediu tutorial e pode acabar ajudando muita gente, aqui vamos nós! :D

Sombra interna no blog

floreeees <3 

 Pra voltar com os meus posts do modo mais certo possível, hoje tem pedido de uma leitora! :D Ela pediu tutorial de como colocar essa sombra que tem na área dos posts e dos gadgets do blog.
 Enfim, acabei esquecendo de terminar esse post ontem e por isso o atraso de hoje, então vou ir direto ao ponto, ok?
 Pra colocar a sombra na área dos posts, abra o HTML do seu blog (Modelo> Editar HTML), tecle ctrl+F e procure por:

.main-inner .column-center-inner {

 Quando achar, cole abaixo desse código o seguinte:

box-shadow: 0 0 15px #ccc; 0 0 5px #ccc;

 Visualize e, se estiver tudo certo, salve! Você pode mudar os códigos em negrito se quiser mudar as cores, usando os códigos que tem aqui.
 Se quiser adicionar a sombra na sidebar, tecle ctrl+F (ainda no html do seu blog) e procure por:

.main-inner .column-right-inner {

 Se a sua sidebar for na direita, e por:

.main-inner .column-left-inner { 

 Se a sua sidebar for na esquerda. Em qualquer uma dessas sidebars, você só precisa adicionar abaixo do código encontrado o seguinte código:

box-shadow: 0 0 15px #ccc; 0 0 5px #ccc;

 E é isso, visualize se deu certo e salve! :D Espero que consigam, qualquer dúvida só comentar ou enviar ask, ok? E me mandem pedidos de posts, por favor!
 Beijos!

Sorvete no Paint

 Há algum tempinho eu postei aqui um tutorial de como desenhar cupcake no paint (se quiser rever é só clicar aqui). Hoje irei ensinar a desenhar sorvetinho.

Cupcake no paint

 Hoje vim dar uma dica pra você, que como eu, não sabe mexer muito bem em programas de edição e sempre quis saber desenhar cupcakes.
 Para isso usaremos o paint, um programa simplíssimo e muito fácil de mexer.

Fitinhas na sidebar

adorei a foto desa menina <3

 Post pedido por uma leitora saindo! E esse é ótimo, na minha opinião. Tenho usado em todos os meus layouts, hahaha (quem acompanha meu blog de encomendas já deve ter notado).
 Acontece que esses dias uma leitora pediu lá na ask da Laura como que fazia, e, claro, que eu não podia deixar de postar, né? Espero que isso a ajude!
 Inicialmente você tem que ir em Layout e em Editar HTML. Muita gente pirou (literalmente) com o novo editor do blogger, mas gente, não mudou quase nada! Só facilitou um pouquinho a nossa vida, já que agora não precisa ficar marcando a caixinha de "Expandir modelos de widget" (se vocês notarem, tem um botão escrito "Reverter modelos de widget para o normal" lá em cima, então tudo o que você tem que fazer é não clicar nesse botão). Não mudou nada dos seus códigos e/ou da produção do layout, ok? Quem é da época do editor antigo não deve ter estranhado tanto (eu o/).
 Enfim, depois disso clique na caixinha onde está o html do seu blog e tecle ctrl+F, então procure pelo seguinte código:

/* Mobile

 E cole o código abaixo antes de "body. mobile":

.sidebar .widget h2{ background: url(LINK DA SUA FAIXINHA) no-repeat left;margin-top:-2px;margin-left:-19px;margin-bottom:0px;padding:15px;width: 300px;height: 100px;overflow:hidden;}

 Aí você só precisa alterar o que é necessário. Além do mais óbvio (do link da sua faixinha), você também tem/pode mudar "margin-top", "margin-left" e "margin-bottom" pra ajustar a imagem na sidebar e ficar certinho, e não se esqueça de mudar "widht" e "height" do código pela largura e altura da sua faixinha, respectivamente. E como sou ótima pessoa (-n) fiz alguns modelinhos pra vocês, só 4, mas vocês conseguem encontrar mais aqui. Caso usem, creditem, ok?

 Espero que tenham gostado! Ah, e claro que esse tutorial lindo só podia ter vindo do Kawaii World, né? Só recomendo que vocês não copiem as fitinhas dos outros, quando a gente faz algo só nosso é bem mais legal, né? ;)

Links que pulam

adoro essa foto (não a montagem que eu sei que ficou simples)

 Bom dia gente! Aqui mais um tutorial que me pediram há muito tempo, mas que eu quis esperar pra postar pra que não copiassem de uma vez, hahaha.
 Enfim, é um efeito que faz os links "pularem", e que eu uso lá no Dreams Labyrinth (blog de encomendas, agora fechadas). Não sabe como é?

link antes de passar 

link depois de passar o mouse

Efeito desfoque nas imagens

queria um desses "filtros" dos sonhos

 Bom dia gente! Hoje é domingo, dia de tutorial! E trouxe um bem fácil e legal pra ser usado nas imagens do seu blog (caso queira, é claro né). Ele faz com que a sua imagem se "desfoque" quando você passa o mouse sobre a imagem. Não sabe como é? Assim:

antes de passar o mouse - com o mouse em cima da imagem

 É bem fácil de se colocar no blog! Vamos lá? Vá no seu blog e em Modelo, então clique em Editar HTML e marque a caixinha de "Expandir modelos de widget". Então tecle Ctrl+F e procure por:

]]></b:skin>

 Então cole acima do código encontrado o seguinte código:

.dressbreaker {
-webkit-transition: all .1s linear;
-moz-transition: all .1s linear;
transition: all .1s linear}
.dressbreaker:hover {
-webkit-filter: blur(1px);z-index: -99px;}

 Eu dei pro efeito o nome de "dressbreaker", era uma coisa do anime que eu estava assistindo na época que fiz ele (quando ainda estava fazendo esse layout, ashuashahsu). Então vá em Layout e clique em Adicionar Gadget> HTML/Javascript e adicione lá o seguinte código:

<a href="LINK"><img class="dressbreaker" src="URL DA IMAGEM" /></a>

 Use o código acima caso queira que a sua imagem leve para algum link (tipo a dos afiliados daqui do blog, no gadget de Gatinhos). Caso não queira com link, use o seguinte código:

<img class="dressbreaker" src="URL DA IMAGEM" />

  Aí é só trocar "URL DA IMAGEM" por, obviamente, a url da sua imagem. Também dá pra utilizar isso nas imagens dos posts, ok? Só colocar o código na parte de "HTML" (do lado de Escrever, bem na esquerda da barra do menu onde você edita o seu post).
 Prontinho, tutorial feito!

 Espero que tenham gostado, e que usem (viu dona Mille? o3o)! E não se esqueçam de me pedir posts via comentários ou asks!

Como fazer blend (PSCS5)

alpacas <3

 Enfim, trouxe esse tutorial que me pediram pela ask. E esse é um super simples, só que só dá pra quem tem  Photoshop, ok? Acho que não dá pra fazer por Photoscape e eu não sei fazer por Inkscape :/
 Pra fazer o tutorial você vai precisar de Photoshop, duas ou mais fotos de quem você quer fazer o blend e de paciência (inspiração também ajuda).
 Vamos lá?

qualidade enorrrme da imagem, hue

 Clique em File> New e deixe no tamanho que quiser, nesse blend eu usei 640x600. Depois abra as suas duas imagens. É de preferência que elas tenham um fundo parecido, se não você vai ter que deixá-las em preto e branco pra que os fundos "se juntem". Ajuste a primeira no seu fundo.

  Depois coloque a 2º imagem em cima da primeira, e posicione como vai querer deixar depois.

 Abra a borracha (no menu do lado esquerdo) e deixe-a grande, com um tamanho de, mais ou menos, 150/200px. Diminua a hardness dela para 59% e começe a apagar o fundo da imagem 2. É só ir clicando e "arrastando" onde quer apagar.

 Tem que ficar mais ou menos assim.

 Essa parte é opcional, só pra quem quer escrever algo no blend, ok? Então, selecione a ferramenta de fazer formas geométricas e faça um retângulo branco na sua imagem, onde vai escrever o que quiser. Abra a aba com as camadas da imagem e diminua a opacidade do retângulo para 30%, ou o valor que mais te agradar.

 Eu sempre gosto de fazer outro retângulo sobre o primeiro, assim, na minha opinião, dá um efeito mais legal, ashuahuas. E depois disso só falta escrever o que quer na imagem e colocar algum style pra que fique bonita.

 Tarãam, esse foi o meu resultado! Você vai ter um parecido com esse se fizer o tutorial certinho.

 Espero que tenham gostado! Eu adoro fazer blends, dá pra usar pra muitas coisas, desde cabeçalhos, passando por capas pra fazebook e chegando em link-mes e backgrounds. Ah, e podem usar o blend que eu fiz, só precisa creditar, ok?

Como usar Font Face

Créditos: ♥

escrever errado na montagem é comigo, hahaha

 Bom dia minhas lindas! Primeiramente quero pedir milhares de desculpas á todas que tem comentado por esses dias! Tenho estado super sem tempo, cheia de provas, trabalhos e um simulado na terça e não tive tempo pra quase nada! Já estou explorando a Laura (desculpa e obrigada, Laurinha!) pedindo pra que ela responda meus comments.
 Mas enfim, começando a falar do post, hoje é um que com certeza vai ajudar muita gente! Quando vi esse post lá no blog da Camila shorei arco-íris, já que ela foi a primeira que me fez entender o que era font face e como que se instala! Muito obrigada, viu?
 E por isso vim aqui ensinar vocês hoje! Primeiro vamos entender o que é font face: lembram que eu já ensinei aqui, há um bom tempo, como que se instalam fontes diferentes (do google) no blog? Pois então, agora vim ensinar a colocar não só as fontes do google, mas qualquer fonte! Isso mesmo, QUALQUER! Diga-me se não é uma alegria!
 E pra fazer isso é super simples. Primeiro você escolhe a sua fonte (veja se ela aceita letras maiúsculas e minúsculas, acentos, pontuação, acentuação e etc.) e então tem que hospedar ela. Eu hospedo as minhas no File Den, onde é super simples!
 Primeiro você entra lá e faz uma conta, depois vai em "Upload" e clica no seguinte botão:

 E ali escolhe o arquivo da sua fonte (no formato .ttf ou .otf). Depois, vai aparecer algo mais ou menos assim:

 "A Sweet Melody My Lady" é o nome do arquivo da minha fonte, no lugar vai aparecer o da sua. Guarde bem esse nome porque vamos precisar! Depois, clique em Upload Files e espere que abra uma nova aba assim:

 Copie somente o link da sua fonte (como dá pra ver na imagem). Agora abra o seu HTML e procure por:

]]></b:skin>

 Em cima do código encontrado, cole o seguinte código:

@font-face { font-family: NOME DO ARQUIVO DA SUA FONTE; src: url('LINK DA SUA FONTE'); }

 Edite o que pede e depois é só colar o "Nome do arquivo da sua fonte" onde você quiser que ele apareça, do seguinte modo:

font: normal 20px "Nome do arquivo da sua fonte", cursive;

 Alterar e salvar! Você pode colar em:

h3.post-title a {     ------> títulos dos postsh2 {    ------> títulos dos gadgets 

 Enfim, espero que tenham gostado! E caso usem o tutorial, não se esqueçam de creditar, ok? Ah, e me digam quais posts vocês querem por comentário, que estou em dúvida! ;)

Dois backgrounds no blog

Créditos: ♥ - OBS.: Gente, visitem o blog novo (e lindo) da Kelly, o Like Critics, que fala sobre livros, filmes e jogos :3

ursinhos *u*

 E finalmente trago esse tutorial tão pedido! O de colocar dois backgrounds no blog, também conhecido como cabeçalho com a mesma largura do blog.
 O tutorial é super simples, e dá pra usar dos dois modos, mudando os tamanhos. Esse tutorial eu uso muito em layouts, fica super lindo e dá um toque muito mais especial neles! :D
 Pra quem não sabe como é, aqui o print:

o fundo floral é o primeiro background (com o cabeçalho) e depois vem o back de madeira

Personalizando Códigos Simples #2

se eu já usei essa imagem antes ignorem, hahaha ><

  Bom dia gente, tudo bem com vocês? Eu não estou tão bem, mas não vamos falar disso, né? Não quero deixar vocês tristes também.
 Hoje trouxe a segunda parte desse post, dessa vez falando sobre as áreas personalizáveis do seu código (ex.: área na qual se personaliza sidebar, área de posts e etc.), o que é bem simples. Vamos lá?

Colocando blockquote hover

até agora não entendi o porquê de eu ter usado a foto de um sapato

 Yey, tutorial! E o de hoje é super fácil. Não sei se a maioria das leitoras notou, mas no layout atual quando você passa o mouse em cima da blockquote a cor da borda e da fonte dela mudam. Não notou? Note agora!

Passe o mouse aqui, gatinha :3

 E hoje vim ensinar vocês a como fazer isso! É bem fácil, vamos lá?

Personalizando Códigos Simples

Oi gente! Se alguma de vocês curte WWE, que tal curtir a página da minha amiga, My Princess AJ Lee? Eu participo de lá como designer, mas ficaria super feliz se tivessem mais curtidas! ^^ Fomos hackeadas recentemente e perdemos a maioria, então, se puderem, ajudem! :3

o que que comida tem a ver com o post? ô produção!

 Depois de duas meninas me pedirem esse post (e de uma delas me lembrar dele todos os dias, rs) finalmente trouxe aqui pro blog.
 Com o término das duas tags antigas (Profissa no Ps e Manual da Blogueira), tinha que criar mais uma, né? hahaha. Mas ainda vou pensar em outras, não se preocupem. Bem, nessa série a minha intenção seria dar algumas dicas de como personalizar códigos, e, talvez, de como criar um menu (isso depois de vocês já souberem o suficiente).
 Hoje vou falar de alguns termos que são necessários para fazer edições, e que são super simples de se decorar. Ah, e obs.: se você já tiver um conhecimento de inglês, ajuda moooointo.

Como colocar LinkWithin

Créditos: ♥ - Participe do sorteio de aniversário do blog!

 

 Hoje trago mais um dos tutoriais pedidos por leitoras. Dessa vez sobre o nosso tão querido LinkWithin, que é, na verdade, esse gadget de "Posts relacionados" ("Outros Posts:" aqui no blog).

 Ele foi pedido por uma leitora anônimo (adoro vocês, anônimos educados <3). Colocar é super simples, fácil e rapidinho, só editar que leva um tempinho a mais (editando o código).
 Ah, e pra quem ainda não sabe do que eu estou falando, é disso aqui:

 Vocês sabem onde clicar u.u

Como personalizar imagens

montagem diferente das outras que faço u.u

 Outro post pedido por leitoras, dessa vez uma pediu pra que eu ensinasse a editar e outra pra que eu disponibilizasse esses "brushes" (que na verdade são shapes ^^) que uso nas imagens do blog.
 Fiz o tutorial no Photoshop e no Photoscape, pra que todo mundo possa entender e fazer, caso goste do resultado. Mas enfim, vamos lá?

Como criar enquete

sapatos <3

 Hoje venho com mais um post pedido, e dessa vez um super fácil! Desde a minha primeira enquete (ano passado, sdds 2012) algumas pessoas começaram a me perguntar como fazer, e aí hoje vim trazer pra vocês.
 Eu uso esse site aqui pra fazer as minhas, claro que tem outras, mas esse foi o primeiro que achei (preguiça de procurar outros, hahaha).
 Enfim, acessem o site e vamos ao tutorial!

Profissa no Ps #4- Fazendo cabeçalho

Oi gente! Visitem o blog da Brunna, minha amiga que eu conheci no flickr! Ele ainda é novo, mas já tem vários posts super legais! Enfim, é esse blog aqui!

tenho cabelo pintado, me enveje, yo

 Hoje trago o último post da série que eu pensei em fazer (caso você queira mais algum, me avise por ask ou comentário :3), e um dos mais importantes.
 Primeiramente quero avisar que o meu Photoshop é diferente da maioria, deve ter sido algum erro na hora de instalar, mas ele não aceita gifs, e pra fazer cabeçalhos é um pouco diferente, mas de um modo que funciona em todos os Ps's.
 Enfim, o tutorial tá simples e no final eu disponibilizo o cabeçalho que fiz de exemplo como free, então, se usar ele, credite, por favor! ^3^

Data personalizada

sorveeeeeteeeeeeee ♥

 Buenos dias, muchachas! Sim, isso é espanhol, mesmo que eu não saiba falar mais nada, hahaha ><

 Hoje eu trouxe mais um dos tutoriais pedidos na ask, e dessa vez é um que eu mesma fiz. Então, como sempre, se você usar não pode esquecer de dar os créditos, ok? 

 É super simples de se fazer e o resultado é mega fofo! Ele é o modelinho que uso em todas as minhas encomendas e até aqui no blog. Se você estiver lendo esse post no futuro, aqui tem uma preview de como ele fica/ficou no meu blog de encomendas:

lalala, não sei de nada que possa colocar aqui

Profissa no Ps #3- Actions

Outros posts dessa série aqui. Ah, e visitem o blog da minha amiga Letícia, o Conectadas! Ela é nova na blogosfera mas já adora esse nosso pequeno universo :3

confesso, amei essa montagem *3*

 Bom dia blogueiras! Como vai a vida de vocês? Espero que bem.
 Como vocês já devem ter notado, hoje eu trouxe mais uma edição do Profissa no Ps. Dessa vez falando sobre as actions, que, por mais que eu não use muito, são ótimas pra editar fotos e colocar efeitos lindinhos.
 Eu não vou ensinar como fazer eles, porque isso eu não sei, mas vou ensinar a instalar (muito simples) usar e arrumar. E isso já basta, pelo menos pra mim, hahaha ><
 Vamos lá?

Como personalizar o título dos posts

montagens, quem não ama?

 Hoje é dia de tutorial! ~todas rebola~
 E hoje eu trouxe um que foi pedido pelas leitoras lá na ask do blog. Esse foi o de, como já devem ter notado, personalizar o título dos posts, o que é super simples!
 Trouxe as partes que são mais básicas mesmo, de colocar fundo no título dos posts, alinhar ele, colocar borda e etc. Ah, e eu acho que o pedido foi inspirado no título dos posts aqui do blog, que, pra quem ainda não viu/notou (o que é difícil) aqui tem print:

 Mas enfim, vamos ao post?