Mostrando postagens com marcador html. Mostrar todas as postagens
Mostrando postagens com marcador html. Mostrar todas as postagens

21 novembro 2012

Comentários Incorporados #2 super

18 comentários:
Olá pessoal, num post, eu ensinei a como personalizar os comentários incorporados simples, agora, é os comentários incorporados super, o mais personalizado. Então, quer aprender a fazer um super personalizado? então, clique em leia mais, e vamos nessa!

Tumblr_mdpo08whg01qe7e99o1_400_large
 Bom vamos começar o tutorial!

1- primeiro você tem que marcar a opção comentários incorporados, se não, não vai funcionar, para isso vá em: Configurações // postagens e comentários // comentários // local do comentário // incorporado // Salve e pronto! agora vamos começar!

2- seguindo na mesma página que você parou no passo acima, clique em: Modelo // Editar html // prosseguir  e procure por: #comments {  Depois que você achar ele, apague apenas até o fechamento das chaves " }". e cole esse código no lugar:

#comments {
padding: 15px;
background: url("url-da-imagem-de-fundo-dos-comentarios"); /* BACKGROUND/FUNDO DOS COMENTARIOS */
}
3- depois disso procure por: /* Comments  Quando achar, seleciono tudo abaixo dele, e cole esse no lugar dele:

/* Comments
----------------------------------------------- */
.comments .comment-block {background: #E6E8FA; /* cor do background, entenda na legenda */
border-radius: 10px; /*tamanho da borda arredondada se não quiser, apague esse código*/
border: 2px solid #000; /* bordas, tamanho, formato e cor */
}
.comments .avatar-image-container {float: left;
max-height: 36px;
overflow: hidden;
width: 36px;
border-radius: 15px; /* tamanho do arredondamento da imagem do comentarista */
border: 4px solid #000; /* bordas tamanho, formato, e cor */
}
.comments .comments-content .comment-content {background: #ffffff; /* background- fundo do texto do comentarista */
}
Legenda:
a imagem abaixo representa, o mesmo código acima:


pronto, depois que estiver tudo ao seu gosto, salve!
beijos,
até o próximo post,
Comentem!!

30 outubro 2012

Parceria Vanessa Unhas + Brushes + Tutorial como colocar top comentarista no blog

36 comentários:
Olá gente, conquistamos uma nova parceria, é a Vanessa Unhas. Ela faz tatuagens de unhas, e vende em um preço acessível para o bolso de cada um. Ela vende através do seu blog Vanessa Unhas. Super criativa, faz vários adesivos de unhas perfeitos. Vamos ver algumas fotos?


São lindas não é mesmo? gostei dessa do Luan, espero que me enviem essa.. Há, e não é só assim de adesivos que ela vende não, ela vende adesivos de unha toda (com o fundo) e adesivo de unha simples (só o desenho) e custa super barato. 5,00 reais apenas e você compra seu adesivo de unha. Ah! Também tem uma promoção, Cartela com 12 adesivos, somente 5,00Reais, daí é muito barato, vai lá, compre a sua!! Mais tarde a resenha, pode ser que haja até sorteio, fique ligados..  Para comprar, é só acessar o blog Vanessa Unhas.

Brushes Natalinos
Oi gente, faz um tempinho que não posto mais brushes não é mesmo?Pois é, fiz uns brushes de natal para vocês, espero que gostem. (clique na imagem para ampliar)

Gostaram? Espero que sim..

Tutorial : Colocando Top comentarista No blog

222495_431082756951122_1855860485_n_large

Tó fazendo esse tutorial ao pedido de uma leitora aqui do blog que perguntou como eu fiz. Eu aprendi no Dicas Blogger, e agora vou ensinar para vocês, espero que gostem e entendam, fiz tudo devagar para não errar em nada.

- Vá em layout >> add gadget >> html javascript
Depois cole esse código enorme, no gadget:

