Código do item acima:
        <div style="padding-left:5px" class="container">
            <a href="#" title="Header" data-toggle="popover1" data-placement="top" data-content="Content">Topo</a>
            <a href="#" title="Header" data-toggle="popover1" data-placement="bottom" data-content="Content">Rodapé</a>
            <a href="#" title="Header" data-toggle="popover1" data-placement="left" data-content="Content">Esquerda</a>
            <a href="#" title="Header" data-toggle="popover1" data-placement="right" data-content="Content">Direita</a>
        </div>

        <script>
            $(document).ready(function () {
                $('[data-toggle="popover1"]').popover();
            });
        </script>




Nota : O ruim deste tipo de popup é que não tem como fechá-lo.

---

Código do item acima:
        <div style="padding-left:5px" class="container">
            <a href="#" title="popover amigavel" data-toggle="popover2" data-trigger="focus" data-content="Clique em qualquer lugar para fechar este popup">Clique aqui</a>
        </div>

        <script>
            $(document).ready(function () {
                $('[data-toggle="popover2"]').popover();
            });
        </script>


Note que se clicar num item abre um popup com mensagens e a seguir vai para o link de destino.