Home Texto Link Link

18 abril 2013

Yo my Ladys!~Tutorial: Colocando Imagem de Fundo no Gadget Seguidores & Tutorial:Caixa de Aviso!

Postado por: | |


Yo my  princess!

Nyah Nyah, essa semana eu cortei meu cabelo *O*
Eu pareço  o Justin Bieber, mas meu irmão fala que pareço os Beatles...
Mas acho que estou parecendo mesmo um idiota!
Sabe aquela história que para começar o colegial diferente resolve mudar o visual para começar do zero?
Nãaaao funciona comigo ^^
Essa semana também fui fazer exame de sangue, eu estava calmo até escutar a primeira criança gritar, ai eu me apavorei, já dizia desde criança que essas moças eram bruxas, mas maldade minha, a moça que tirou meu sangue era muito boazinha ^^, nem doeu, foi meu pânico que foi exagerado...
Pooooois então, hoje ainda eu iria viajar, mas preferi ficar em casa, preparando esse post, minha mãe deixou mantimentos de sobrevivência que ela sempre deixa nessas horas para mim, conhecido também como congelados, ou como propaganda "meu menu"...
-Sim sou bom em esquentar...
-Não, não sei cozinhar...
Meu irmão diz que sou o mestre dos congelados, não sei cozinhar só como congelados nessas horas °3°
Pois então...

Vamos ao Tutorial?
Em primeiro trago para vocês um tutorial bem legal °3°



Colocando Imagem de Fundo no Gadget Seguidores

Esse tutorial é lá do blog Meu mundo, Meu estilo!

Ficará assim:

Lá no Campos o meu ficou assim:

> Você pode personalizar a imagem que você botar do jeito que quiser como eu fiz, ou pode pegar uma imagem bem legal e colocar como fundo, fica como você quiser!

Vamos ao tutorial!
                                             * Vá em Modelo > Editar HTML.

                                                   *Procure por ]]></b:skin>

                                                *Cole acima de ]]></b:skin>:


#Followers1 {
font-size: 12px; /* tamanho do texto */
line-height: 12px;
background: url('URL DA IMAGEM AQUI') no-repeat center top;
}
#Followers1 .widget-content {
padding: 50px 10px 1px 1px; /* margem do texto */
margin: 0px;
margin-top: -8px; /* altura da imagem */
color: #000; /* não modifique */
}


Legal, não?
Fica diferente e como eu disse antes, pode personalizar do jeito que quiser \o/


Tutorial:Caixa de Aviso!

Eu peguei esse tutorial lá no Viciados na Net

<style type="text/css">#aviso{width:500px; /* Altura da caixa */padding:5px; 

position:absolute; z-index:5000;}.caja-aviso{border:4px double #000000; /* Cor da borda */

-webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px;

-webkit-box-shadow: 8px 8px 6px #808080; 

-moz-box-shadow: 8px 8px 6px #808080; 

box-shadow: 8px 8px 6px #808080;

background-color: #D3D3D3; /* Cor de fundo */

padding: 10px; font-family: Verdana, Geneva, sans-serif;

color: #0B173B; /* Cor do texto */

}.letrero-aviso { /* Estilos da palavra AVISO */

font-size:18pt;

font-weight:bold;

color:#B4045F;

text-shadow: 0px 0px 10px #BA55D3;

}</style>

<div id="aviso" style="left:300px;

top:100px; 

padding:0;

"><div align="right" style="margin-bottom:-30px;

"><b><a href="javascript:closeit()" ><font face="Arial" size="1">[FECHAR]</font> <img valign="middle" src="https://lh5.googleusercontent.com/-46DmTbFSiuQ/TliKe_XV0lI/AAAAAAAAGJ4/_H2c3HB4XoY/CloseIcon-small.png" style="vertical-align:middle;

"/></a></b></div>

<br/><fieldset class="caja-aviso"><legend class="letrero-aviso" align="center">AVISO</legend>...Escreva aqui sua mensagem...<br/><div align="right"><a href="http://www.facebook.com/usuario" target="blank"><img src="https://lh6.googleusercontent.com/-9TNSAdSEm2o/Tlgi_wnuKZI/AAAAAAAAGJw/6rLfLd-QfkE/facebook.png" width="26"/></a><a href="http://twitter.com/usuario" target="blank"><img src="https://lh6.googleusercontent.com/-xk9JDUThPo0/TlgjAUiI4eI/AAAAAAAAGJ0/t5QtAN0xPco/twitter.png" width="25"/></a></div></fieldset>
<script>function closeit(){document.getElementById("aviso").style.visibility = "hidden";}</script>
</div><div class="clear"/></div>




