Estilos de Via
Preparei alguns tipos de Via bastante úteis e inovadores, espero que gostem.
Antes de mais nada, colem o código a seguir antes de </head>
<link href="//dl.dropbox.com/s/50g6fbds3rh4m0j/saturnicons.css" rel="stylesheet"> 01.
Cole o seguinte código antes de </style>
/** Via Style by @reptilha in @passo-html**/reb{ Cole o código a seguir após a abertura da div da sua caixinha de post:
{block:RebloggedFrom}
02.
Cole o seguinte código antes de </style>
/** Via Style by @reptilha in @passo-html**/reb{ Cole o código a seguir após a abertura da div da sua caixinha de post:
{block:RebloggedFrom} 03.
Cole o seguinte código antes de </style>
/** Via Style by @reptilha in @passo-html**/reb{ Cole o código a seguir após a abertura da div da sua caixinha de post:
{block:RebloggedFrom} OBS: Se não funcionar, tentem colocar o código dentro de cada Block Post.
Gabriela @reptilha
Estilo de notes Visualize: (xx)
Cole isso antes de </style> :
/*Feito por @clamam disponível em @passo-html insp: instagram & rhaegara. NUNCA remova os meus créditos e dê like no post se usar.*/ Cole isso depois de <div class=“posts”> :
{block:IndexPage} Cole isso antes de </head> :
<link rel="stylesheet" type="text/css" href="https://dl.dropboxusercontent.com/s/33sakshawgsp033/UNIICONS-ADJ.css?dl=0"> Se usar dê like nessa postagem e NÃO REMOVA OS CRÉDITOS! /Gabi
Pergunta feita por Anônimo
ensina a fazer um estilo de post parecido com esse static. tumblr. com/nlv0t0q/c2Sol70e8/post. png? obrigada, o estilo é do enchantedthemes
Cole isso no seu CSS (antes de </style> ):
/*Estilo de notes by @clamam inspirado em @enchantedthemes disponível em @passo-html. Não remova os créditos!!!*/ Cole isso depois de {block:Posts} :
{block:IndexPage} Se usar dê like e não remova os créditos! /Gabi
Pergunta feita por Anônimo
o degradê dos posts dos themes, por exemplo da overtrip... a mudança de cor da img do post no hover, que não fica totalmente preto ou branco, fica um degradê... tem como ensinar fazer amor?
Tem meu anjo! Eu fazia muito isso nos meus themes, hehe
Veja online
Coloque isso no seu CSS (antes de </style> ):
/** Criado por @clamam disponível em @passo-html. Por favor, não remova os créditos ***/ Coloque isso no seu HTML (na sua {Block:Photo} ):
<div class="ph-notes">
<div id="ph-permalink"><a href="{ReblogURL}" target="_blank">Reblog</a></div>
<div id="ph-reblog"><a href="{Permalink}" title="{notecountwithlabel}" target="_blank">{timeago}</a></div>
</div> Se usar de like e não remova os créditos belê?! Beijão! /Gabi
Pergunta feita por Anônimo
sobre o estilo de notes, eu gostaria de um estilo minimalist, tipo esses ultimos que vocês postaram, mas eu queria c/ o like i-frame, o coração que aperta e da like na hora, entende?
Vou postar um estilo meu de notes.
Preview: Online
Primeiro cole isso antes de </head> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css"> /******* POR ARCAICAS.TUMBLR.COM ENCONTRADO EM PASSO-HTML.TUMBLR.COM ********/
#babys {text-align:right;padding:10px; margin-left:-2px; border:1px solid #eee; border-radius:5%; background:#fafafa;}
#babys a {display:inline-block;margin:0px 4px;letter-spacing:1px;font-style:normal;}
.custom-like-button *{cursor:pointer!important;}
.custom-like-button {position:relative;display:inline-block;vertical-align:top;width:10px;color:#aaa;margin-top:2px;height:10px;cursor:pointer;}
.like_button:hover + .our_button {color:red;}
.like_button.liked + .our_button {color:red;}
.like_button iframe {width:100%!important;height:100%!important;}
.like_button {z-index:10;opacity:0;}
.our_button {z-index:1;}
.our_button,.like_button {position:absolute;top:0;left:0;width:100%;height:100%;} E por fim, isso depois de você ter colocado todos os blocks dos posts: {block:indexpage}
<div id="babys">
<a href="{Permalink}">{NoteCountWithLabel}</a>
<a href="{ReblogURL}" target="_blank">reblog</a>
<div class="custom-like-button" style="float:right;margin-right:0px;margin-left:10px" >{LikeButton}<span class="our_button"><i class="fa fa-heart" aria-hidden="true"></i>
</span>
</div>
</div>
{/block:indexpage} SE USAR DÊ LIKE! E JAMAIS RETIRE MEUS CRÉDITOS!
Por: Dai.
Estilo de notes minimal #02 Se quiserem uma preview desse estilo de notes, é o mesmo desse theme meu. (clica)
1° Primeiro colem esse código antes de </style>
Coisas que vocês talvez terão de mudar:
top:-15px; - no #dai-arcaicas a coloque um número que fique certinho. cor da borda no #dai-arcaicas. e a cor do background no #dai-arcaicas a. 2° Segundo cole isso depois da div de custome dos seus posts :
Se usarem dê like ou avise, por favor!@arcaicas
Estilo Notes minimal.
Por: Dai, @arcaicas .
Veja Online / View On: Clica.
1° Cole isso antes de </head>
2° Cole isso antes de </style>
@arcaicas disponível em @passo-html --*/3° Por fim, cole isso depois de ter colocado todos blocks dos posts.
Se usarem dê like ou avise. / If using like or tell me.
Pergunta feita por rosatus-deactivated20200614
Olá! Tem cm fazer esses notes de textos não se "moverem" ? Não sei se entendeu.
Se você estiver falando sobre os notes do textos é só procurar por “
.post .dmbase” e “
.post:hover .dmbase”.
No .post .dmbase vai ter um
margin-left:330px;
E no .post:hover .dmbase o margin-left:; vai estar em margin-left:350px;
Então você vai deixar o margin-left do .post .dmbase em 350px.
assim:
.post:hover .dmbase { (…); margin-left:350px; }
se quiser que eles já fiquem aparecendo antes de passar o mouse sobre o texto é só acrescentar um opacity:1 dentro dessa mesma div.
Entendeu? /Dai
Estilo de notes
Visualize: (xx)
Coloque isso aqui no seu css (antes de </style> ):
/*Disponível em passo-html por Gabi (clamam). Não remova os créditos.*/
#ph-perma{opacity:0; position:absolute; text-align:center; height:20px; line-height:20px; left:0px; bottom:10px; z-index:99; background:#fff; width:400px; -webkit-transition: all 1s linear; -moz-transition: all 1s linear; -ms-transition: all 1s linear; -o-transition: all 1s linear; transition: all 1s linear;}
#ph-perma a{color:#666666; font-family:calibri; text-transform:uppercase; font-size:10px; padding:5px; letter-spacing:1px;}
.posts:hover #ph-perma{opacity:1; bottom:23px;}
Coloque isso aqui depois de <div class=“posts”> (div das postagens. Pode tá como post ou posts, depende do designer.)
<div id=“ph-perma”>
<a href=“{Permalink}”>com {NoteCount} notificações</a>
<font color=“#ADD8E6
”>•</font>
<a href=“{ReblogURL}”>compartilhe</a>
</div>
Reponha as aspas e não remova os créditos. /Gabi
Estilo Notes #03
[ VISUALIZE ]
1° Passo: Cole esse código antes de </style> (CSS)
2° Passo: Cole esse código <body> , em alguns themes está <div id=“posts”> em outros <div class=“entry”>, ou apenas cole ele no Block do post que você quer.
Dê Like ou Avise se usar, obg. /Dai
Estilo de post header (notes)
Então gente, hoje trouxe o estilo de post header (notes) do meu theme sorrow , que foi muito pedido a um tempinho atrás.
Visualize: (xx)
Cole isso antes de </head>
<link rel=“stylesheet” type=“text/css” href=“http://goo.gl/F6c7pZ”>
Cole isso no seu css (antes de </style> )
/*Post header por Gabriele (clamam.tumblr.com), dísponível em passo-html (passo-html.tumblr.com). Jamais retire os créditos!!!*/
Cole isso após <div class=“posts”>
{block:IndexPage}
Se gostar ou usar dê like e jamais retire os créditos! /Gabi.
