loading...





 Botão - Post Aleatório



Funcionalidade: Botão Post Aleatório
Plataforma: Blogger
Dificuldade de Implementação: Baixa


Implementação:

1º - Comece por abrir o painel de controlo do seu blog.
2º - Vá até ao separador esquema.
3º - Clique em adicionar uma Miniaplicação.
4º - Escolha a HTML/JavaScript
5º - Dentro desta cole o código abaixo.

<div id="aliatoryPost"></div>
<span id="preserve0494d138efe349cc96867b72108cbb45" class="wlWriterPreserve">
<script type="text/javascript">
    function showLucky(root) {
        var feed = root.feed;
        var entries = feed.entry || [];
        var entry = feed.entry[0];
        for (var j = 0; j < entry.link.length; ++j) {
            if (entry.link[j].rel == 'alternate') {
                window.location = entry.link[j].href;
            }
        }
    }
    function fetchLuck(luck) {
        script = document.createElement('script');
        script.src = '/feeds/posts/summary?start-index=' + luck + '&max-results=1&alt=json-in-script&callback=showLucky';
        script.type = 'text/javascript';
        document.getElementsByTagName('head')[0].appendChild(script);
    }
    function feelingLucky(root) {
        var feed = root.feed;
        var total = parseInt(feed.openSearch$totalResults.$t, 10);
        var luckyNumber = Math.floor(Math.random() * total);
        luckyNumber++;
        a = document.createElement('a');
        a.href = '#random';
        a.rel = luckyNumber;
        a.onclick = function () {
            fetchLuck(this.rel);
        };
        a.innerHTML = '<p><img style="border-right-width: 0px; display: block; float: none; border-top-width: 0px; border-bottom-width: 0px; margin-left: auto; border-left-width: 0px; margin-right: auto" title="Ver Post Aleatório" border="0" alt="Ver Post Aleatório" src="https://dl.dropboxusercontent.com/u/3883727/CarlinhosExplica/FuncionalidadesPosts/images/aliatorio.png" width="120" height="120" /></p>';
        document.getElementById('aliatoryPost').appendChild(a);
    }
</script>
</span> 

<span id="preserved0d51eabe3024fba8115ec3460b82bbb" class="wlWriterPreserve">
<script src="/feeds/posts/summary?max-results=0&alt=json-in-script&callback=feelingLucky"></script>
</span>



6º - Pode agora alterar a imagem do botão, basta para isso que coloque o url dessa imagem no scr do código acima e que está a vermelho.

Pronto agora é só guardar e testar. Se ficar a seu gosto, deixe como está. Agora os visitantes do seu blog já podem clicar neste botão e terem um post aleatório para lerem.

Espero que tenham gostado desta funcionalidade e que vos venha a servir.


1 comentários :

Enviar um comentário