192207784316955
Loading...

CSS no Blogger: o que é e como usar

css-blogger-130O recurso de CSS (Cascading Style Sheets) é essencial para modificar aspectos visuais de um blog. Por isso, ele é um dos componentes principais dos templates, justamente por permitir visualizações diferentes para cada blog. Muitas customizações podem ser realizadas através do CSS, como a mudança de fontes, cores, bordas, imagens de fundo e muito mais. Aprenda neste artigo os conceitos básicos do CSS e suas possibilidades de uso no Blogger.

Introdução

O CSS é um recurso bastante antigo. Numa tradução aproximada, ele pode ser entendido como “Folhas de estilo em cascata”. Para quem trabalha com desenvolvimento para web, conhecer CSS é fundamental. É uma forma bastante prática para separar a formatação das páginas de seu conteúdo.

Esse conceito é bastante aplicado no Blogger: através do CSS, são definidos diversos dos aspectos visuais do seu blog. É graças a ele que cada blog possui fontes diferentes, cores diferentes, bordas diferentes etc. Abaixo está um exemplo bastante simples de um código CSS, que define a cor de fonte para os links do Gerenciando Blog:
a:link {
color:#36C;
text-decoration:none;
}
É justamente pela modificação do CSS que são realizadas muitas das customizações vistas em tutoriais. Uma customização recente que mostrei aqui no Gerenciando Blog e que se enquadra nesta categoria foi abordada no artigo Destaque no comentário do autor no Blogger. Nela, mostrei que, com alterações no CSS de seu blog, é possível dar destaque aos comentários que você escreve. A propósito, foi um comentário deixado pelo leitor José Marlon que inspirou a criação deste artigo.
Como em outras oportunidades, recomendo fortemente que você realize todos os procedimentos citados neste artigo primeiro em seu blog de testes, e não no oficial. Desta forma, você evita surpresas desagradáveis que possam atrapalhar a experiência de seus visitantes. Caso você ainda não tenha um, basta seguir as orientações do artigo Como criar um blog de testes no Blogger. Depois, você pode aplicá-las com segurança em seu blog oficial.

Como alterar o CSS do meu blog?

Há alguns locais diferentes onde o CSS do seu blog pode estar. Na verdade, ele pode até estar espalhado por mais de um lugar diferente. Isso significa que há também diversas formas para você realizar a alteração, cada uma com suas vantagens e desvantagens.

Lendo os itens abaixo, você aprenderá as diversas formas para realizar as alterações. As possibilidades são:

1. No código HTML do seu template
Praticamente todos os templates do Blogger (sejam eles criados pelo Blogger ou customizados) possuem códigos CSS no próprio HTML do template. Esta é a forma mais utilizada pelos criadores de templates, pois ao aplicar um novo template, todas as customizações serão levadas com ele.

Localizá-lo é bem simples: procure em seu HTML pelo termo b:skin. Todo o código que você encontrar entre esse termo de abertura e o /b:skin, que faz o seu fechamento, compõe o seu CSS. Caso você tenha dúvidas para editar o seu template, sugiro a leitura do artigo Como editar o HTML de seu template no Blogger.

Na figura abaixo, você vê destacado em azul o termo que marca o início do CSS e em vermelho um exemplo de código CSS no HTML.
CSS no Blogger
Você notou as cores diferentes das fontes? Isso é feito pelo ótimo editor Notepad++, que apresento no artigo 5 ferramentas grátis para apoiar seu blog. Este é um dos motivos pelos quais eu o utilizo para trabalhar com meus templates.
Tratando-se do CSS em seu template, há duas possibilidades. Em ambos os casos, é necessário alterar o código HTML e aplicá-lo em seu blog.
  • Você pode alterar um elemento já existente. Utilizando como exemplo a cor de fonte do link, que mostrei na introdução deste artigo, você pode simplesmente mudar o código da cor no trecho já existente.
  • Você pode adicionar novos códigos CSS. Você pode também adicionar um novo trecho de código, como o que mostrei no artigo Destaque no comentário do autor no Blogger.
