Facebook Google +

Uncomplicated Works

é mais do que um simples blog que se encontra no google depois de digitar

"dicas para template"

. É um espaço onde se promovem técnicas de

template para blogger

e

web design

, além de haver ainda espaço para umas pistas para problemas em programas e no Windows. Nem todos somos Einstein no que toca à ciência, temos de admitir, por isso dá jeito ter sempre alguma ajuda. E é isso que o uncomplicated design promete: umas pitadas de boa informação para qualquer um que esteja a dar os primeiros passos neste vasto mundo da tecnologia, aliadas à rapidez e experiência de quem mantém o blog.

segunda-feira, 9 de fevereiro de 2015

Retirar a Borda das Imagens do Blogger

Boas pessoal! Bem-vindos a mais um tutorial do Blogger Uncomplicated Works, e hoje irei ensinar a retirar a borda das imagens no blogger. Normalmente quando criamos uma conta no blogger, ao postar uma imagem ela irá ficar com uma espécie de borda branca, e neste tutorial vamos ensinar a retirar.
Com este tutorial de como retirar a borda das imagens do blog, o efeito vai ser:

Com borda

Retirar a borda das imagens do blogger

Depois do tutorial ficará assim:

Retirar a borda das imagens do blogger

A primeira etapa deste tutorial é, ir a modelo, pressionar Ctrl+F e procurar por:

.post-body img, .post-body .tr-caption-container

Feito isso irá aparecer um código CSS deste género:

.post-body img, .post-body .tr-caption-container, .Profile img, .Image img,
.BlogList .item-thumbnail img {
  padding: $(image.border.small.size);

  background: $(image.background.color);
  border: 1px solid $(image.border.color);

  -moz-box-shadow: 1px 1px 5px rgba(0, 0, 0, .1);
  -webkit-box-shadow: 1px 1px 5px rgba(0, 0, 0, .1);
  box-shadow: 1px 1px 5px rgba(0, 0, 0, .1);
}

.post-body img, .post-body .tr-caption-container {
  padding: $(image.border.large.size);
}

Encontrado o código, devem substitui-lo por este:

.post-body img, .post-body .tr-caption-container, .Profile img, .Image img,
.BlogList .item-thumbnail img {
  background:transparent;
}

.post-body img, .post-body .tr-caption-container {
  background:transparent;
}

Ou mesmo remover essa parte do código. 

Feito isto temos o tutorial de como retirar a borda das imagens do blogger, realizado por Uncomplicated Works concluído, espero que tenham aprendido algo, se não tiverem percebido, deixem nos comentários!


8 comentários:

  1. da para colocar 0, 0, 0, 0 em vez de remover, o poblema e que nunca acho esses codigos, mesmo com o ctrl f

    ResponderEliminar
    Respostas
    1. Boas, pode-me enviar o link do seu blog?

      Eliminar
    2. tb não acho esse trecho no meu blog, ajuda aki.
      http://jezielipristine.blogspot.com.br/
      to usando o modelo de Visualizações dinâmicas

      Eliminar
    3. Boas, terá de adicionar este trecho ao CSS do seu blog!

      .article .article-content img:not(.deferred) {
      padding: 0px!important;
      }

      Para encontrar o CSS, pressione CTRL + F e pesquise por ]]>

      Feito isso adicione o código anterior antes da tag pesquisada!

      Cumprimentos!

      Eliminar
    4. Este comentário foi removido pelo autor.

      Eliminar
  2. Respostas
    1. Boa noite, abra o modelo e pesquise por: .pagepost img
      Irá encontrar um código igual a este:
      .pagepost img {
      max-width: 580px;
      padding: 3px;
      border: 1px solid #DDD;
      box-shadow: 3px 3px 0px rgba(0, 0, 0, 0.1);
      height: auto;
      }

      Agora apague esse código e coloque este:

      .pagepost img {
      max-width: 580px;
      padding: 3px;
      height: auto;
      }

      Se não funcionar procure por ]]> e coloque isto antes:

      .pagepost img {
      border: none!important;
      box-shadow: none!important;
      }

      Espero ter ajudado, qualquer dúvida contacte!

      Eliminar

Related Posts Plugin for WordPress, Blogger...