Ir para conteúdo
Close
Entre para seguir isso  
ricardo codenome

Web Divulgando Sua página do Facebook No seu WebSite

Posts Recomendados

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.
 

image.png.f20eb5a7162cd0b3a03a5055445beba9.pngimage.png.b9bd6df21a954d01deb65cf18d264600.png


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>


 


image.png.bfd3eb90a4913077c4b5a637be3c35b6.png
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

widget.png



<?php

$assinatura = function($texto) {
	return $texto;
};

$assinatura('Eu ainda não tenho uma assinatura decente ):, php ♥');
?>

Meus sites.:

https://ferobraglobal.com/
https://codenome.com/
https://uam.codenome.com/

https://myci.myara.net/

 

Me ajuda no café:
http://picpay.me/ricardo.codenome

 

Compartilhar este post


Link para o post
Compartilhar em outros sites

Compartilhar este post


Link para o post
Compartilhar em outros sites

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.

 


Compartilhar este post


Link para o post
Compartilhar em outros sites

Participe da conversa

Você pode postar agora e se cadastrar mais tarde. Se você tem uma conta, faça o login para postar com sua conta.

Visitante
Responder

×   Você colou conteúdo com formatação.   Remover formatação

  Apenas 75 emojis são permitidos.

×   Seu link foi automaticamente incorporado.   Mostrar como link

×   Seu conteúdo anterior foi restaurado.   Limpar o editor

×   Não é possível colar imagens diretamente. Carregar ou inserir imagens do URL.

Entre para seguir isso  

Open Tibia Server

Quer aprender a criar seu próprio servidor de Tibia? Então está no lugar certo, aqui você encontrará milhares de tutorias, scripts, códigos, mapas e utilitários para que você possa fazer o seu próprio servidor de Tibia partindo do zero.

Redes Sociais

Anuncie no Tibia King

Precisa de mais visibilidade em seus projetos? Quer publicidade para o seu servidor? Anuncie no Tibia King e faça sua divulgação, possuímos centenas de acessos simultâneos e milhares diários, com certeza será a sua solução! A publicação do seu anuncio é instantânea!

×
×
  • Criar Novo...