Vantagens:
  • Toda a alteração que você fizer nesse método ficará gravada no HTML do seu template.
  • Se você aplicar o template em outro blog, as alterações feitas no CSS serão levadas para ele.
  • Ao realizar o backup do seu template, todas as configurações de CSS estarão nele.
Desvantagem:
  • Para aplicar a alteração, é necessário fazer alterações no HTML do template e há pessoas que ainda não se sentem seguras para fazer isso.

2. Pelo Designer de Modelo do Blogger
Outro local onde você pode realizar alterações no CSS do seu blog é através do Designer de Modelo do Blogger. Eu falei sobre este recurso fantástico no artigo Blogger Template Designer: Customize seu Template, quando ele foi lançado e ainda não tinha um nome em português.

A grande sacada é que, fazendo as alterações desta forma, você não precisa modificar nada em seu HTML. Basta você adicionar o trecho desejado de CSS como uma configuração do seu blog, e o Blogger adicionará automaticamente esse trecho ao seu template quando ele for exibido.

Para fazer as configurações de CSS dessa forma, basta seguir os passos abaixo:

1. Acesse http://www.blogger.com e entre com seu usuário e senha se forem solicitados.

2. Clique sobre o nome do seu blog.

3. Clique na opção “Modelo”, no menu lateral esquerdo.
CSS no Blogger

4. Clique no botão “Personalizar”, abaixo da visualização do seu blog.
CSS no Blogger

5. No menu lateral esquerdo, clique em “Avançado”.
CSS no Blogger

6. Adicione o código CSS desejado na área “Adicionar CSS”. Note que, assim que você alterar o código, seu blog já será visualizado na área inferior com as alterações que você realizar.
CSS no Blogger

7. Ao terminar, clique no botão “Aplicar ao blog”, que fica no canto superior direito da tela.
CSS no Blogger

Vantagens:
  • A aplicação de alterações é simples e rápida.
  • Não é necessário modificar o template para fazer as alterações no CSS.
Desvantagens:
  • As alterações feitas desta forma não ficam associadas ao seu HTML. Assim, não é possível fazer o backup delas salvando apenas o template. É necessário salvar as configurações em um arquivo separado.
  • Se você fizer qualquer alteração no HTML de seu template, as configurações em seu CSS feitas desta forma serão perdidas. Assim, se você fizer qualquer alteração, será necessário aplicar novamente as customizações de CSS.

3. Em um arquivo externo
Outra forma possível de aplicar alterações ao CSS de seu blog é através de um arquivo externo. Inclusive, é possível que você já tenha esse recurso aplicado em seu blog, pois há diversas customizações que o utilizam.

Como exemplo, mostro abaixo uma linha no template atual do Gerenciando Blog, em que o Google utiliza um arquivo externo para aplicar um novo estilo:
link href='http://fonts.googleapis.com/css?family=Droid+Serif:bold' rel='stylesheet' type='text/css'/
Neste caso, os comandos CSS ficam dentro do arquivo indicado, sendo carregado pelo Blogger no momento de exibir a página. A diferença em relação ao item anterior é que, mesmo que você analise o código-fonte da página, não encontrará os estilos, pois só continuará havendo a referência ao arquivo onde eles estão.

Fazer a alteração utilizando este método também é um processo simples, mas que exige a alteração do código HTML do seu template.

1. Crie um arquivo em um editor de textos - como o Notepad++ - colocando nele as definições de CSS que você deseja aplicar ao seu blog.

2. Salve esse arquivo com a extensão .CSS (por exemplo, “estilos.css”) e faça o seu upload para um serviço na internet. Caso você não saiba como e onde fazer isso, os artigos Onde hospedar arquivos para seu blog e Webs, ótimo site para hospedar seus arquivos irão ajudá-lo.

3. Adicione ao HTML do seu template uma linha similar à abaixo, adaptando o trecho em negrito com a localização e nome do seu arquivo CSS. Preferencialmente, esta linha deve ficar após a linha /b:skin de seu template. Caso contrário, ela poderá ser substituída por uma definição que esteja em seu template.
link href='http://caminho/arquivo.css’ rel='stylesheet' type='text/css'/
4. Publique o seu template com as alterações.