<style type="text/css">
.top-commenter-line     {margin: 3px 0;}
.top-commenter-avatar   {vertical-align:middle;}
</style>
<script type="text/javascript">
//
// Top Commentators gadget with avatars, by MS-potilas 2012.
// Gets a list of top commentators from all comments, or specified number of days in the past.
// See http://yabtb.blogspot.com/2012/05/top-commenters-gadget-with-avatars.html
//
// CONFIG:
var maxTopCommenters = 5;   // how big a list of top commentators
var minComments = 1;        // how many comments must top commentator have at least
var numDays = 0;            // from how many days (ex. 30), or 0 from "all the time"
var excludeMe = true;       // true: exclude my own comments
var excludeUsers = ["Anonymous", "someotherusertoexclude"];     // exclude these usernames
var maxUserNameLength = 42; // 0: don't cut, >4: cut usernames
//
var txtTopLine = '<b>[#].</b> [image] [user] ([count])';
var txtNoTopCommenters = 'No top commentators at this time.';
var txtAnonymous = '';      // empty, or Anonymous user name localized if you want to localize
//
var sizeAvatar = 16;
var cropAvatar = true;
//
var urlNoAvatar = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj-ILcsV8moUe9C6wU5Z5w3ABmmlNYueUBS7KBUnBK9A_jpO5gTffsWaR0oNXMTi-NiAE9h3qsT_wOldcmPdzpCdrsS6Xo8dFtENa05YMSb1rFy9WHEyEjI6my2ZnNMkV72lpw1FcSORxE/"+sizeAvatar+"/avatar_blue_m_96.png"; //http://www.blogger.com/img/avatar_blue_m_96.png resizeable
var urlAnoAvatar = 'http://www.gravatar.com/avatar/00000000000000000000000000000000?d=mm&s='+ sizeAvatar;
var urlMyProfile = ''; // set if you have no profile gadget on page
var urlMyAvatar = '';  // can be empty (then it is fetched) or url to image
// config end
// for old IEs & IE modes:
if(!Array.indexOf) {
Array.prototype.indexOf=function(obj) {
  for(var i=0;i<this.length;i++) if(this[i]==obj) return i;
  return -1;
}}
function replaceTopCmtVars(text, item, position)
{
  if(!item || !item.author) return text;
  var author = item.author;

  var authorUri = "";
  if(author.uri && author.uri.$t != "")
    authorUri = author.uri.$t;

  var avaimg = urlAnoAvatar;
  var bloggerprofile = "http://www.blogger.com/profile/";
  if(author.gd$image && author.gd$image.src && authorUri.substr(0,bloggerprofile.length) == bloggerprofile)
    avaimg = author.gd$image.src;
  else {
    var parseurl = document.createElement('a');
    if(authorUri != "") {
      parseurl.href = authorUri;
      avaimg = 'http://www.google.com/s2/favicons?domain=' + parseurl.hostname;
    }
  }
  if(urlMyProfile != "" && authorUri == urlMyProfile && urlMyAvatar != "")
    avaimg = urlMyAvatar;
  if(avaimg == "http://img2.blogblog.com/img/b16-rounded.gif" && urlNoAvatar != "")
    avaimg = urlNoAvatar;
  var newsize="s"+sizeAvatar;
  avaimg = avaimg.replace(/\/s\d\d+-c\//, "/"+newsize+"-c/");
  if(cropAvatar) newsize+="-c";
  avaimg = avaimg.replace(/\/s\d\d+(-c){0,1}\//, "/"+newsize+"/");

  var authorName = author.name.$t;
  if(authorName == 'Anonymous' && txtAnonymous != '' && avaimg == urlAnoAvatar)
    authorName = txtAnonymous;
  var imgcode = '<img class="top-commenter-avatar" height="'+sizeAvatar+'" width="'+sizeAvatar+'" title="'+authorName+'" src="'+avaimg+'" />';
  if(authorUri!="") imgcode = '<a href="'+authorUri+'">'+imgcode+'</a>';

  if(maxUserNameLength > 3 && authorName.length > maxUserNameLength)
    authorName = authorName.substr(0, maxUserNameLength-3) + "...";
  var authorcode = authorName;
  if(authorUri!="") authorcode = '<a class="profile-name-link" href="'+authorUri+'">'+authorcode+'</a>';

  text = text.replace('[user]', authorcode);
  text = text.replace('[image]', imgcode);
  text = text.replace('[#]', position);
  text = text.replace('[count]', item.count);
  return text;
}

var topcommenters = {};
var ndxbase = 1;
function showTopCommenters(json) {
  var one_day=1000*60*60*24;
  var today = new Date();

  if(urlMyProfile == "") {
    var elements = document.getElementsByTagName("*");
    var expr = /(^| )profile-link( |$)/;
    for(var i=0 ; i<elements.length ; i++)
      if(expr.test(elements[i].className)) {
        urlMyProfile = elements[i].href;
        break;
      }
  }

  for(var i = 0 ; i < json.feed.entry.length ; i++ ) {
    var entry = json.feed.entry[i];
    if(numDays > 0) {
      var datePart = entry.published.$t.match(/\d+/g); // assume ISO 8601
      var cmtDate = new Date(datePart[0],datePart[1]-1,datePart[2],datePart[3],datePart[4],datePart[5]);

      //Calculate difference btw the two dates, and convert to days
      var days = Math.ceil((today.getTime()-cmtDate.getTime())/(one_day));
      if(days > numDays) break;
    }
    var authorUri = "";
    if(entry.author[0].uri && entry.author[0].uri.$t != "")
      authorUri = entry.author[0].uri.$t;

    if(excludeMe && authorUri != "" && authorUri == urlMyProfile)
      continue;
    var authorName = entry.author[0].name.$t;
    if(excludeUsers.indexOf(authorName) != -1)
      continue;

    var hash=entry.author[0].name.$t + "-" + authorUri;
    if(topcommenters[hash])
      topcommenters[hash].count++;
    else {
      var commenter = new Object();
      commenter.author = entry.author[0];
      commenter.count = 1;
      topcommenters[hash] = commenter;
    }
  }
  if(json.feed.entry.length == 200) {
    ndxbase += 200;
    document.write('<script type="text/javascript" src="http://'+window.location.hostname+'/feeds/comments/default?redirect=false&max-results=200&start-index='+ndxbase+'&alt=json-in-script&callback=showTopCommenters"></'+'script>');
    return;
  }

  // convert object to array of tuples
  var tuplear = [];
  for(var key in topcommenters) tuplear.push([key, topcommenters[key]]);

  tuplear.sort(function(a, b) {
    if(b[1].count-a[1].count)
        return b[1].count-a[1].count;
    return (a[1].author.name.$t.toLowerCase() < b[1].author.name.$t.toLowerCase()) ? -1 : 1;
  });

  // list top topcommenters:
  var realcount = 0;
  for(var i = 0; i < maxTopCommenters && i < tuplear.length ; i++) {
    var item = tuplear[i][1];
    if(item.count < minComments)
        break;
    document.write('<di'+'v class="top-commenter-line">');
    document.write(replaceTopCmtVars(txtTopLine, item, realcount+1));
    document.write('</d'+'iv>');
    realcount++;
  }
  if(!realcount)
    document.write(txtNoTopCommenters);
}
document.write('<script type="text/javascript" src="http://'+window.location.hostname+'/feeds/comments/default?redirect=false&max-results=200&alt=json-in-script&callback=showTopCommenters"></'+'script>');
</script>
Agora clique em salvar, depois visualize o seu blog. O gadget demorará uns minutos para aparecer, até lá, é só ter paciência com o gadget, que funciona.

Bom gente por hoje é só,
Comentem!!

>> Visite a loja da vanessa unhas <<

29 outubro 2012

Layout Novo + Nuvem voando atrás do Cabeçalho do blog

18 comentários:
Oi gente, mudei o layout, é ,já natal,  porque eu quero que ele fique mais tempo.Então vocês gostaram?? espero que sim. Bom vim postar um super tutorial bem legal, acho que vocês vão gostar, então vem comigo e leia mais..

 
Nuvem voando atrás do cabeçalho do blog
é aquelas nuvens que ficam voando atras do cabeçalho do blog, sabe igual a minha nesse template de natal. Então? vamos aprender? Vem que é fácil!!

Vá em: Modelo >> Editar HTML : prosseguir 
agora clique  F3 ou clique SHIFT+F e procure o seguinte código:
<div class='body-fauxcolumns'>
Depois que você achar o código acima, cole o código abaixo, após (depois, abaixo) dele:
<marquee height='1000px' scrollamount='10'><img src='Imagem-da-nuvem-aqui'/></marquee>
Legenda: O que esta destacado de roxo, é a velocidade da nuvem, quanto maior o número, mais rápido fica. E onde esta destacado de laranja, é ando você vai colar o url da imagem da nuvem.  

Achei umas nuvens na internet, algumas foram feitas por mim, outras não (achei no google se for sua, me avise.)
clique para ampliar






Bom gente, por hoje é só!
COMENTEM!!

31 agosto 2012

Utilitários, e Mini tutoriais

37 comentários:
Oi pessoal, fiquei muito feliz por vocês terem gostado muito da entrevista com a Elisa do blog caprichosa (clique no link para ver o blog da Elisa), no post anterior (clique no link, para rever a entrevista). Bom gente vamos ao que interessa, o post de hoje, vai ser cheio de utilitários e mini tutoriais  bem bacanas para seu blog! Então não perca mais tempo, clique leia mais, que lá vem BIG POST 

          >>Big Post na área<<

Cursores para seu blog
Como instalar no seu template: vá em Layout >> Add um gadget >> HTML javascript e colar o código do cursor lá. Não precisa de colocar o titulo! Não retire os créditos!!

                                                                                     
             
Atenção!! -->> Não re-blogue nenhum cursor da qui! Eu mesma fiz esses cursores. Não retire os créditos se usarem em seus blogs!!

Textareas Personalizadas
Como instalar: isso se instala no seu próprio editor de postagem, só é preciso copiar o código da caixinha que escolher, e depois colar na sua postagem HTML. E depois escrever o texto que quer.

                      
                                         
Atenção!! -->> Não re-blogue nenhuma Textarea da qui! Eu mesma fiz essas caixinhas.

                                        //--------------------------------------------//
Seleção colorida no Blog
Vá em:  Modelo >> Editar HTML
Procure por: /* Content
Acima dele cole o seguinte código abaixo:

/* Seleção colorida
----------------------------------------------- */
::-moz-selection {
background:#000; /*Cor do fundo*/
color:#fff; /*Cor da fonte*/
}

::selection {
background:#000;/*Cor do fundo*/
color:#fff; /*Cor da fonte*/
}

Linha que divide o post da sidebar
Vá em: Modelo >> Editar HTML
Procure por: 
Se for coluna direita: .main-inner .fauxcolumn-right-outer .fauxcolumn-inner {
Se for coluna esquerda: .main-inner .fauxcolumn-left-outer .fauxcolumn-inner {
Abaixo vai esta mais ou menos assim:


.main-inner .fauxcolumn-left-outer .fauxcolumn-inner {
  margin-right: $(content.padding);
  background: $(widget.outer.background.color) $(widget.outer.background.gradient) repeat scroll top left;
}


Apague o que está de vermelho, e cole esse:
Se for coluna direita:
border-left: 1px solid #000000;
Se for coluna esquerda:
border-rigth: 1px solid #000000;

é só fazer algumas configurações, e pronto! salve seu modelo!!

e ai, gostaram do post?
Beijos, e até a próxima!!

28 agosto 2012

Personalizando A Data do post

32 comentários:
Oi pessoal, o post de hoje vai ser super fácil, bacana, divertido e rápido. Mais antes de começarmos, queria pedir desculpas a vocês, pois fiquei sem ver o blog por 4 dias... Mais agora estou de volta, e com um layout super novinho, gostaram? Então vamos ao tutorial!..

                  Tumblr_m9hsctf2eb1ql477co1_500_large
Clique em leia mais, e confira o tutorial!!

Vamos lá!
vá em:  Blogger >> Modelos >> Editar Html - Prosseguir 

Depois, clique (CTRL+F -para procurar) e procure por:
.main-inner h2.date-header {
 depois de achar, selecione o trecho dele, todo até as chaves, e cole o seguinte código no lugar:
/* Data Do post
----------------------------------------------- */
.main-inner h2.date-header {
background: #000000; /*---Cor do back---*/
color: #ffffff; /*---Cor da letra---*/
width: 10%; /*---Tamanho do back, não altere nada aqui---*/
margin-bottom: -60px; /*---margin, a baixo---*/
font-family: verdana; /*---estilo da fonte---*/
}
Quando fizer isso, visualize, e depois salve. Espera, que ainda não acabou.. Tem mais,
Se ficar desalinhado, copie o código abaixo e cole acima de: ]]></b:skin>
/* data do post
----------------------------------------------- */
.main-inner h2.date-header {
margin-left:-60px; /*--- Pxs para a esquerda---*/
margin-rigth: -60px; /*---pxs para a direita---*/
border: 1px solid #ff50ff; /*---bordas em volta do back---*/
}
pronto, agora faça a personalização ao seu gosto. depois visualize e salve!
Agora vá em: Configurações >> idioma e formatação : Formatação- formato da data

deixe a data no 4° modelo, que é um assim: 28/08/12, para ficar legal...
salve, e pronto!

beijos,
e ai, gostaram do post?
o que acharam? 

06 agosto 2012

Criando Elemento a mais no seu Html

28 comentários:
Bom gente o nosso post de hoje também vai ser um tutorial que eu mesma descobri, com ajuda de css e minha experiencia, fiz um elemento a mais no meu html,igual a um menu cute, mais em vez de ser com links, é em texto. Pode ser usado nas páginas, como gadget, como postagem a lista é infinita Claro que você não pode é postar no Face, twitter, orkut, pois não faz parte, é só no blog mesmoBem eu lhe dei esse nome de titulo é pois ainda não sei o nome para dar a ele, (se vocês sabem o nome, por favor comente nesse post). bem gente é isso, para saber qual é o elemento e para saber como fazer ele, clique em leia mais, e viaje no Html...
                 Tumblr_m8c5e5snha1rwcep2o1_500_large
Antes de tudo, vocês tem que ver o que é, olhe esse texto abaixo e passe o mouse por cima dele para ver, é isso que nós vamos aprender a fazer..

Passe o mouse aqui por cima para ver o efeito do tutorial

já viu? então gostou? é isso que nós vamos aprender a fazer agora! é só seguir os passos abaixo, com atenção:

1- faça login no seu blog, e clique em: Modelos >> Editar Html >> Prosseguir
2- Depois clique F3 e procure por:
/* Variable Definitions
ou procure por:
]]></b:skin>
3- acima dele colo esse código:

/* Estilo deby sabe tudo ----------------------------------------------- */
#campoatençao {
display:block;
font-size: 12px; /* tamanho da fonte */
font-family: arial; /* nome da fonte */
letter-spacing: 0;
border: 1px solid #ff50ff; /*bordas no quadrado*/
text-indent: 5px;
vertical-align: middle;
line-height: 15px;
background: #ffbbff; /* cor do background*/
color: #000000; /*cor da fonte*/
padding-left: 10px;
}

#campoatençao:hover {
display:block;
vertical-align: middle;
line-height: 15px;
background: #ff50ff; /*background do fundo hover (quando passar o mouse por cima)*/ color: #000000; /*cor da fonte hover*/
padding-left: 10px;
}

 4- agora é só você personalizar esse código como quiser, apenas edite o que esta de vermelho! no código esta a descrição.
5- agora salve.
6- agora vá em postar postagem, ou o lugar onde você quer colocar o efeito, mais não se esquece, que o efeito só vai pegar se você editar o post, pagina, ou gadget em html. e cole isso sempre que você quiser usar o efeito:
<div id="campoatençao"> Escreva o que quer que fique com o efeito, escreva um texto</div>
bem gente é só isso, não se esqueça de editar a pagina em html, se não digitar em html o efeito não pega!

bem gente fiquem com deus.
comentem a vontade, diga o que achou do post!

                                                                                                                                 BEIJOS
                                                                                                                       ATÉ A PROXIMA 



12 julho 2012

personalizando o wrapper +Tags e Selinho

22 comentários:
Olá pessoal, como vão. Hoje o nosso post vai ser triplo, um vai ser um belo e fácil legal tutorial e os outros dois vão ser tags e selinhos que recebi de alguns blogs essa semana. Então não vamos perder tempo, vamos ao tutorial.

Personalizando o Footer Wrapper
vai ficar mais ou menos assim igual ao meu:
                           

Então vamos lá pessoal são passos simples e rápidos, mais requer paciência também.
Abra a sua conta no blog, e depois clique em Modelo > Editar HTML > prosseguir , e procure por:


]]></b:skin>
e cole o seguinte código acima:
#footer-wrapper { background: url (url-da-imagem-aqui) repeat; z-index: 1000; clear: both; font-size: 90%; /*tamanho da fonte*/ color: #ffffff; /*cor da fonte*/ text-align: center;/*alinhamento da fonte*/ padding: 5px;}
é só fazer algumas modificações como colocar um background(uma imagem) personalizado por você, personalizar a cor da fonte, o tamanho.e assim vai.
- mais ainda tem mais uma coisa que você deve fazer,é colocar a legenda(os créditos) coisa assim então procure por:


