Layout

- 23.6.17

Projeto Quarto Perfeito #1 - Os primeiros passos

Oi gente ♥ Há uns dias eu comecei um projeto no youtube com o nome Quarto Perfeito. Bom, eu sempre morei em casas de aluguel, e sempre tinha aquela coisa de não querer decorar porque logo iríamos nos mudar de novo. Ano passado, finalmente, meus pais conseguiram a casa própria e  só depois de um ano morando aqui conseguímos colocar piso no apartamento.  Atualmente eu trabalho em casa (fazendo layouts para blogs) e passo muito tempo no meu quarto, então preciso de um cantinho que seja confortável e aconchegante.

No primeiro vídeo do projeto, mostrei como minha casa estava antes, e mostrei algumas coisinhas do nosso "depois" por enquanto, olha só:




O que mais me incomodava, além de não ter um piso, era não ter um guarda roupa. Minhas coisas ficaram durante um longo ano dentro de caixas. Quando fui escolher para comprar, decidi que queria um que fosse grande, com portas de correr, e que tivesse um espelhão dos sonhos na porta kkkkk. Optei por um preto e branco - e quero que todos os móveis do meu quarto sejam assim, para a ênfase de cores ficar por conta da decoração.

Outra coisa que eu precisava muuuuito era de uma mesa para o computador. Eu usava ele numa cômoda, que era alta, desconfortável e totalmente inapropriada kkkk. E como eu passo o dia inteiro usando ele, foi algo de extrema importância. Há muito tempo eu sonho com uma mesa de cavaletes, eu já falei isso várias vezes no canal e aqui no blog. Aquela mesa linda que sempre aparece nos home offices do pinterest.

A minha chegou há dois dias, e eu pulei muito de felicidade. Eu não conseguia acreditar que tava mesmo acontecendo, até eu ver ela montadinha aqui no meu quarto. Eu amo cada detalhe dela e não poderia ter feito escolha melhor ♥



 Eu comprei ela no Magazine Luiza por R$120,00.





A gente sabe que investir em móveis e decoração pode ser meio complicado, mas uma boa dica é usar cupons de descontos pra ajudar a aliviar no preço! O site Cupom Válido tem cupons ótimos para várias marcas, vale super a pena conferir o site deles ♥ 

O próximo passo para o meu quarto é pintar as paredes (que estão bem sujas, principalmente depois de colocar o piso). A minha ideia é pintar de cinza, e na parede que fica o home office, fazer alguma coisa com cinza e branco.

Falando sobre móveis, só falta reformar a minha cama, e comprar uma cadeira pra mesa do computador, porque no momento, eu uso uma de cozinha mesmo kkkkk.

Agora sobre a decoração, ideias não me faltam, eu já planejei cada detalhe. Eu não posso comprar tudo de uma vez porque não tenho dinheiro pra isso, então vou comprando e fazendo aos pouquinhos, e compartilhando tudo com vocês, é claro ♥

Uma publicação compartilhada por L A R I Z (@butlariz) em

Se você ainda não conhece o canal, lá vão rolar vários vídeos sobre decoração. E no instagram, com certeza não vão faltar fotos das minhas coisinhas. Vou me despedir por aqui, se não o post fica gigantesco, eu poderia ficar falando sobre decoração por horas e horas, amo muito! Espero que tenham gostado do post e de saber um pouco mais sobre o meu cantinho! 

Com amor,

Lariz
- 20.6.17

6 meses de cabelo cacheado ♥

Foto de cabelo cacheado curto depois do big chop

Já tem um pouco mais de 6 meses que eu estou com meu cabelo cacheado. Da pra acreditar? Depois de 5 anos fazendo progressiva, alisando o cabelo, vivendo dia a dia com a chapinha, e depois de longos meses me dedicando a cuidar do meu cabelo, de ter paciência pra esperar ele crescer, e ficar naquela ansiedade enoooorme pro tão sonhado big chop, aqui estou eu! Amando cada dia mais esse cabelinho lindo.

E pra comemorar, eu resolvi fazer esse post reunindo todos os cuidados que eu tenho com o meu cabelo, tudo o que eu aprendi sobre ele, e como eu tenho me sentido ♥

Cuidados com o meu cabelo


• Fitagem é tudo - Não importa qual shampoo, condicionador, máscara, creme eu use, meu cabelo só fica bonito se eu fizer a famosa fitagem. Eu tenho meu jeito de fazer ela, dividindo em mechas, e o mais importante no meu caso, amassando muuuito o cabelo.

• Cronograma capilar minimalista - Sim, eu acabei de inventar isso kkkkkk, mas é verdade. Eu lavo o meu cabelo com shampoo e condicionador a cada 2/3 dias. E passo alguma máscara capilar a cada 15 dias. É o suficiente pro meu cabelo ficar lindo, hidratado, saudável e do jeitinho que eu gosto.

