Como instalar um blog fixo abaixo do blog, é realmente muito adequado para blogs que desejam adicionar mais espaços de anúncio do que antes. Como instalar Sticky Ad no blog? geralmente encontramos em sites populares ou sites que oferecem espaço publicitário, o que mais, se não, para buscar lucros com os resultados dos blogs. O que precisa ser considerado ao ter anúncios fixos em seu site é que seria melhor adicionar um botão Fechar no conteúdo de anúncios fixos para que os visitantes possam optar por fechar anúncios que consideram menos desejáveis. Tudo bem, então a partir daqui o cssmoz vai dar dicas de como instalar o Sticky Ad Below Blog da seguinte forma.
Como instalar o Sticky Ads banner abaixo do blog
Abra a página Blogger > Clique no menu Layout > Adicionar um novo widget e adicione o código abaixo no widget.
<style type='text/css'>
.stickywrap{width:100%;margin:auto;text-align:center;float:none;overflow:hidden;display:scroll;position:fixed;bottom:0;z-index:9999}
.stickyzone{text-align:center;display:block;max-width:970px;height:auto;overflow:hidden;margin:auto}
.stickyzone img{max-width:100%;height:auto;vertical-align:middle}
.stickyclose{cursor:pointer;text-align:center}
</style>
<script type='text/javascript'>
$(document).ready(function({$('img#closed').click(function(){$('#bl_banner').hide(90);});});
</script>
<div id='stickyb' class='stickywrap'>
<div><a id='close-stickyb' onclick='document.getElementById('stickyb').style.display = 'none';'><img alt='close' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh5eZDNDxs7OpqXtH11eQJXZIYM6JxBolHnntHvbveOd07ueaMyIqIFHGnskHDDToAIJEfDrSYCdIvtJJWeUjgaU9bngMZ2CtURRmbLIy-_v_EQAS6VQ9qg-ZnsR7b2h4PLW32GAwREGDlG/s1600/sevenclose.png' title='Close this ad' class='stickyclose'/></a></div>
<div class='stickyzone'>
<a href='#' title='Banner ad here'><img alt='Banner ad here' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjwkbg5SlBq4zAtv6cNTKXEuKnhSxNXcY4-mJUD4EiiHGv2Cv9ROk8bn3JBnJHtLxOkRQ2Blg5RlhumE_w8l6HPC69ier4iBs3fus5e-Hfb9QDAcsgrtJiZOcwI_bBl4FwAXs4BZUi6lm6g/s1600/sevenn.png'/></a>
</div>
</div>Edite as seções destacadas e ajuste-as no seu blog, faça com que funcione
Exemplo:
- # Link para redirecionar
- Banner
- Substitua o Link pelo da sua imagem
Depois disso, salve o widget completo e seus banners prontos. Se você deseja adicionar o código do bloco de anúncios do Google AdSense ou de outros blocos de anúncios, exclua a seção marcada no código abaixo e substitua-o pelo seu bloco de anúncios do AdSense.
<style type='text/css'>
.stickywrap{width:100%;margin:auto;text-align:center;float:none;overflow:hidden;display:scroll;position:fixed;bottom:0;z-index:9999}
.stickyzone{text-align:center;display:block;max-width:970px;height:auto;overflow:hidden;margin:auto}
.stickyzone img{max-width:100%;height:auto;vertical-align:middle}
.stickyclose{cursor:pointer;text-align:center}
</style>
<script type='text/javascript'>
$(document).ready(function({$('img#closed').click(function(){$('#bl_banner').hide(90);});});
</script>
<div id='stickyb' class='stickywrap'>
<div><a id='close-stickyb' onclick='document.getElementById('stickyb').style.display = 'none';'><img alt='close' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh5eZDNDxs7OpqXtH11eQJXZIYM6JxBolHnntHvbveOd07ueaMyIqIFHGnskHDDToAIJEfDrSYCdIvtJJWeUjgaU9bngMZ2CtURRmbLIy-_v_EQAS6VQ9qg-ZnsR7b2h4PLW32GAwREGDlG/s1600/sevenclose.png' title='Close this ad' class='stickyclose'/></a></div>
<div class='stickyzone'>
<a href='#' title='Banner ad here'><img alt='Cssmzo' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjwkbg5SlBq4zAtv6cNTKXEuKnhSxNXcY4-mJUD4EiiHGv2Cv9ROk8bn3JBnJHtLxOkRQ2Blg5RlhumE_w8l6HPC69ier4iBs3fus5e-Hfb9QDAcsgrtJiZOcwI_bBl4FwAXs4BZUi6lm6g/s1600/sevenn.png'/></a>
</div>
</div>Clique no botão abaixo para ver os resultados
Ok, isso é tudo o cssmoz para Criar anúncios flutuantes fixos com jQuery - Banner Scroll pode ser útil. Obrigado por nos visitar.
Nenhum comentário :