Vantagens:
  • A alteração em seu template é necessárias, mas é pequena.
  • Ao fazer alterações em seu template, suas customizações CSS não são perdidas (a menos, óbvio, que você remova a linha com seu carregamento).
  • Como se trata de um arquivo separado, é simples realizar o seu backup.
Desvantagens:
  • Exige a hospedagem de um arquivo em um serviço separado do seu blog.

Qual método escolher?

Os três métodos que citei acima lhe trarão o mesmo resultado final. Assim, pensando em resultados, tanto faz qual método você escolherá.

A escolha do método é pessoal: como não tenho dificuldades em trabalhar com HTML, eu optei pelo método 1, assim todas as alterações ficam unificadas em meu template. No entanto, o método 2 pode ser útil para ajustes rápidos e pequenos.

Com base nas vantagens e desvantagens, você pode analisar qual é o método que se adaptar melhor à sua necessidade.

O que eu posso alterar através do CSS?

Agora que você já sabe como realizar as alterações em seu CSS, é hora de saber o que você pode alterar através dele. As possibilidades são imensas: segundo a definição do próprio Blogger, é possível alterar “quase todos os aspectos da aparência do seu blog” através do CSS.

Um exemplo bastante simples para você testar é a alteração das cores dos links em seu blog. O código abaixo (apenas como exemplo) fará com que os links do blog apareçam na cor vermelho e em negrito, e os links já visitados apareçam em verde. Os links visitados também aparecerão em negrito justamente pelo efeito “cascata” dado pelo CSS: os estilos podem ter ligação entre si e herdar as características de outros estilos.
a:link {
color:red;
font-weight:bold;
}
a:visited {
color:green;
}
Como as possibilidades de customização são grandes e o assunto é complexo, indicarei dois artigos para quem desejar se aprofundar no assunto e realizar customizações em seus blogs:
  • O que posso fazer com a CSS? - Este é um artigo que faz parte da ajuda oficial do Blogger. Nele, há indicações sobre os pontos principais que você pode customizar em seu blog com o uso de CSS.
  • Índice: 10 aulas de CSS para Blogger - Aprenda CSS - Nesta ótima série de artigos que o João Elias Godoi escreveu no Diretório Blogger, você encontrará 10 lições rápidas explicando como alterar algumas características de seu blog. É uma ótima leitura para quem está começando!

Conclusão

O CSS é um recurso poderoso no Blogger (e também em outras plataformas de blog ou sites). Para quem deseja realizar ajustes em seu blog e diferenciá-lo de outros, é essencial conhecer o recurso e saber como utilizá-lo. E para quem deseja levar a sério a customização e mesmo criação de templates, é essencial conhecer bem todas as possibilidade do CSS.


E você, já conhecia essas formas de aplicar as alterações no CSS do seu blog? Qual método você prefere utilizar? Compartilhe com os demais deixando um comentário!

layout 42883634287942336

