Ir para conteúdo
  • Cadastre-se

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

 

Link para o post
Compartilhar em outros 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.

 

Compre seus Scripts Agora totalmente seguro e de forma rápida, aceitamos também encomendas.

discord.gg/phJZeHa2k4

 

Projeto ATS (Naruto)

Informações Abaixo

Facebook

Youtube
Discord

 

Tutoriais / Conteúdos

Clique Aqui

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.

 

Compre seus Scripts Agora totalmente seguro e de forma rápida, aceitamos também encomendas.

discord.gg/phJZeHa2k4

 

Projeto ATS (Naruto)

Informações Abaixo

Facebook

Youtube
Discord

 

Tutoriais / Conteúdos

Clique Aqui

Link para o post
Compartilhar em outros sites
  • 5 months later...
  • 4 months later...

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

 

Link para o post
Compartilhar em outros sites
  • 1 year later...

Como o script saberá de onde puxar a imagem .png?

Editado por Rogex Joyz (veja o histórico de edições)

                                                                                                               destinyshield.gif.9f031b59b026058f32a1c50da92ebe2a.gif  mídias sociais  destinyshield.gif.02fca81ab0615e050b2bcefd8a73a2e8.gif

                                                                                                                            talk to me              

                                                                                                                               vídeos           

                                                                                             

                                                                                                            LOGONORMAL.png.815b40b04ec583be88d8a1e2626fe430.png

                                                                                                           

                               

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.

  • Quem Está Navegando   0 membros estão online

    Nenhum usuário registrado visualizando esta página.


  • Conteúdo Similar

    • Por LeoTK
      Salve galera bom estou trazendo mais um conteúdo dessa vez a página para mostrar a guild dominante do evento castle war para o modern acc com ajuda de muitos amigos claro consegui trazer esse conteúdo para vocês bora lá

      A página configurada corretamente vai ficar assim

      2019-04-07 17-44-45.mp4 OBS: Eu não vou ceder a imagem porque é algo facinho de fazer e até porque eu não quero criar um padrão porque isso permite a pessoa criar do tamanho que desejar etc... então isso vou deixar a critério de vocês
       
      Código \/
       
      <?php $consulta = $SQL->query('SELECT `guild` FROM `castelo_guerra` ORDER BY `id` ASC;'); $number_of_rows = 0; foreach($consulta as $guildid){ $id = $guildid['guild']; } $consulta2 = $SQL->query('SELECT `name`, `id` FROM `guilds` WHERE id = '.$id.';'); ?> <style type="text/css"> a.castlefont { font-family: Verdana, Arial, Helvetica; font-size: 17px; color: #ffcc33; text-shadow:#000 4px 6px 4px, #000 -1px 1px 2px, #000 1px 1px 2px, #000 -1px -1px 2px; text-decoration:none } a:castle.topfont { font-family: Verdana, Arial, Helvetica; font-size: 10px; color: #CCC; text-decoration:none } </style> <div id="warcastle" style="margin-top:5px; margin-left:18px; height:150px; width:180px; background-image:url(<?PHP echo $layout_name; ?>LINK DA IMAGEM DE FUNDO AQUI);"> </br> </br> </br> <?php foreach($consulta2 as $guild){ echo ' <div align="center"> <a class="castlefont" href="/index.php/guilds/view/' . $id . '"> <img style="margin-left:8px; margin-top:6px" src="/public/guild_logos/' . (file_exists("public/guild_logos/".$guild['id'].".gif") == true ? $guild['id'].".gif" : "castlewar.gif").'" width="64" height="64" border="0"/> <br/> <div id="textcastle" style="margin-top:3px;">' . $guild['name'] . '</br></div> </a> </div> </td> </tr> </table> '; } ?> </div>  
      Estarei deixando algumas explicações mais detalhadas abaixo
       
      1º- Informações do evento do castle war basta mudar o castelo_guerra para o nome da tabela do seu banco de dados que pode estar como castle_war também (Fique atento a isso)
      $consulta = $SQL->query('SELECT `guild` FROM `castelo_guerra` ORDER BY `id` ASC;'); 2º- Nessa parte você vai editar tudo referente ao texto do nome da guilda cor, sombreamento etc... basta ir editando para ver qual fica melhor para você
      <style type="text/css"> a.castlefont { font-family: Verdana, Arial, Helvetica; font-size: 17px; color: #ffcc33; text-shadow:#000 4px 6px 4px, #000 -1px 1px 2px, #000 1px 1px 2px, #000 -1px -1px 2px; text-decoration:none } a:castle.topfont { font-family: Verdana, Arial, Helvetica; font-size: 10px; color: #CCC; text-decoration:none } </style> 3º- Nessa parte vai ser a imagem de fundo no caso do vídeo mostra uma imagem do tema naruto com a escrita Castle War porém você pode criar a imagem do tamanho que quiser e como quiser por isso estarei deixando em branco para vocês criarem uma imagem única e exclusiva para vocês
      <div id="warcastle" style="margin-top:5px; margin-left:18px; height:150px; width:180px; background-image:url(<?PHP echo $layout_name; ?>LINK DA IMAGEM DE FUNDO AQUI);"> 4º- Essa parte é a que busca a logo da guilda porém caso a guilda não tiver uma precisa haver uma reserva padrão no caso esta nomeada para castlewar.gif mude esse nome para uma imagem padrão que você tenha na pasta public/guild_logos
       
      <img style="margin-left:8px; margin-top:6px" src="/public/guild_logos/' . (file_exists("public/guild_logos/".$guild['id'].".gif") == true ? $guild['id'].".gif" : "castlewar.gif").'" width="64" height="64" border="0"/>  
      5º- Para os leigos basta apenas usar um include onde quiserem adicionar isso tanto na home do site etc...

       
      {include_php file='templates/naruto/castlewar.php'} Por exemplo ficaria assim o meu
       
      DATABASE ADICIONADA CASO TIVER PROBLEMAS
      castelo_guerra.sql
       
       
      Bom galera é isso espero que façam bom uso  
      AVISO PROIBIDO PEDIDO DE AJUDA COM PROBLEMAS DE SQL E BUGS DO EVENTO CASTLE WAR NESSE TÓPICO CASO TIVER ALGUM PROBLEMA USE A ÁREA DE SUPORTE
       
      Agradecimentos (Créditos)
      @ricardo codenome
      @aspira
      @Yan Liima
      @Dwarfer
      @Yinz
    • Por Lekstar
      Fala galera do TK !
       
      bom, estou querendo remover alguns items do menu do meu gesior, tentei remove-los pelo index mas sem sucesso.
      como posso remove-los ?
       
      Um Exemplo : Quero remover o subtopic "Addons" do menu.
       
      REP+ pra quem ajudar !
    • Por blaah snos
      Hello meus caros amigos do TK
       
      Minha duvida é a seguinte:
       
      Como faço pra colocar um ip no site tipo otservrox.no-ip.info, queria saber passo a passo, desde como configurar na pasta do xampp ate colocar pelo No-IP.
       
      OBS: Quero sem o 8090
       
       
      Agradeço desde já
    • Por MagmaRoox
      Galera, Como eu configuro essa parte aqui ??
       
      /*Database information*/ $config['database']['host'] = "127.0.0.1"; $config['database']['login'] = "root"; $config['database']['password'] = "já sei"; $config['database']['database'] = "já sei";   Qual host devo colocar?? REP+;  
    • Por Matheus Lirou
      Galera Estou Com o Seguinte Erro Com Um WebSite Que Eu Baixei Aqui Mesmo No TK. REP+ Quem Ajudar.

×
×
  • Criar Novo...

Informação Importante

Confirmação de Termo