• Produtos preferidos - Eu escolho Cachos Volumosos da Origem, não tem creme melhor pra finalizar o meu cabelo. Ele é leve, não deixa os cachos duros ou com aspecto úmido, deixa meus cachos soltos e definidos, ah e é anti frizz. O outro produto é o Desmaia Fios da Eico, o nome é meio contraditório nesse caso kkkkk, mas é que ele acaba com o frizz do cabelo. Tirando que ele se deu super bem com os meus cachinhos e é o produto que mais define ele, tanto que nenhum outro produto faz o meu cabelo encolher tanto quanto esse faz. E eu adoro isso.

Foto com o creme nazca eu escolho cachos volumosos e desmaia fios da eico


• Eu não me mato - É isso aí, não me mato pra ter o cabelo perfeito, não uso um milhão de produtos, não sigo todas as dicas desesperadamente, e deixo ele crescer no tempo certo. Não to criticando quem faz essas coisas, mas pro > meu < cabelo, a melhor forma de cuidar dele é usar os produtos que deixam ele saudável e bonito, e pra mim isso basta.

E eu tenho falado muito sobre os meus cuidados em vídeo, lá no canal. Caso você ainda não conheça, ou não tenha visto, vou deixar a minha playlist sobre cachos aqui: 



• Acho que o maior cuidado que eu tenho com o meu cabelo, é não sentir raiva ou frustração se ele não fica exatamente como eu queria. Ele faz parte de mim, e assim como eu tenho dias ruins, meu cabelo tem os dias ruins dele.

Aprendizados e sentimentos


foto de cabelo cacheado curto pós o big chop


• Meu cabelo tem frizz. Eu sofria muito com isso quando eu era mais nova e resolvi alisar. Eu odiava isso quando ele era liso. E hoje, eu apenas aceito. Uso sim alguns produtos que ajudam a dar uma amenizada, mas se eu acordo e meu cabelo está cheio de frizz, mesmo depois de lavar ou revitalizar ele, eu simplesmente não me importo.

• Por mais que eu acompanhe várias youtubers, procure por várias dicas, e tenha milhares de receitas e truques a serem seguidos, o importante é fazer no meu cabelo aquilo que é bom pra ele, o que ele gosta. Seja bonzinho com seus cachos, eles serão bonzinhos com você de volta kkkk.

• Me desapeguei totalmente do que é ser um cabelo perfeito. Se meu cabelo não ta amassado, e não tem muitas mechas com aquele efeito espichado, então pra mim ele já ta maravilhoso. Nem sempre com o volume dos sonhos, nem sempre com a definição das propagandas, mas ele é desse jeito, e estando natural pra mim ta ótimo!

• Tem gente que não gosta, que me olha estranho, já teve até quem dissesse "Deus me livre ter um cabelo assim", mas como diz aquela música da Avril Lavigne: "If you love me if you hate me / you can't save me baby baby" ... na verdade não é essa parte da música exatamente, é a parte que diz "Que se foda"

Uma publicação compartilhada por L A R I Z (@butlariz) em

• Eu me sinto eu mesma. Antes de eu alisar, eu odiava o meu cabelo, eu chorava por ele ser feio, quando tinham nós eu puxava de raiva, mesmo que isso quebrasse ele todo. Eu sentia um ódio muito grande, por eu ter o cabelo assim, por eu me sentir feia, por eu ser quem eu era. É lógico que isso mudou muito durante a minha adolescência, e mesmo com o  cabelo liso eu gostava muito de mim. Mas agora, é um sentimento incrível poder me sentir dessa forma, me sentir tão linda com o meu cabelo natural, coisa que anos atrás me parecia impossível.

• Por mais que seja clichê: É uma transformação que vem de dentro. Não importa quantas pessoas me falaram que meu cabelo natural era bonito, que eu fico bonita de cabelo cacheado, que combina comigo, ou que eu fosse acabar assumindo meus cachos um dia, eu só realmente pude voltar ao cabelo natural e me sentir bem com isso, quando a vontade veio de mim. Quando eu percebi que ter o cabelo como agora, faria muito melhor pra mim.

• Autoestima tem muito mais haver comigo do que com meu cabelo. Afinal, mesmo durante a transição em que eu tinha que viver com ele preso, eu me sentia incrível.

- ♥ - 

Eu gosto muito de falar sobre esse assunto lá no canal Butlariz, então não deixe de se inscrever! Também sempre to pelo instagram, postando fotos, compartilhando coisas legais por lá: @butlariz. 

Espero que tenham gostado desse post, foi feito totalmente com o coração kkkk. E espero de verdade que eu possa ajudar e inspirar vocês de alguma forma. Se tiverem alguma dúvida, curiosidade, ou sugestão haver com transição capilar, cabelos cacheados, cuidados com o cabelo no geral, deixa nos comentários ♥ 