Postar um comentário

  1. Olá Adelson, bom dia! :)

    Maravilhoso o artigo, como sempre! Repleto de informações importantes e úteis.
    Eu não conhecia esta terceira opção de hospedar tudo em um arquivo a parte, confesso que me sinto insegura com relação a isso. Mas tudo é questão de experimentar, não é mesmo.
    Também não sabia que as alterações feitas na ferramenta do blogger não ficavam gravadas... Isso é muito importante.
    O método que utilizo é o de fazer as alterações direto no Html, como lhe disse anteriormente, gosto muito desta forma de alterar as configurações, porque quando passamos a entender melhor como funciona, é possível fazer várias personalizações interessantes e deixar nosso blog do jeitinho que a gente quer :)
    Vou visitar os links que indicou, pois constantemente estou mexendo no Css do meu blog, e todo tipo de informação é válida e bem vinda :)

    Obrigado por compartilhar conosco seus conhecimentos, estas explicações sem dúvidas vão ajudar a muitos! Recebo vários contatos de pessoas que tem dificuldades nesta área, vou indicar seu artigo nestas ocasiões :)

    Grande abraço e boa semana!

    ResponderExcluir
    Respostas
    1. Olá, Sam!

      Você é um ótimo exemplo de quem consegue utilizar muito bem os recursos que o CSS oferece no Blogger. São justamente essas customizações que diferenciam nossos blogs dos demais e permitem que eles fiquem exatamente como desejamos.

      Apesar das outras opções, eu também prefiro fazer as alterações diretamente em meu HTML. O método de fazer a configuração no Blogger é interessante, mas seria mais útil se ele armazenasse a informação mesmo após alterar o template. Assim, poderíamos trocar o template sem perder as customizações.

      E espero que você goste dos artigos indicados! Eu os achei bastante interessantes.

      Muito obrigado por contribuir com sua opinião e enriquecer o artigo!

      Um abraço!

      Excluir
  2. Bom artigo! Muito útil, principalmente, para aqueles que estão começando e gostam de tentar personalizar seus templates por sua própria conta e risco, rs!

    ResponderExcluir
    Respostas
    1. Olá, Hannah!

      Que bom que tenha gostado! A minha intenção foi justamente mostrar o caminho das pedras para quem sempre quis trabalhar com CSS mas tinha receio.

      Um abraço!

      Excluir
  3. Olá Adelson!

    Como não parabenizá-lo por mais este artigo? rsrs Como sempre, publicando artigos que fazem toda a diferença para nós, seus leitores e fãs! Meus parabéns!

    Tenho estudado um bocado sobre CSS para customizar melhor meu template, que no caso, optei pela 1ª opção também. E recentemente, comecei a utilizar algumas linhas de CSS direto no HTML do artigo à ser publicado, conseguindo desta forma uma customização específica a algum trecho, ou em algo que seja necessário apenas ali, e não no template inteiro, (onde teria que “decorar” várias span’s e/ou id’s).

    Para isso, no início do HTML, (ou onde se faça necessário), insiro o código correspondente à mudança que preciso entre as tags <style type="text/css"> (Tag de abertura) e </style> (Tag de fechamento).

    Como exemplo, posso mostrar como está a customização atual dos links no meu blog:

    <style type="text/css">

    a:link, a:active {
    text-decoration: none;
    color: #0B5394;
    }

    a:visited {
    text-decoration: none;
    color: #CC0057;
    }

    a:hover {
    text-decoration: underline;
    color: #3E85C6;
    background: #9DC4E6;
    }

    </style>

    No mais, só fiquei com uma leve dúvida: “No caso da 3ª opção, o CSS nativo do template teria ‘preferência’ sobre o CSS linkado externamente ou o contrário é que seria válido?”

    Pois se for o “contrário”, seria uma boa alternativa para uma possível troca de templates sem a necessidade posterior de edição no CSS do novo template. Bastando apenas inserir a linha com o link do meu CSS hospedado no Webs.

    Estou correto em meu raciocínio?

    Abraços.

    Ps.: Foi no artigo acima citado que conheci o Notepad++, e depois disso minha vida se tornou muito melhor! rsrs Hoje, o Notepad++ é o editor de texto padrão em meu PC, assim como utilizo tbm a versão portable no pendrive, e em ambos os locais, adicionei alguns plugins que o incrementa ainda mais, como o plugin “WebEdit”, que deixa várias tags como botões na barra de menu, acelerando a inserção dos códigos mais utilizados em HTML.

    ResponderExcluir
    Respostas
    1. Olá, Samej!

      Obrigado pelos elogios!

      Você foi bem criativo ao customizar o CSS diretamente em seus artigos! Eu não havia considerado essa hipótese.

      Quanto à sua pergunta, tem preferência o último CSS encontrado, pois ele sobrescreverá os valores anteriores. Assim, se você hospedar o seu arquivo de CSS e colocar sua referência após o fechamento da skin, é ele que terá a preferência. Dessa forma, sua ideia de armazenar nele as customizações e permitir a troca do template é válida.

      Com relação ao Notepad++, é uma das ferramentas que mais uso aqui também! É útil demias!

      Um abraço e obrigado pela ótima colaboração com o artigo!

      Excluir
  4. Olá, Adelson!

    Um artigo realmente fantástico, esse! Recentemente hospedei a CSS do meu blog e percebi uma mudança drástica no carregamento da página. No entanto, na hora de realizar a modificação, o Blogger apresenta um empecilho: as variáveis. Foi preciso excluí-las do código e inserir os valores que elas possuíam dentro das regras CSS.

    Ex.: Variável:
    ""
    Regra CSS:
    ".seletor {background: $(bg.example);}"

    Fiz alguns testes e, pelo que pude notar, não adianta inseri-las no documento CSS que será hospedado nem deixá-las no HTML do template. É realmente preciso removê-las. Mas é necessário, antes disso, que o usuário insira os valores que elas contêm dentro das regras CSS. Como? Simples:

    Basta acessar o blog, visualizar o código-fonte (Ctrl+U) e copiar tudo o que estiver entre as tags "style id='page-skin-1' type='text/css'" e "/style" e colar em um arquivo que será salvo com a extensão '.css'. Quando se acessa o código fonte da página, os valores das variáveis já são inseridos nas regras CSS. Só após fazer isso é que se pode removê-las do template.

    Um detalhe importante é que, em minha opinião, esta modificação deve ser feita apenas por usuários experientes em CSS, pois, ao remover as variáveis do HTML, a única opção que resta da guia Avançado do Designer de Modelo é "Adicionar CSS".

    Quanto ao serviço a ser utilizado, uso e recomendo a Dropbox, uma vez que pode-se editar o arquivo direto do dispositivo em que o programa estiver instalado.

    Mais uma vez, foi um artigo bem completo! Um abraço!

    ResponderExcluir
    Respostas
    1. Olá, Felipe!

      Antes de publicar este artigo, eu realizei testes de velocidade de carregamento com o Full Page Test do Pingdom Tools e o resultado foi praticamente o mesmo em todas as configurações de CSS que fiz. Por esse motivo, não citei a velocidade de carregamento como uma das vantagens - embora eu tenha lido artigos afirmando isso.

      Com relação à sua dica, é bastante útil! Obrigado por complementar o artigo.

      Um abraço!

      Excluir
  5. Boa tarde Adelson!
    Estou impressionada com esta aula de CSS... pois posso dizer que não entendo quase nada disso de códigos e mudanças da estrutura no próprio HTML. Mas agora me senti segura para fazer umas reformas lá no meu blog. Vou começar pela segunda opção, que me pareceu mais fácil, uma vez que não é necessário ingressar diretamente no código HTML do Template. Já entrei lá algumas vezes, mas morrendo de medo de estragar tudo..rsrs

    Eu queria apenas mudar os títulos dos Gadgets, colocando-o em retângulos para ficar mais organizadinho, assim como é no Gerenciando Blog que eu acho o máximo. Acho que vou conseguir na segunda opção, que me parece bem tranquila. Mas a desvantagem é que não fica gravado no Template, porém para mim, não há problema. Vou tentar colocar em azul marinho e branco, que são as cores do meu blog... Se eu vou conseguir não importa, pois o que interessa é tentar! Afinal quem não arrisca não petisca!!! rsrs

    Gostei muito da aula! Aqui aprendo coisas preciosas!
    Abraços amigo!
    Uma semana maravilhosa!

    ResponderExcluir
    Respostas
    1. Olá, Adriana!

      Fico feliz em saber que o artigo a incentivou a realizar as mudanças!

      O método 2 é realmente o mais simples, especialmente para quem deseja começar a realizar as alterações. Ele é também mais simples de ser revertido, pois basta apagar as customizações que foram inseridas.

      Um abraço!

      Excluir
  6. Nossa muito interessante seu artigo
    Costumo usar o método 1 citado, mas não sabia que tinha mais possibilidades de aplicar CSS no Blogger
    Acho que vou estudar os outros métodos citados e quem sabe aplicar no meu blog.

    ResponderExcluir
    Respostas
    1. Olá, André!

      O método 1 é o mais conhecido e mais utilizado, especialmente no Blogger. Mas, achei interessante divulgar os outros, para que cada um possa escolher o método que melhor se adapta à sua necessidade.

      Um abraço!

      Excluir
  7. Olá Adelson!

    Umas das coisas que mais tive dificuldade durante o desenvolvimento do meu blog, era o CSS. Ainda aprendo todos os dias, mas realmente eu era uma negação. Pois como uso um template personalizado, tive que aprender a mexer no CSS presente nele para deixá-lo do meu agrado. Nada que um bom estudo e um bom site não possa ajudar.

    Recomendo o site no link acima para qualquer tipo de usuário, pois há muitos exemplos e ainda é possível editar os exemplos presentes no site para vê-lo em funcionamento.

    Fiquei espantando com o que é possível criar/modificar usando apenas CSS.

    A dica do Samej é muito boa. O Notepad++ te salva, principalmente se o código for um pouco extenso, e, ainda que queira hospedar em algum servidor.

    Atualmente eu uso o Dropbox para hospedar alguns scripts para o blog. Desde sua criação, ele vem caindo no gosto dos usuários e está sempre em atualização.

    Abraço!

    ResponderExcluir
    Respostas
    1. Olá, Edigley!

      Conhecer CSS é essencial para quem deseja customizar seus blogs! Não é simples dominá-lo, mas quem consegue fazê-lo é capaz de deixar seu blog exatamente como deseja.

      O link que você cita é uma das melhores e mais completas fontes sobre CSS! Obrigado pela colaboração.

      Um abraço!

      Excluir
  8. Olá Adelson! Pra variar, mais uma postagem show de bola!

    Desculpe invadir este espaço com uma dúvida que talvez devesse se colocada em outro tópico, mas não encontrei um mais apropriado.

    Quando digito no campo de busca do Google "site:www.pediatriabrasil.com.br", aparece uma lista de todas as postagens, mas apenas com data e nome do blog. Fiz um teste com "site:www.gerenciandoblog.com.br" e aparecem os títulos das postagens, tudo direitinho.

    Como faço para consertar isto?

    Abrãços, Marcelo.

    ResponderExcluir
    Respostas
    1. Olá, Marcelo!

      Obrigado pelo elogio!

      Quanto à sua dúvida, vou abrir uma exceção e publicá-la aqui, pois é interessante. Note que, quando você faz a busca referente ao seu blog, as páginas que são mostradas são as páginas "archive", que mostram os artigos de determinada época. Por padrão, essas páginas são também indexadas pelo Google - e não consigo entender o motivo, pois só atrapalham.

      Nas alterações de SEO liberadas há algum tempo no Blogger, é possível determinar que essas páginas não sejam indexadas. Falei sobre isso no artigo SEO no Blogger: Tags de robôs personalizadas.

      Espero que o ajude!

      Um abraço!

      Excluir
  9. Olá, Adelson
    Tenho acompanhado seu blog há um tempinho e não tenho palavras para dizer o quanto ele é ótimo. Sempre aprendo muito aqui.

    Talvez você já conheça, mas, como não vi esta referência por aqui, vim deixar a sugestão:
    o site Codecademy ensina desde HTML bááásico, CSS, até construir sua própria página (além de oferecer cursos em programação e outros), tudo grátis. O conteúdo está em inglês, mas em breve terá mais informações em português.
    É de uso muito simples, basta um breve cadastro com e-mail e senha para começar a estudar. Tem me ajudado bastante.
    http://www.codecademy.com/pt/tracks/web

    Obrigada por tanto conhecimento compartilhado!
    Um abraço,
    Marcella

    ResponderExcluir
    Respostas
    1. Olá, Marcella!

      Muito obrigado pelos seus elogios! E obrigado também pela indicação dos links: são mesmo uma ótima fonte para aprender.

      Um abraço!

      Excluir
  10. Sinceramente, eu estava desprezando o CSS só porque tinha aquelas tags {} e pensei que seria impossível aprender, mas pude ver o quanto é importante ter ela no blogger, já que com o CSS é possível fazer uma "autoformatação" para os posts (e até mesmo configurar cores com degradês em DIVS sem precisar usar uma imagem para isso).

    Bacana a dica de chamar externo também, Adelson, pois isso faz com que o Google, na sua indexação, não tenha que ler "quilométricos" códigos!

    Parabéns pela postagem!

    ResponderExcluir
    Respostas
    1. Olá, Wallace!

      O CSS é realmente um recurso poderosíssimo para todos sites e blogs! Vale a pena aprender a utilizá-lo para descobrir todo seu potencial.

      Um abraço!

      Excluir
  11. Boa dica! o CSS é parte fundamental nos Blogs, pois como dizia um escritor Brasileiro: "As feias que me perdoem, mas beleza é fundamental" rsrsrs eu diria assim: "Os blogs feios que me perdoem, mas beleza é fundamental". E essa beleza se consegue mexendo no CSS do site, blog ou qualquer página.

    No meu site AmarinoBlogger.com eu publiquei ano passado uma postagem falando de duas linguagens que os blogueiros precisavam aprender :) CSS e HTML .

    Abraço!

    ResponderExcluir
    Respostas
    1. Olá, Guilherme!

      Realmente, o CSS oferece ótimos recursos para "embelezar" nossos blogs! :-) Um visual atraente é mesmo uma ótima forma de chamar a atenção dos leitores.

      Um abraço!

      Excluir
  12. Boa Tarde Adelson,

    Seguindo a dica encontrada na internet, retirei a navbar do meu blog www.nitportalsocial.blogspot.com
    Realmente ela não aparece mais, porém agora não sei mais como faço para acessar as ferramentas do blogger e as páginas dele.
    Você poderia me ajudar?
    Acessei designer do modelo, avançado, acessar CSS (2) e coloquei #navbar-iframe { height: 0px; visibility: transparent; display: transparent; }
    Me ajude, por favor amigo!
    Um abraço,

    Ana Porto
    Nit Portal Social

    ResponderExcluir
    Respostas
    1. Olá, Ana!

      Basta acessar o endereço http://www.blogger.com para acessar o seu blog.

      Um abraço!

      Excluir
    2. É sempre o vício do cachimbo, amigo... A facilidade ao alcance de nossas mãos! Não acessava o blog através do endereço acima e então fiquei perdida. Me responda: tenho como voltar com a navbar? A alteração foi feita através do CSS (2) do modelo avançado.
      Agradeço por sua ajuda, amigo!

      Ana Porto

      Excluir
    3. Olá, Ana!

      Neste caso, basta acessar o endereço que lhe falei e seguir as instruções para chegar novamente as instruções para chegar à mesma tela. Lá, basta apagar as instruções que você colocou na caixa "Adicionar CSS" e salvar.

      Um abraço!

      Excluir
  13. Olá Adelson, como vai? Gostaria de adicionar um recurso no meu blog, mas ainda não sei como. Procurei por edição de CSS mas não sei como fazer. Veja só: meu blog é de matemática e nele tem um script para inserção de fórmulas em LaTeX. Eu queria inserir logo acima, ou abaixo da caixa de comentários um outro script que permite o leitor testar o código LaTeX antes de publicar. Vou deixar alguns links para entender e caso possa me ajudar, ficarei muito agradecido.

    Blog: http://obaricentrodamente.blogspot.com.br

    Link do script que desejo inserir: https://sites.google.com/site/sitebaricentrodamente/arquivos-do-blog/script_test_latex.txt?attredirects=0&d=1

    Link de como fica o script após inserido: http://obaricentrodamente.blogspot.com.br/p/latex.html

    Obrigado e um abraço.

    ResponderExcluir
    Respostas
    1. Olá, Kleber!

      O processo para fazer a configuração será bem similar ao que mostrei no artigo Como colocar anúncios AdSense no meio dos artigos do Blogger, na "Situação 1".

      Só mudará o ponto do HTML onde você deverá inserir o script. Procure no código pela área dee comentários e coloque seu script antes dela.

      Um abraço!

      Excluir
    2. Obrigado Adelson. Obrigado por sua disposição em auxiliar a todos nós. Grande abraço!

      Excluir
  14. Olá Adelson. Creio que um problema que muitos Blogueiros têm no Blog, mas, não desconfiam, é uma otimização na exibição de CSS, sugerida pelo PagesSpeed Insights. Como alterar o CSS é complicado para os leigos. Deixo abaixo o trecho da referida sugestão, que, por ser genérica, deve estar afetando muitos blogs, e a pergunta se você poderia dar uma solução para implementá-la.


    Eliminar Javascript e CSS de bloqueio de renderização no conteúdo acimo da borda.

    Sua página tem 2 recursos de CSS de bloqueio. Isso causa um atraso na renderização de sua página.

    Nenhuma parte do conteúdo acima da dobra em sua página seria renderizado sem aguardar o carregamento dos seguintes recursos. Tente adiar ou carregar de maneira assíncrona os recursos de bloqueio, ou incorpore in-line as partes fundamentais desses recursos diretamente ao HTML.

    Otimize a exibição de CSS dos seguintes itens:

    http://www.blogger.com/static/v1/widgets/305307800-widget_css_mobile_2_bundle.css

    http://www.blogger.com/dyn-css/authorization.css?targetBlogID=5892131552579556950&zx=4e01d267-2483-48ae-a5c5-98a43dd80ce2


    ResponderExcluir
    Respostas
    1. Olá, Marcelo!

      Infelizmente, até onde sei não é possível fazer nada a esse respeito. Como se tratam de códigos CSS do próprio Blogger, não temos como intervir nisso para fazer as melhorias citadas pelo PageSpeed.

      Um abraço!

      Excluir
  15. Olá Adelson, Estou com o problema que o Marcelo Pintor falou acima, como resolver?

    Obrigado !

    ResponderExcluir
    Respostas
    1. Olá, Claudinei!

      Acabo de responder à dúvida do Marcelo. Mas, infelizmente não tenho uma boa notícia para vocês.

      Um abraço!

      Excluir
  16. ola adelson!!,gostei muito desse artigo ,mas não consigo encontrar meu código ccs você poderia me ajudar ??

    ResponderExcluir
    Respostas
    1. Olá, Cynthia!

      Basta você entrar em "Modelo" e depois em "Editar HTML". Você encontrar o seu CSS abaixo da linha b:skin

      Um abraço!

      Excluir
  17. Em pimeiro lugar quero dizer que gostei muito deste artigo.
    Gostaria de colocar logo abaixo do título do meu log um banner que criei, tenho o código HTML mas não sei como fazer o código pode ser inserido como Gadget, mas só que após o título não têm nenhum Gadget, após o título têm o menu principal. Me ajude, por favor.
    Aguardo resposta o mais breve possível.

    ResponderExcluir

Os comentários são muito bem vindos e importantes, pois enriquecem o conteúdo dos artigos. Há algumas regras na Política de Comentários que devem ser seguidas para que seu comentário seja publicado. As mais importantes:
- Não serão publicados comentários que não tenham relação com o artigo.
- Não respondo comentários por e-mail. Por isso, não deixe seu e-mail no comentário. Se você quer a resposta por e-mail, assine com a sua Conta do Google e marque a caixa "Notifique-me".
- Pedidos de visitas ao seu blog não serão publicados.
- Não serão publicados comentários que tenham link ou endereço do blog no corpo do texto. Para isso, assine com seu Nome/URL ou OpenID.

emo-but-icon

Início item

Acompanhe as novidades

Contrate nossos serviços

Divulgue o Gerenciando Blog

Gerenciando Blog - Dicas para blogs

Publicidade


Anuncie aqui