</body>
e cole esse seguinte código acima:

<div id='footer-wrapper'> Escreva o que quer </div>
e é só isso pessoal espero que tenham gostado.
a maioria dos Créditos: Fashion Screem

as tags e os selinhos, vocês tem que clicar em leia mais para ver!

Respondendo A tag
Olá, eu já falei para vocês que nessa sema só recebi selinhos e tags, não é?, e agora eu vou falar para vocês!


Recebi,uma tag muito especial de um blog chamado Sou assim,problem? e agora vou responde-lá:

#01- Sou muito - Inteligente  
#02- Eu não suporto - Ficar sem Internet
#03- Eu nunca comi - picolé de queijo
#04- Eu já vendi - Bijuterias
#05- Quando criança - Acreditava que ia comprar algo amanhã
#06- Neste exato momento - estou respondendo esta tag
#07- Eu adoro - mandar minha irmã ir tomar .... na quele lugar
#08- Eu sempre - tiro notas altas em matemática
#09- Se pudesse - eu ficaria o dia inteiro no computador
#10- Fico feliz quando - fico sozinha em casa (faço a festa)
#11- Se pudesse voltar no tempo - ia pensar antes de descer a escada com a bicicleta
#12- Adoro assistir - nada, prefiro a internet mesmo!
#13- Eu preciso de - uma internet de 5mega
#14- Eu odeio - Michel teló
#15- Eu amo - Luan Santana
#16- Se eu pudesse - eu iria no show do Luan santana

