Eu já mostrei aqui no blog como inserir um botão Voltar ao topo deslizante.
Recorde aqui:
Botão voltar ao tpo com efeito scroll (igual do Pinterest)
O botão funciona que é uma beleza, mas sua instalação requer seguir 3 passos.
Neste que vou mostrar agora a instalação é muito mais simples e fácil.
Para ter em seu blog faça assim:
Acesse o painel administrativo do seu blog e clique na aba Layout.
Clique então em Adicionar um gadget e escolha a opção HTML/JAVASCRIPT.
Na caixa que expandir cole este código:
Onde marquei em vermelho (AQUI VOCÊ COLA O ENDEREÇO DE SUA IMAGEM ) é onde você coloca o endereço de seu ícone ou botão Voltar ao topo.
*Como hospedar uma imagem usando o próprio Blogger?
Faça assim:Crie uma postagem 'falsa', que nunca será publicada, ficando sempre no rascunho.
Insira nela a imagem que deseja hospedar. Depois de concluir o upload da imagem clique sobre ela e com o botão direito do mouse copie o endereço, url ou link da imagem (o nome dependerá de qual navegador esteja usando); este é o endereço web de sua imagem.
Abaixo fiz alguns botões de presente para você usar.
Salve em seu pc, hospede como ensinei acima e use à vontade em seu blog.
Não copie este post e nem repasse as imagens em seu blog. Se acredita que o tutorial será útil aos seus leitores indique através de um link como chegar aqui.
Ajude o blog a crescer, compartilhe esse tutorial, curta, recomende...
Eu fico muito agradecida...
49 comentários via Blogger
Dias online
Postagens
comentários
Adorei! Já adicionei no meu blog, este site é excelente, o melhor que encontrei até o momento!
ResponderExcluirVerdade Caroline
ExcluirConcordo com ambas...
ExcluirOi Elaine, tudo bem? Posso às vezes ou sempre, não comentar, mas compartilho tudo, nunca se sabe quem está precisando, não é?
ResponderExcluirEstou feliz com você aí "firmona", te amo e agradeço por compartilhar dicas muito especiais.
Abraços carinhosos
Maria Teresa
Gostei imenso. Nem acredito que consegui fazer, eu que sou um calhau com olhos. Muitíssimo obrigada.
ResponderExcluirUm abraço
Oi Elaine
ResponderExcluirSou tão Sá Burrinha que não consegui, fui bem até o ponto- "aqui você cola o endereço de sua imagem"., que imagem é esta?
Se puder me esclarecer vou adorar.
Um beijo.
Maria Célia, é o endereço da imagem que você escolher para ser seu botão.
ExcluirVeja onde explico sobre como hospedar imagens e você entenderá.
beijossss
Eliane, amei suas dicas. obrigada.
ResponderExcluirbjs cristalinos
Elaine, parabéns pelo blog!
ResponderExcluirEstá crédito no meu!
http://mdesarrumado.blogspot.com.br/
Olá Elaine,
ResponderExcluirEm primeiro lugar quero dar-te os parabéns pelo excelente blog que tens e pela excelentes dicas que dás :).
Graças ás tuas dica consegui colocar finalmente o meu blog como queria. OBRIGADA!! :)
Beijinhos
http://www.1fashionblog.co.uk/
http://www.youtube.com/user/myfashion1blog
Olá Elaine,
ResponderExcluirQue maravilha!! Tanto que procurei essa ferramenta e não encontrava. Os leitores e seguidores do BLOG DO PARCEIRO sofriam demais quando chegam lá no blog pra lerem as postagens.
A partir de hoje, 18/03/14, eles não irão mais ter esse problema, graças a essa postagem.
PARABÉNS!!
Aguardo a sua visita: http://josenidelima.blogspot.com.br/
Oi Elaine, acabei de iniciar meu blog sem muita pretensão,porém quero que seja bonito e organizado e você está me proporcionando isso com suas dicas.
ResponderExcluirA primeira tentativa já deu certo e com isso fiquei muito mais animada para deixar o meu cantinho com a minha personalidade estampada.
Obrigada mesmo.
Copiei a url do site lá , espero que eu tenha feito certo. Vou melhorar com o tempo e dedicação.
Forte abraço e que Deus proteja sempre.
Meu bebê está nascendo ainda mas se quiser ver a evolução com as suas dicas vou amar a visita.
http://blogsemprekisdaluanda.blogspot.com.br/
Oii Elaine usei um de seus modelinhos, obrigada pela ajuda
ResponderExcluirhttp://defataprincesinha.blogspot.com.br/
Oii Elaine usei um de seus modelinhos, obrigada pela ajuda
ResponderExcluirhttp://defataprincesinha.blogspot.com.br/
Oiiii Elaine comecei hoje meu blog e já aprendi muito com vc , obrigada por compartilhar o que sabe, usei uma imagem sua de Subir ao topo ficou um charme .. bjaum
ResponderExcluirhttp://defataprincesinha.blogspot.com.br/
OOi
ResponderExcluirGosto muito do seu Blog.
Estou com u Blog em construção, então sempre to dando uma olhadinha aqui, pois gosto muito das dicas.
Gostaria de saber se poderia me ajudar em uma questão que estou quebrando a cabeça, se tiver em seu blog desculpe perguntar mais não encontrei.
Gostaria de saber como eu redireciono para outra pagina dentro do blog mesmo. mais clicando em um ícone. Por exemplo; faço um resumo de tudo sobre o blog so que não termino e no final coloco LEIA MAIS, ai se a pessoa quiser saber mais sobre o blog ela clica e é direcionada a pagina ''Sobre'' e assim lendo o final do post.
Muito Obrigada gostaria de fazer isso com Gadget, para icar no lado da tela.
agradeço des. de já
beijos
Sempre dando as melhores dicas, obrigada!
ResponderExcluireueminhacultura.blogspot.com.br
Não consegui colocar nem este botão e nem o botão da fanpage em forma de pop-up, e simplesmente copiar o código para um layout HTML ou tem de mexer no HTML do blog ?
ResponderExcluirOiii...estou amando as dicas no seu blog...haaa eu peguei para por no meu o desenho numero 5.
ResponderExcluirAgora irei tentar colocar a barra de menu =D
Beijos
Gurias Gata
Muito obrigada. Amei seu blog.. nossa, é muito útil pra gente rs bjs
ResponderExcluirBoa noite Elaine, eu adoro seus posts, estou sempre aqui dando uma olhadinha e vendo o que eu posso melhorar no meu "bebê blog".(já que tenho ele a menos de um mês) Você com seus posts mim ajudou bastante. Obrigada pela ajuda. E Parabéns pelo seu trabalho.
ResponderExcluirOi Elaine, parabéns pelo seu blog e por disponibilizar esses materiais pra gente. Eu achei um mais fofo que o outro. Beijos e muito sucesso
ResponderExcluirwww.blogdaandrezza.com.br
Obrigada,levei o vasinho de flores.Parabéns pelo trabalho.
ResponderExcluirTenha uma semana abençoada.
Ótimo tutorial, me ajudou muito, parabéns!! <3
ResponderExcluirMuito obrigada mesmo! Ajudou muito no meu blog! Obrigada mesmo , estou muito grata! :)
ResponderExcluirFicou ótimo!!
ResponderExcluirMuito bom! Bastante simples! www.penseicerto.blogspot.com
ResponderExcluirOi Elaine, vc poderia ensinar como colocar esses botões que fica no fim de cada postagem, como curtir compartilhar e tal? Obrigada, beijos.
ResponderExcluirno meu blog não aparece a imagem desejada, mais aparece um icone que se clicar nele sobe ao topo (normal), mais a imagem que deveria aparecer nao aparece.
ResponderExcluirOi Elaine ! Você é incrível no que faz ! Obrigada por disponibilizar esses botões , eu usei dois desses nos meus blogs . Eu estou aprendendo com você, como deixá-los com um visual legal . Algumas dicas já coloquei em prática , mas não deu certo :( ,. mas depois vou tentar novamente .
ResponderExcluirAdorei o tutorial. Deu super certo!!! amei
ResponderExcluirestantevip.blogspot.com.br
Adorei Elaine, escolhi para o meu blog o beijinho vermelho, mas já adianto que amei todos.
ResponderExcluirBeijo e obrigado pelas ajudas, sempre que preciso te encontro pelo google.
Beijo, Vivi
http://coisasdavv.blogspot.com.br/
Ficou perfeito, você é fera obrigado.
ResponderExcluirbeijinhos
http://eueminhasplantinhas.blogspot.com.br/
Adorei!!! Já peguei um! Bjo e dá uma passadinha no meu blog!
ResponderExcluirhttp://vemveramiga.blogspot.com.br
Amei essa dica, deixou o blog muito fofo
ResponderExcluirOi Elaine, tudo bem?
ResponderExcluirEu usei o código que você disponibilizou e deu certo, a imagem aparece e tudo.
O problema é que só tem a imagem, ela não leva novamente para o topo... O que pode ser?
Beijos
Adorei essa dica e já estou utilizando no meu blog. bjs
ResponderExcluirhttp://costureirainiciante.blogspot.com.br/
Amei, estou usando no meu blog :) ficaria muito feliz se vocês dessem uma olhadinha no meu <3
ResponderExcluirhttp://blogpequenocorvo.blogspot.com.br/
Ei Elaine,mais um tutorial top!
ResponderExcluirJá adicionei ao meu blog.
Muito obrigada.
Bjs
www.vireimoda.com
Show de Bola Elaine excelente !
ResponderExcluirhttp://www.dicadeblog.com.br/2016/03/os-melhores-programas-de-afiliados-para.html
Fiz com suas dicas e deu certinho =) tambem peguei sua imagem das flores na cestinha tá, espero que não se importe. Seus tutoriais me salvam sempre.
ResponderExcluirObrigada, beijosSs..
http://receitascasosehistorias.blogspot.com.br
O meu não aparece... Fica só com um quadradinho com um X no meio, mas a imagem não quer aparecer :´(
ResponderExcluirPerfeito, muito obrigado!!!
ResponderExcluirhttps://golbolinhaecia.blogspot.com.br
Gentiiii, amo esse blog... Ajuda muito qualquer blogueira, seja iniciante ou aqueles que estão ao um bom tempo na rede.
ResponderExcluirObrigadaaaa pela ajudaaa
aqueles que quiserem conhecer meu cantinho acessem
mulhercristaeseular.blogspot.com.br
Bjinhus
Adorei!!
ResponderExcluirEstava precisando de um mesmo,porque eu exclui o meu blog e fiz outro.kkk
Os seus tutoriais estão me salvando aqui :)
No meu não deu certo por causa do selo de segurança, ele não permite esse codígo, alguém puderia me indicar um compativel, desde já fico grato http://vai.la/oytf
ResponderExcluirMeu Slider para de funcionar por causa deste código '- e o mais simples não funfa!
ResponderExcluirOi!
ResponderExcluirFiz conforme a explicação, mas a imagem que está no botão não aparece. Pode me ajudar?
Beijos
http://tudoqueeuli.blogspot.com
Erica, a imagem não aparece porque você apagou as aspas do endereço dela. Confira seu código e faça a correção...
Excluir