Jump to content
Close
Sign in to follow this  
ricardo codenome

Web Divulgando Sua página do Facebook No seu WebSite

Recommended Posts

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

 

Share this post


Link to post
Share on other sites

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.

 


Share this post


Link to post
Share on other 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.

 


Share this post


Link to post
Share on other sites

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



<?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

 

Share this post


Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Sign in to follow this  

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!

×
×
  • Create New...