Novo Blogger Vanessa S.
Mudanças e Melhorias no editor HTML do Blogger
Melhorias no editor html do Blogger. A equipe do Blogger fez algumas alterações na estrutura e na organização do código fonte, melhorando completamente o editor HTML.
Quem tentou editar o html do template no dia de hoje deve ter se deparado com mudanças no editor HTML do blogger.
Dentre as mudanças verificamos algumas melhorias como a numeração de linha e destaque de sintaxe, tornando a edição HTML do seu modelo muito mais fácil.
A opção “Expandir modelos de widgets”, no novo modelo de editor HTML não é mais necessária.
No painel do Blogger, clique no menu “Modelo”, em seguida, clique no botão “Editar HTML”, para ver o novo modelo de editor HTML:
Os botões agora aparecem no topo e ficaram mais destacados:
Ficou mais fácil fazer uma pesquisa de texto, para localizar algum trecho específico. Se você clicar em qualquer parte do editor HTML e em seguida pressionar as teclas “Ctrl + F”, abrirá uma caixinha de pesquisa dentro do próprio editor HTML do Blogger.
Melhorias no editor html do blogger
Para os usuários que preferem fazer alterações no seu template, através do editor HTML, vão perceber que ficou mais fácil realizar edições.
É importante lembrar que o Blogger usa tags personalizadas e antes de começar a mexer na estrutura HTMl do seu blog, é importante estar familiarizado e conhecer Os Elementos de Página do Blogger.
Conhecendo a função de cada botão no novo editor html:
1. Voltar: fecha a tela do editor e retorna para o menu “modelo”.
2. Salvar Modelo: botão para salvar as modificações realizadas.
3. Ir para um widget: Usado para localizar um determinado widget rapidamente. Ele abre uma lista com todos os gadgets/widgets que estão instalados no seu blog.
4. Editar modelo: quando selecionado ele exibe todo o código fonte do seu blog.
5. Visualizar modelo: com este botão você visualiza as modificações que está realizando, antes de salva-las. Essa função é muito importante, pois é sempre bom visualizar as modificações antes de salvar o modelo, desta forma, se algo não tiver dado certo, você não irá salvar as modificações.
6. Formatar modelo: se você clicar neste botão e em seguida usar as teclas “Ctrl+f” abrirá a caixa de pesquisa do próprio editor, que serve para localizar tags, trechos de códigos dentro do HTML do seu template.
7. Reverter alterações: com esse botão é possível limpár todas as modificações que você realizou enquanto não tiver salvado nada, ou seja, enquanto estiver apenas no modo de “visualização”.
8. Reverter modelos de widgets para o padrão: ao clicar neste botão, você estará restaurando um modelo de template padrão do blogger, ou seja, seu template será automaticamente trocado por um template padrão do Blogger, e vai perder todas as alterações que tenha feito anteriormente.
Como localizar o Código CSS no novo editor:
Na coluna de numeração das linhas, em algumas partes você notará que aparecem um simbolo (como uma setinha preta).
Se você clicar neste simbolo verá que tem a opção de expandir/esconder determinados trechos de códigos.
Geralmente quando vamos fazer alguma alteração ou inclusão de código CSS, orientamos sempre a localizar a tag </b:skin>
Se você usar o botão “Formatar Modelo” e as teclas “ctrl+F” e colocar a tag </b:skin> dentro da caixinha de pesquisa (conforme já explicado no tópico anterior), vai conseguir localizar a linha exata onde a tag está, e verá que aparece a setinha preta, basta clicar nela que expandirá todo o código CSS existente no seu template.
Tudo o que tiver acima desta tag </b:skin> diz respeito ao trecho CSS do seu template, ou seja, o código CSS fica entre as tags <b:skin> e </b:skin>
Bom é isso.
O que acharam destas mudanças? Deixe sua opinião nos comentários.
Vanessa S.
Fundadora do Mundo Blogger. Autodidata que adora internet, que se encantou com blogs, seus códigos e templates, desde 2009, e por conta disso começou a "brincar" com web design nas horas vagas, até que resolveu criar o Mundo Blogger para compartilhar o que aprendeu com você através dos tutoriais publicados aqui.
amiga, estou tentando ha muito tempo e não consegui ainda tirar aquele nome postagem mais antigas do meu blog. olha, eu lí o seu artigo fui lá no blog, mais não consegui, procurei o dia todo e não encontrei nesse novo modelo a palavra [oldpagetitle]
que é pra apagar e colocar outra a meu gosto. me envie por email bem detalhado pra mim. abraços
Ainda não segui, procuro no meu HTML do modelo, mais não encontro o codigo.
styleemen.blogspot.com.br
Olá a todos. Tentei seguir todos os procedimentos tal como descritos nesta mensagem mas no meu caso não resultou inteiramente. Penso que o formulario na minha pagina contactos esteja a funcionar devidamente: http://besttopptcwebsites.blogspot.pt/p/contacto.html mas no final da minha sidebar ficou um restinho do gadged do formulario google, parece que está minimizado, a que se deve tal resultado?
Amei sua dicas para os blogs, só que , parece que alguns posts precisam ser atualizados para a nova interface do blogger, porquê é meio difícil encontrar as ferramentas que você cita, mais que na nova interface não existe, ou está em outro local, que não consigo encontrar! ;/
Beijos e abraços!! Continue com seu trabalho explÊndido!! 🙂
Já encontrei a resposta na sua outra postagem, “https://www.mundoblogger.com.br/2011/09/instalar-novo-template-pela-nova-interface-do-blogger.html”, mas obridada na mesma 🙂
Olá, bom dia
Ainda não tive muito tempo para mexer nesse novo interface e queria saber como é que salvo o modelo para o meu computador ? Essa opção ainda existe ? Desde já obrigada ^^.
Oi desculpas, por estar respondendo seu comentário em vez da AUTORA, mas sei a resposta para sua pergunta e pretendo ajudar.
Bom, clique em MODELO>>FAZER BACKUP/RESTAURAR(basicamente no canto superior direito perto de seu perfil)>>FAZER DOWNLOAD DO MODELO COMPLETO. ENTÃO É SÓ SALVAR!
P.S: ESPERO TER AJUDADO!! ^^’
Obrigado pelo apoio, foi muito útil suas dicas.
Tenho o blog a bastante tempo e percebi que há muito lixo no código.
Queria reiniciar tudo para instalar os widgets novamente.
Como faço isso?
Bom dia . Gostaria de sua ajuda .
Hoje eu me deparei com grande pepino, eu passei 6 meses sem sem trocar e sem altera a templete do meu blog, e hoje eu percebi que estava tudo muito diferente. (COMO MUDAR A TEMPLETE DESSE NOVO BLOGGER)?
Dá uma olhada aqui neste artigo:
Instalar novo template pela nova interface do blogger, pode ser que te ajude.
Bom dia, pow fui alterar ontem o layout do blogger e me ferrei está com um bug que não permite alterar o template.
Já tentei com 35 templates diferentes e toda hora o mesmo erro, eu entro em editar html e coloco o código de um novo template e o botão salvar modelo não funciona. :O SOCORRO!
ai o print!
Lamento, mas não tenho como te ajudar. Sugiro que vc reporte seu problema diretamente no Fórum de ajuda do Blogger.
Sera que não precisa mesmo “expandir todos os widgets”? Porque não estou localizando partes do código que vejo em tutoriais pela internet.
olá vanessa. boa noite.
me diz como faço agora para colocar uma barra derolagem na lista dos blogs que eu sigo a fim de economizar espaço.? por favor fico desde já agradecida, aguardando resposta. eliene
Dá uma lida neste tutorial:
Colocar barra de rolagem na sidebar. Pode ser que te ajude.
Ficou péssimo este novo modelo de alteração de código HTML do Blogger.
Está muito mais dificil encontrar os blocos de código, vai dificultar a evolução e criação de novas funcionalidades.
Que pena que não pode voltar para o antigo modelo.
Parabéns pelo Mundo Blogger !
Olá Vanessa
Tentei ocultar widgets em páginas específicas nesta nova interface do blogger, mas não funciona.
Ou oculta em todas as páginas ou simplesmente não oculta nada.
E olha que coloquei os códigos corretamente várias vezes nos dois blogs que tenho.
Que acontece?
Obrigado
amiga querida adoro seu blog, amor, to querendo por uma assinatura no meu blog mas adivinhe só com essa mudança o que eu faço??? kkkkkkkk não estou coseguindo pq antes era só clicar em expandir modelo de wiget e agora amiga?? que faremos?? aonde vamos clicar para por nossa assinatura? Vc sabe?? por favor me ajude!! bjuss
Parabéns pelo artigo agora estou entendendo mais ou menos essas mudanças. Obrigado 🙂
veeey de boa… esse blogger é muito maça. eu amo por que sempre me ajuda em tudo e até agora foram poucas as coisas que eu precisei e aqui não teve.
amo O Mundo Blogger
Ficou 10!!!
Eu sempre gosto de mecher nos códigos, estudá-los, e principalmente inserir outros elementos diretamente no código, isso vai facilitar e muito a edição deles.
Bem, o Blogger tentou mudar para melhor , em partes melhorou , mas esse troço ai todo colorido ficou muito mais confuso pra quem não está acostumado, espero que depois de um tempo eu me acostume com isso, mas acho que essa mudança não era necessária, talvez não dessa maneira.
Muito obrigado Vanessa.
Muito bom este artigo! Eu acho que para as pessoas que estão começando a mexer com blog agora,e ainda não fizeram aquelas primeiras edições que são necessárias no HTML isso poderá facilitar e orientar melhor,tomara que seja assim né? Abraço e sucessos a todos!!!
como faz para voltar para o editor antigo, ou não tem como mais?? poxa desse modo esta parecendo com o wordpress
Não tem como voltar mais.
Vanessa!!!
Que horror estou frita amiga!
Abri o blog esses dias e quase cai de costas amiga.
O resumo de postagens ocupando de um lado ao outro,e ocultando os menus,os folders,a imagem de joseph murphy e os formularios de contato.
Quase enlouqueci pensando que dessa vez o super layout da Ariane,havia desmoronado.
Pensei:PHUDEUUUU!
Ri alto porque atè agora a bagunça ta tomando conta,e tenho medo de mexer nos codigos para ocultar elementos e postagens,na home e esconder nas postagens internas.
Frio na barriga!
Mas em breve tudo vai voltar as boas mesmo tendo,que quebrar mais a cara.
Ser blogueiro ainda do blogger è isso!
Ai meu santinho
como faz para centralizar a imagem no novo blogger 2013, pois eu não estou conseguindo
Que imagem?
Não gostei! o blogger está igual o facebook, muda muda muda… e nada de melhorar
Me ajuda, por favor… Por que TODAS as tabelas no blogger em CSS e HTML que eu coloco ficam fora do lugar? no dream fica td certinho…
Lamento, mas alguns casos só é possível encontrar alguma resolução testando, e por não dispor de tempo para isso, no momento não estou prestando este tipo de suporte.
Acho que ficou mais complicado programar o html e inserir codigos css… Quem concorda?
Eu concordo, ficou muito mais dificil 🙁
não consigo mais achar as palavras no contra f no html, quero colocar redes sóciais nas postagens
E como faz para expandir modelos de Widgets ?
Não precisa mais.
Véi, pensei que por um momento tinha acabado o CSS. Ufa!!! Que alívio
Como instalar um template em ?????
Galera ficou muito mais fácil, ficou show !
E eu pensei que fosse algum problema no meu template. Obrigado por esclarecer essa minha dúvida cruel.
Nossa, que maravilha! Ainda não tinha visto! Isto vai facilitar, e muito, especialmente visualmente, as alterações que precisarmos fazer no editor html!
Parabéns pelo artigo, Venessa!
Abraço!
Excelente artigo,muito útil e bem explicado,já salvei,para estudar quando tiver mais tempo,é bom conhecer as funções para saber depois o que fazer,muito obrigada pelo post,abraço e sucessos!!!
Eu gostei bastante das modificações, ficou bem parecido com o editor html do tumblr! Agora ficou bem mais fácil principalmente pra quem é meio leigo no quesito HMTL!
Só o fato de terem dado destaque à sintaxe no código já dá uma mão na roda enorme! Quem nunca se confundiu com um espaço ou um par de aspas que atire a primeira pedra…
O recurso para encontrar widgets também vai facilitar muito a nossa vida, já sofri muito com isso… hahaha
Não sei se você notou também, mas quando se clica no “Visualizar modelo”, a visualização abre na própria área onde fica o código ao invés de uma guia à parte.
Yo, interessante, não abri o html do meu blog hj, mas como estava caçando um dia para atualizar uns itens, creio que agora ficou mais facil *-*, e sua explicação foi bem clara e simples, como deveria ser para todos enterdermos *-*, obrigado
Não gostei mesmo do formato da visualização, péssimo, não tem como abrir o blog, visualizar na caixinha é para ver cor, no máximo, achei ruim mesmo, interfere no layout, e não nem um pouco profissional!!!
bom dia!! muito obrigada por toda explicação adorei as alterações ficou muito mais simples e pratico.
Oi Vanessa,
Adoro seu blog, muita coisa útil e fácil de entender ainda mais para mim que sou um tanto leiga e novata em blogs.
Gostava muio mais da versão anterior do editor de html. Mais fácil
para eu achar o que queria e agora com o novo estou totalmente perdida,nem sei por onde começar. Com todas aquelas setas e letras coloridas, tenho dautonismo só de olhar.
Será que não existe meio de reverter para o anitgo?
Mais um vez obrigada e parabéns pelo site.
Não gostei, particularmente. Mas adorei o seu post, que me deu uma clareada. Aluás, adoro todo o blog, que sempre me ensinou muita coisa, parabéns!
Beijos,
Marcelle