Bem gente,essa foi a tag que eu recebi. espero que tenham gostado das resposta, e assim, vocês sabem um pouco mais de mim. Agora vamos lá, para os selinhos...


Bem gente, eu recebi dois selinhos iguais mais de blogs diferentes, um deles foi o Cliques no Capricho e o blog News Now:
Selinho:
                                                

bem e também tem as regrinhas simples:
Regras

1-Só quem recebeu o selinho de outro blog pode postá-lo 
2 - Se você for postar o selinho, poste também essas 5 regras
3 - Repasse para 8 blogs e avise-os
4 - Blog de origem -> http://www.blogassuntodegarota.blogspot.com/ (deve colocar linkado)
5 - Dizer quem te mandou e colocar o link
Quem me mandou foi o blog: Cliques no Capricho e o News Now


8 blog que eu vou repasar:
Bem vou tentar repassar os 8 mais não sei se a maioria vai postar o selinho.


1- Morango com chocolate
2- Blog da Brendinha 10
3- Aqui Tem
4- Caprichosa
5- Sempre Linda
6- zzzz
7- zzzz
8- zzzz

bem gente, infelismente,não consegui 8.
espero que tenham gostado desse post.
Comentem, e até a proxima!!!

03 julho 2012

Solução para o b:skin que não funciona