Com amor,
Lariz
- 9.6.17

Como fazer Menu Dropdown (Com Subcategorias) responsivo - Blogger

Aprenda a fazer menu de subcategorias no blogger! Menu dropdown


Uma das coisas essênciais em um blog é a fácil navegação do seu leitor. Ter um menu com subcategorias vai deixar seus links bem organizados, facilitar na procura de determinado assunto, economizar muito espaço no seu menu, e ainda deixar seu layout bem bonito e mais profissional! Ah, o menu é responsivo, porque vale lembrar que o que fica bonito no computador, também é importante ficar bonito no celular!

⚠ Importante! Fiz esse código para o tema SIMPLES do blogger, que na minha opinião é o melhor tema para se trabalhar do próprio blogger. Maaaas ele também funciona lindamente no meu tema base responsivo ♥  Se você não usa nenhum desses dois temas, não garanto que vai dar certo, mas fique a vontade para tentar. 


Nesse tutorial vou dar o código pronto, e explicar onde mudar para os seus links, mudar o nome que aparece, e mudar as cores para combinar com o seu layout. Ah, caso você ainda não entenda sobre os Marcadores do Blog, apenas leia esse post!

Antes de começar, eu aconselho você a salvar o seu layout em algum lugar, para caso algo dê errado. Vale também, testar num blog de testes antes de testar no seu blog principal.

1. No painel do blogger, vá em Layout. Clique em Adicionar Gadget e selecione o HTML/Javascript. Como na imagem:

Aprenda a fazer menu de subcategorias no blogger! Menu dropdown


Depois cole o seguinte código:

<div id='nav'>
<ul>
<li><a href='/'>Início</a></li>
<li><a href='/p/sobre.html'>Sobre</a></li>
<li><a href='#'> Categorias  </a>
<br />
<ul class="menus">
<li> <a href="/search/label/Categoria 1"> Categoria 1 </a></li>
<li><a href="/search/label/Categoria 2">  Categoria 2  </a></li>
<li><a href="/search/label/Categoria 3">  Categoria 3  </a></li>
<li><a href="/search/label/Categoria 4">  Categoria 4  </a></li>
</ul>
</li>
<li><a href='/search/label/Moda'>Moda</a></li>

</ul>
</div>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<script type="text/javascript">
$("#nav").addClass("js").before('<div id="menu"><img src="http://i.imgur.com/wvad5ud.png"/></div>');
$("#menu").click(function(){
$("#nav").toggle();
});
$(window).resize(function(){
if(window.innerWidth > 768) {
$("#nav").removeAttr("style");
}
});
</script>

Agora salve.

2. Agora vá em Modelo, e clique em Editar Html como na imagem:

Aprenda a fazer menu de subcategorias no blogger! Menu dropdown

Depois clique na área do código, e aperte ctrl+f no seu teclado para abrir a caixa de busca. E procure por:

.tabs-inner .section:first-child {

Dependendo do seu layout, pode ser que não tenha essa parte, então se você não achar nada ao procurar, pode pular para o passo 3. Mas se aparecer algum código (como na imagem mais abaixo), continue aqui.

Vão aparecer vários códigos que você vai ter que apagar para o menu funcionar. Apague desde /* Tabs até a linha a cima de */ Columns . Veja bem a imagem abaixo antes de fazer:

Aprenda a fazer menu de subcategorias no blogger! Menu dropdown
Clique na imagem para ver maior
3. Depois de apagar, aperte ctrl+f novamente, e procure por:

]]></b:skin>

Acima dessa tag → ]]><b:skin /> ← cole o seguinte código:

/*---------------- Menu Dropdown - por butlariz.com ---------------- */
#nav {
    z-index: 999;
    width: 100%;
    top: 0px;
    left: 0px;
    color: #000000;
    position: fixed;
    background-color: #fff;
    padding: 12px 0px 15px 0px;
    font-family: calibri;
    font-size: 11pt;
}
#nav a {
    transition-duration: .2s;
    color: #000000;
    padding: 10px;
    letter-spacing: 2px;
    text-transform: uppercase;
}

#nav a:hover { color: #ff6262}
#nav li {
    list-style: none;
    text-align: center!important;
    margin-left: 50px;
    position: relative;
    float: left;
}
#nav ul {
    position: relative;
    width: 1200px;
    float: none;
    padding: 0px;
    margin: auto;
    left: -17px;
    overflow: visible;
}
#nav li ul a {
    margin-left: 0px;
}

#nav ul li:hover ul.menus {
    height: 100px;}
