Ju's Reads
Mostrando postagens com marcador HTML. Mostrar todas as postagens
Mostrando postagens com marcador HTML. Mostrar todas as postagens

Tutorial: Postagens + Lidas


Hi honey! Se tem um cantinho do blog que eu acho super útil, tanto pra quem visita quanto pra mim mesma, é o widget de postagens mais lidas. Ele mostra, de forma automática, quais são os conteúdos que mais chamaram atenção no seu blog, e isso é ótimo pra dar visibilidade aos seus posts favoritos (ou inesperadamente populares rs). E sim, eu também uso esse widget aqui no blog! Mas confesso que, no visual padrão dele, nunca fui muito fã… aquelas listas simples, sem muita harmonia com o restante do layout, me incomodavam. Então, como boa apaixonada por detalhes e organização visual, dei uma carinha nova pra ele com CSS personalizado e hoje vou te mostrar como fazer o mesmo no seu blog! O resultado é uma lista bonitinha, bem alinhada, com bordas suaves, fontes harmônicas e um hover sutil nas imagens e nos textos. Tudo com as cores que combinam com o restante do seu layout ou seja, o widget fica ali todo funcional, mas com estilo! Veja aqui como vai ficar +++
5 comentários

Tutorial: Menu Fixo no Topo

Hi honey! Como estão? Hoje trago um tutorial rápido, prático e super delicado pra quem ama menus minimalistas e elegantes no topo do blog. Sabe aquele menu fixo, fininho, discreto, com links bem organizados e um toque cinza que combina com qualquer layout? Pois é ele mesmo que vocês vão aprender a instalar aqui! Neste passo a passo, vou mostrar como aplicar o código, ajustar os links e ainda personalizar do jeitinho que você quiser. Mas esse tutorial é diferente do que postei anteriormente, é bem básico mesmo e podem usar como base para outros menus. Vem comigo deixar seu cantinho na blogosfera ainda mais bonito!

10 comentários

Tutorial: Menu Fixo no Topo + Redes Sociais

Hi honey! Como estão? Hoje a postagem vai ser breve e direto ao assunto, eu trouxe um tutorial bem prático (e com um toque meu, claro) pra quem quer deixar o blog mais organizado e bonito visualmente: um menu fixo no topo da página, mas dessa vez com links de navegação à esquerda e ícones de redes sociais à direita. Esse tipo de menu dá uma carinha mais profissional pro blog, além de facilitar a vida de quem está navegando. E o melhor: dá pra fazer tudo sem mexer diretamente no código-fonte do template, só usando o recurso de gadgets do próprio Blogger. Bora colocar a mão na massa?
8 comentários

Tutorial: Efeito de Zoom em Qualquer Elemento

Hi honey! Como estão? Espero que estejam bem. Você já visitou um site e notou como certos elementos parecem "ganhar vida" quando você passa o mouse por cima? Esse tipo de interação, mesmo que sutil, torna a navegação mais interessante e moderna. Um dos efeitos mais usados para isso é o zoom, um leve aumento de tamanho ao passar o mouse sobre o conteúdo. Esse efeito você pode testar passando o cursor em vários elementos aqui do blog: o título da postagem, data, rodapé do blog e as imagens no geral, tem esse efeito - sou apaixonadinha por esse zoom suave - O melhor de tudo? Esse efeito pode ser colocado com apenas algumas linhas de CSS, sem precisar de JavaScript ou plugins! Neste tutorial rápido, vou te mostrar como aplicar esse efeito em qualquer elemento do seu blog, como títulos, imagens, botões, caixas de conteúdo e mais. É simples, leve e funciona em praticamente todos os navegadores modernos.
8 comentários

Tutorial: Efeito borda + opacidade + filtro em hover

12/05/2025 - 16:00 | Hi honey! Mais um dia, mais um efeito do meu acervo pra vocês! E esse aqui é daqueles que transformam uma imagem simples em um detalhe super charmoso no layout do blog. Mas antes... Como vocês estão? A semana tá voando por aqui, e confesso que tô tentando equilibrar as ideias entre café, estudos e esse vício em ficar procurando novos livros para ler na Amazon! Sábado foi um dia de faxina aqui em casa e domingo - dia das mães - fomos para um dayuse numa pousadinha bem vibes, depois eu trago fotos dela. Agora se você adora ver uma imagem ganhando vida com um simples efeito CSS, vem comigo nesse passo a passo!

2 comentários

Tutorial: Efeito opacidade e outline

05/05/2025 - 14:56 | Oi, pessoal! Espero que vocês estejam bem — e se cuidando, porque a rotina anda puxada pra todo mundo, né? Aqui as coisas continuam na correria: trabalho, projetos paralelos, uma xícara de café atrás da outra e aquele eterno desafio de organizar tempo pra tudo o que a gente gosta de fazer.

Ultimamente tenho tentado separar uns minutinhos pra mim no meio da bagunça do dia a dia... Sabe aquela leitura que você começa, para, depois tenta voltar e acaba esquecendo tudo? Pois é, sou exatamente essa pessoa no momento! 😅 Estou tentando retomar um livro que tava encostado há meses, e confesso que ler antes de dormir tem me ajudado a desconectar um pouco das telas.

Nenhum comentário

Tutorial: Efeito opacidade + borda

29/04/2025 - 14:48 | Oi gente! Faz tempo que não apareço por aqui, né? A correria do dia a dia tem sido intensa — entre trabalho, estudos e algumas metas pessoais, mal tenho conseguido parar pra respirar! Mas aos poucos as coisas estão se ajeitando, e decidi voltar com tudo pra compartilhar aquele conteúdo que ficou guardado no rascunho por tempo demais. Confesso que, mesmo com a agenda cheia, estava sentindo falta desse cantinho aqui. Escrever, organizar ideias e compartilhar aprendizados sempre foi uma forma de colocar a cabeça no lugar — e nada melhor do que voltar às raízes com HTML, que foi por onde tudo começou pra mim na web.
2 comentários
Topo