24 comentários:
Em alguns blogs, o código b:skin,não funciona, Então não tem jeito de você colocar os seguintes códigos como barra de rollagem, selecção colorida, retirar a navbar e entre outros que dependem dele para realizar suas funções. Mais eu tenho uma dica super legal + um tutorial para você solucionar.

Não é bem solucionar mais é um código que vai quebrar o galho do seu B:skin, Então vamos lá.

1- a dica é muito simples,você só tem que ir no seu html, e procurar por: 

/* Variable definitions
====================

 e colar o código que era pra colar acima de b:skin, acima de variable definitions, e testa pra ver se funciona. se não funcionar (o que eu acho raro) ai não tem jeito seu blog, está com erro.

 -----------------XX TUTORIAL XX-------------------

Bem como eu disse vou mostrar um tutorial para vocês, colocando o código acima de variable definitions. Vamos lá:

 COLOCANDO LINHA ABAIXO DO TITULO DO POST

1- abra o seu html e procure por:

 /* Variable definitions

 2- depois cole o seguinte código:

h3.post-title {
border-bottom: 1px dashed #000000; 
}


 LEGENDA                                        

VERMELHO: a expressura da borda 
VERDE: o tipo(forma) da borda 
AZUL: a cor da borda 

 3- visualize e salve!

 SE REBLOGAR, POR FAVOR COLOQUE OS MERECIDOS CRÉDITOS COM LINK.

29 junho 2012

Tutorial: Modificando a linha de separação dos Gadgets

24 comentários:
Olá meninas e meninos, como vão? Hoje vou ensinar um tutorial que descobri, que é personalizar (Mudar) a aquela barrinha que separa os gadgets. Bem é simples e fácil também.Para vocês entenderem melhor o que é, tem uma imagem abaixo de como vai ficar:

                                 
 Então vamos, lá! clique em leia mais para saber como fazer!

Então gente vamos lá ao tutorial.
1- vá no seu html e  procure pelo seguinte código:

.sidebar .widget {

 2- Abaixo dele vai está mais ou menos assim:


  border-bottom: 2px solid $(widget.border.bevel.color);
  padding-bottom: 10px;
  margin: 10px 0;
}


3- então você vai apagar somente isso:


  border-bottom: 2px solid $(widget.border.bevel.color);


4- e cole isso no lugar:


border-bottom: 1px dashed #ffffff;


5- ai é só editar conforme a legenda abaixo:

Vermelho: a espessura da borda.
Verde: é a forma (jeito) da borda. Se quiser, veja nesse link AQUI!
Roxo: é a cor da borda. Se quiser, veja cores em html aqui!

Bem gente, é só isso!
beijos gente, comentem bastante!


29 maio 2012

Colocando Cabeçalho por HTML

22 comentários:
Bem gente hoje vou postar um tutorial super legal e muito fácil de fazer. que é colocar o cabeçalho por html, parece ser muito fácil não? mais é muito fácil e rápido também e fica muito legal. se você quiser aprender a fazer esse tutorial clique em leia mais..

Créditos: World Girl

Como eu estava dizendo é super fácil e rápido. ( se você quiser tirar o backup do seu lay primeiro fique a vontade..). Então vamos lá:

1- Vá em Modelos >> Editar Html ( se você usa a interface antiga, vá em designer >> editar Html)
2- clique em prosseguir, e aperte as teclas " Ctrl+F" ou F3. E procure por:


/* Tabs


3- Abaixo dele vai está mais ou menos assim:

.tabs-inner {
padding: 0;
}

4- então apague esse código e coloque esse no lugar:

.tabs-inner {
background: url (URL DO CABEÇALHO AQUI) no-repeat;
background-position:left;
padding-top:430px;
}

agora vamos só editar, edite assim:
o que esta de negrito é o url do seu cabeçalho.
o que esta de vermelho e a posição de como ele vai ficar.

Bem gente por hoje é só.
comentem fiquem a vontade aqui no blog.
valeu.

26 maio 2012

Personalizando Os gadgets de arquivos

27 comentários:


Muitas vezes o nosso Gadget de arquivos fica meio normal, mais tem algumas pessoas que prefere ele personalizado, e tem outras que preferem ele normal mesmo. Vocês podem ver que o nosso Gadget de arquivos está personalizado, então vamos aprender a fazer um igual é fácil e rápido mais tem que fazer o tutorial com muita atenção.

Clique em Leia Mais para Conferir tudinho...

Então vamos lá, primeiro e antes de tudo, faça o backup do seu layout, ou copie o código HTML do seu blog e salve em uma pasta. Agora sim vamos ao tutorial..

1- Vá no seu html e clique na caixinha expandir modelos de widgets, e procure pelo seguinte código:


(<data:i.post-count/>)


2- Ele vai aparecer no seu HTML três vezes então, apague ele e coloque o seguinte código no lugar dele :


<img src="ENDEREÇO DO GIF" />


3- Agora só basta modificar, coloque o url do gif  que vai ficar do lado do mês onde esta escrito endereço do gif. Depois visualize e salve...


Pesquisei alguns gifs pra vocês colocarem:
Créditos:  Mini Gifs - Cutes


             
                
              
              
                         


------------------------------------------------------------------------------------

Espero que vocês tenham gostado desse tutorial.
qualquer duvidas, é só comentar que responderemos em breve..
comentem e digam o que acharam desse novo post..

Créditos Blog Conectada| www.blogconnectada.blogspot.com - 2014 // Todos os direitos reservados // Para encomendar entre em contato.