Olá a todos.

Segue um tutorial rápido pra você que quer colocar aquele bom e velho  slide que mostra sua página do Facebook na lateral do seu site.
 

Vamos lá:
Crie um arquivo .JS, não importa o nome dele, ele só deve terminar com a extensão .js e adicione em alguma pasta do site.

Eu aconselho a criar uma hierarquia de pastas para organizar melhor seu código.
Se você utiliza gesior coloque o arquivo na mesma pasta do layouts.php para facilitar.

fb_float_plugin.js
 

Spoiler

(function(){
    var load_float_fb = function($){
        var defaults = {
                container_width:280,
                height:224,
                show_facepile:'true',
                tabs:'',
                href:''
            },
            cfg = $("#float_fb").data(),
            iframe = 'https://www.facebook.com/v3.0/plugins/page.php?',
            params = [],
            png = $("#float_fb").attr('src').replace(/\?.*/, '').replace(/[\w\.]+$/, "widget.png")
        ;
        var val;
        for(var k in defaults)
        {
            if(typeof cfg[k] === 'undefined')
                cfg[k] = defaults[k];
            val = cfg[k];
            params.push(k + '=' + val);
        }
        iframe += params.join('&');

        var status_ = 'hide'; // showing, hiding, show, hide
        $("body").append(
            ['<div id="float_fb_plugin" style="visibility:hidden">',
                '<img src="' + png + '" style="cursor:pointer;position:absolute;margin-left:-47px;" border=0 />',
                '<iframe scrolling="no" frameborder="0" allowTransparency="true"></iframe>',
            '</div>'].join(''));
        var w = $("#float_fb_plugin");

        var top_ = ($(window).height() - cfg.height)/2;
        if(top_ < 50)
            top_ = 50;
        var right_ = cfg.container_width * -1;

        var css = {width:cfg.container_width, height:cfg.height,
            position:'fixed',
            top:top_,
            right:right_,
            visibility:'visible',
            backgroundColor:'white',
            zIndex:2147483647
        };

        w.find('iframe').attr({width:cfg.width, height:cfg.height}).attr('src', iframe);

        w.css(css);

        w.find('img').hover(function(){
            if(status_ != 'hide')
                return;
            status_ = 'showing';
            w.animate({right: 0}, function(){ status_ = 'show'; });
        });

        w.mousemove(function(e){
            e.stopPropagation();
        });

        $("body").mousemove(function(){
            if(status_ != 'show')
                return;
            status_ = 'hiding';
            w.animate({right:right_}, function(){ status_ = 'hide';});
        });
    };

    // load jquery if needed
    if(typeof jQuery === 'undefined')
    {
        var run = false;
        var script = document.createElement('script');
        script.type = 'text/javascript';
        script.src = '//ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js';
        script.onload = function(){
            $.noConflict();
            run = true;
            load_float_fb(jQuery);
        };
        var head = document.getElementsByTagName('head')[0];
        if(head) head.appendChild(script);

        setTimeout(function(){
            if(!run)
                load_float_fb(jQuery);
        }, 3000);
    }
    else
        load_float_fb(jQuery);
})();

 

 

 

Após criar o arquivo é necessário informar ao site que você irá utilizar esse arquivo.

Se você usa gesior insira essa linha no seu arquivo layout.php logo antes do fechamento da TAG </body>.

Lembrando que é necessário no src="" inserir o caminho correto de onde está o arquivo.
e em data-htref deverá ter o link para sua página do facebook. ex.:  https://www.facebook.com/otservferobra/
Ficando assim:

Spoiler

	<!-- float facebook like box start -->
    <script id="float_fb" src="<?=$layout_name?>/fb_float_plugin.js" data-href="LINK_DA_SUA_PÁGINA_DO_FACEBOOK" async></script>
    <!-- float facebook like box end -->
</body>
</html>

 

Após tudo isso fica faltando apenas colocar a foto que será exibida no lado direito, ela deve necessariamente ter o nome : widget.png.

Os arquivos necessários estão anexados nesse tutorial.

fb_float_plugin.js

Este tópico foi movido para a área correta. Esta é uma mensagem automática!
Pedimos que leia as regras do fórum!

Spoiler

This topic has been moved to the correct area. This is an automated message!
Please read the forum rules.

 

Parabéns, seu tópico de conteúdo foi aprovado!
Muito obrigado pela sua contribuição, nós do Tibia King agradecemos.
Seu conteúdo com certeza ajudará à muitos outros, você recebeu +1 REP.

Spoiler

Congratulations, your content has been approved!
Thank you for your contribution, we of Tibia King we are grateful.
Your content will help many other users, you received +1 REP.

 

Boa noite irmao, Fiz tudo que vc colocou ai, e Nao apareceu nd. Me ajude ai pf !!

opa DR.
Pode ser então que não colocou algum arquivo no local correto.