ul.menus {
    position: absolute!important;
    padding-top: 15px!important;
    height: 0px;
    width: 150px!important;
    overflow: hidden!important;
    transition-duration: .4s;
}
ul.menus li {
    width: 133px;
    background-color: #ffe2e2;
    font-size: 11px;
    color: #000;
    padding: 10px!important;
    margin-left: 0px!important;
}

ul.menus li a {
    font-size: 10pt!important;
}


@media screen and (max-width: 900px) {
#menu {
    color: #000;
    width: 100%;
    padding: 5px;
    display: block;
    text-align: center;
    z-index: 999999;
    background-color: #fff;
    position: fixed;
    top: 0px;
    left: 0px;
}
#menu img {
    width: 50px;
    float: left;
    margin-left: 10px;
}
#nav.js {
display: none;
}

#nav {
    text-align: center;
    overflow: hidden;
    width: 100%;
    margin-top: 50px;
    color: transparent;
    font-size: 30px;
}
#nav ul {
    width: 100%;
    list-style: none;
    padding: 0;
    margin-top: 0px;
    margin-left: 20px;
}

ul.menus {
    height: 0px;
    position: relative!important;
    width: auto!important;
    padding-top: 0px!important;
}
#nav li {
    width: 100%;
    margin: 0px;
    background-color: #fff;
}

#nav li a {
    font-size: 13pt!important;
}
}

@media screen and (min-width: 900px) {
#menu {
    display: none;
    }
}

/*---------------- Fim do menu dropdown - butlariz.com ---------------- */

Deve ficar como na imagem:

Aprenda a fazer menu de subcategorias no blogger! Menu dropdown


Depois é só salvar! Confira no blog como ficou, o menu já deve funcionar corretamente.


Alterando para os seus links 


Voltando ao passo 1 desse tutorial, onde você colocou o código em um html/javascript, lembra?

Você precisa saber que:

• Uma linha simples como essa, é cada link sozinho lá no menu:

<li><a href='/search/label/Moda'>Moda</a></li>

Se você quiser colocar mais links como esse, é só copiar essa linha acima e colar antes do </ul> , como na imagem:

Aprenda a fazer menu de subcategorias no blogger! Menu dropdown

• Esse é o código com submenu (que quando você passa o mouse, aparece mais).

<li><a href='#'> Categorias  </a>

<br />

<ul class="menus">
<li> <a href="/search/label/Categoria 1"> Categoria 1 </a></li>
<li><a href="/search/label/Categoria 2">  Categoria 2  </a></li>
<li><a href="/search/label/Categoria 3">  Categoria 3  </a></li>
<li><a href="/search/label/Categoria 4">  Categoria 4  </a></li>

</ul>

</li>

Se você quiser colocar mais submenus como esse, é só copiar esse código a cima e colar antes do </ul>, como na imagem:

menu de subcategorias no blogger


• Cada linha simples como essa, dentro do submenu é uma categoria:

<li><a href="/search/label/Categoria 4">  Categoria 4  </a></li>

É ela que você vai copiar e colar, caso queira mais categorias no mesmo submenu. Se quiser menos, é essa linha que você vai apagar.

• Se você ver que não estão aparecendo todas as subcategorias, você deve alterar essa parte do código:


#nav ul li:hover ul.menus {
    height: 100px;
}

Altere o 100px; para um número maior, como 130px ou 150px e deve aparecer o resto das categorias.

• Durante o código, eu marquei alguns exemplos em cores diferentes, pra vocês saberem o que era cada link e onde trocar. É só prestar bem atenção para entender e seguir o padrão.  Então:

- Links do menu é pra onde vai quando você clica.
- Nome do link, é o nome que aparece.

/p/sobre.html (marcado em verde)  - Links do menu
Sobre (marcados em azul) - Nomes dos links que aparecem no menu
Categoria 1 (marcado em laranja) - O marcador da categoria no submenu
Categoria 1 (marcados em roxo) - O nome que aparece na categoria do submenu

Alterando as cores 


Os códigos a seguir são encontrados no passo 3.

É só substituir o código das cores que você quer nos locais indicados:

#fff - Cor de fundo do menu
#000000 - Cor do link do menu
#ff6262 - Cor do link quando passa o mouse
#ffe2e2 - Cor de fundo do submenu

Dica: Só colocar #000000 no google, que você vai conseguir pegar o código de qualquer cor que quiser!


- ♥ - 


Ufa! Que post grande hein? kkkk Mas espero que consigam fazer, e que tenham gostado desse tutorial, que além de trabalhoso, foi feito com muito carinho! Ah, não esqueça de conferir a página Extras do blog com várias dicas e tutoriais <3 

Gostou do post? Tem dúvidas? Teve problemas com o tutorial? Comente! 

Com amor,
Lariz
• 2015 - 2017 Feito com ♥ por Lariz Santana