E ficará assim:


>Mas como eu gosto de modificar, vou passar para vocês o mesmo tutorial, mas só que um pouco modificado por mim como eu estou usando lá no Campos:


<div style="position: absolute;
 margin-top: -4px; left: -220px;
"><style type="text/css">#aviso{width:500px; /* Altura da caixa */
padding:5px; position:absolute; z-index:5000;}.caja-aviso{border:px double #; /* Cor da borda */
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
background-color: #F9F9F9; /* Cor de fundo */
font-family: Josefin Sans;
color: #F56991; /* Cor do texto */}.
{ /* Estilos da palavra AVISO */
font-size:18pt;
font-weight:bold;
color:#B4045F;
}</style>
<div id="aviso" style="left:300px; 
top:-100px; padding:0;
"><div align="left:-750px" style="margin-bottom:-20px;
"><b><a href="javascript:closeonlyonce()" ><font face="Arial" size="1"></font> <img valign="middle" src="http://1.bp.blogspot.com/-0IMnsHg_a6Q/UXBLqtEZuWI/AAAAAAAAC_g/UWXsybjteL4/s1600/fundo+transparente.png" style="vertical-align:middle;"/></a></b></div>
<br/><fieldset class="caja-aviso"><legend class="" align="center"></legend><img src="Url da imagem do recado" />
<br/><div align="right"></div></fieldset>
<script>function closeonlyonce(){document.getElementById("aviso").style.visibility = "hidden";
}</script>
</div><div class="clear"/></div></div>



O meu ficou assim:

Esse foi mais legal né?

Caso tiver alguma dúvida pergunte nos comentários que eu explicarei melhor do que expliquei aqui!
Achei esse o mais legal caso um visitante visitar pela primeira vez o seu blog vai se deparar com essa 
mensagem ^^


Nyah!
A nossa my Lady Hayken-chan, como disse no post anterior estará dando um tempo para se organizar!
Bem, eu entendo ela, pois as vezes ficamos todos enrolados, e fica difícil...
Estarei ansioso aguardando a volta da minha my Lady \o/
Boa sorte my Lady!

Nyah! Por enquanto vou ficando por aqui só com esses dois tutoriais °3°
Pretendo voltar com mais tutoriais ainda essa semana!
Me aguardem..
Muahahahh

2 comentários:

  1. Kawaii!
    botar imagem de fundo é muito kawaii. Deixa seu blog hiper fofo. Eu não sabia desse tuto da caixa de aviso. Adorei !
    FuwaFuwa Otome!

    ResponderExcluir
    Respostas
    1. Yooo o/
      Ne ne?
      Dá um toque diferente, como fosse personalizado \o/
      Nyahahhah, Obrigado Vivi-chan °3°
      Obrigado por comentar \o/
      Até

      Excluir

- Não aceito comentários "Seguindo, Segue de volta?" u.u
- Pedidos de Afiliação e Parceria, somente na página de "Parceria"
- Nada de palavrões e palavras inadequadas nos comentários
- Nenhum link +18 é permitido u.u
- Quer fazer pedidos? Faça pela Ask.fm
- Aceito afiliações desde que o blog tenha bom conteúdo e pouca coisa reblogada.

Emoticons para você pôr no comentário:
=((•̪●))= ๑(•ิ.•ั)๑ ٩(●̮̮̃•̃)۶ ε(●̮̮̃•̃)з ٩(×̯×)۶̿ ┌∩┐(◣_◢)┌∩┐ ⊙▂⊙ ⊙0⊙ ⊙︿⊙ ⊙ω⊙ ⊙▽⊙ ⊙﹏⊙ ⊙△⊙ ◑▽◐ ◑ω◐ ◑﹏◐ ●︿● ●ω● ●﹏● ≧▂≦ ≧︿≦ ≧ω≦ ≧﹏≦ ≧▽≦ >︿< >ω< >﹏< >▽< ≡(▔﹏▔)≡ (¯▽¯;) <(“”"O”"”)> (-__-)b (;°○° ) \( ̄︶ ̄)> <( ̄︶ ̄)/ (/≧▽≦/) \(≧3≦)/ \(≧ω≦)/ o(≧ω≦)o o(≧o≦)o ㄟ(≧◇≦)ㄏ ╮(╯▽╰)╭ ╮( ̄▽ ̄)╭ (~o ̄▽ ̄)~o ~ 。。。(~ ̄▽ ̄)~[] (╯-╰)/ ♪ ♥

Template by Roberta.