Fórum grátis: ajuda e atendimento ao utilizador Forumeiros.com

Login em pop-up

3 participantes

Fórum dos Fóruns :: Ajuda e atendimento ao utilizador :: Questões sobre a aparência do fórum :: Questões resolvidas sobre a aparência do fórum

Ir para baixo

Tópico resolvido Login em pop-up

Mensagem por Kanelan 03.08.24 3:57

Detalhes da questão


Endereço do fórum: https://brasilexperiencelife.forumeiros.com
Versão do fórum: ModernBB

Descrição


Eu gostaria de ter um pop-up de login no meu fórum, se possível fazer esse pop-up aparecer quando a pessoas estiver desconectada do fórum e apertar para fazer login e o pop-up aparecer.

Este é o modelo: https://prnt.sc/vymn7g
Fórum do modelo: https://fnsystem.forumeiros.com/login

Meu overall_header:
Código:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
      "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" dir="{S_CONTENT_DIRECTION}" id="min-width" lang="{L_LANG_HTML}"
     xml:lang="{L_LANG_HTML}" {NAMESPACE_FB_LIKE} {NAMESPACE_FB} {NAMESPACE_BBCODE}>
<head>
   <title>{SITENAME_TITLE}{PAGE_TITLE}</title>
   <meta http-equiv="content-type" content="text/html; charset={S_CONTENT_ENCODING}"/>
   <meta name="viewport" content="width=device-width, initial-scale=1">
   <meta http-equiv="content-script-type" content="text/javascript"/>
   <meta http-equiv="content-style-type" content="text/css"/>
   <!-- BEGIN switch_compat_meta -->
   <meta http-equiv="X-UA-Compatible" content="IE={switch_compat_meta.VERSION}"/>
   <!-- END switch_compat_meta -->
   <!-- BEGIN switch_canonical_url -->
   <link rel="canonical" href="{switch_canonical_url.CANONICAL_URL}"/>
   <!-- END switch_canonical_url -->
   {META_FAVICO}
   {META}
   {META_FB_LIKE}
   <meta name="title" content="{SITENAME_TITLE}{PAGE_TITLE}"/>
   {T_HEAD_STYLESHEET}
   {CSS}
   <link rel="search" type="application/opensearchdescription+xml" href="/improvedsearch.xml" title="{SITENAME}"/>
   <link rel="search" type="application/opensearchdescription+xml" href="{URL_BOARD_DIRECTORY}/search/improvedsearch.xml" title="{SEARCH_FORUMS}"/>
   <script src="{JQUERY_PATH}" type="text/javascript"></script>
   <!-- BEGIN switch_recent_jquery -->
   <script src="{JS_DIR}jquery1.9/jquery-migrate-1.4.1.js" type="text/javascript"></script>
   <script src="{JQUERY_DIR}browser/v1.0/jquery.browser.min.js" type="text/javascript"></script>
   <script src="{JQUERY_DIR}support/jquery.support.js" type="text/javascript"></script>
   <!-- END switch_recent_jquery -->
   <script src="{JS_DIR}{L_LANG}.js" type="text/javascript"></script>
   {RICH_SNIPPET_GOOGLE}
<script type="text/javascript">!function(){var t,e=document.getElementById("darkSwitch");if(e){t=null!==localStorage.getItem("darkSwitch")&&"dark"===localStorage.getItem("darkSwitch"),(e.checked=t)?document.body.setAttribute("data-theme","dark"):document.body.removeAttribute("data-theme"),e.addEventListener("change",function(t){e.checked?(document.body.setAttribute("data-theme","dark"),localStorage.setItem("darkSwitch","dark")):(document.body.removeAttribute("data-theme"),localStorage.removeItem("darkSwitch"))})}}();</script>
   <!-- BEGIN switch_fb_login -->
   <script src="https://connect.facebook.net/{switch_fb_login.FB_LOCAL}/all.js" type="text/javascript"></script>
   <script src="{switch_fb_login.JS_FB_LOGIN}" type="text/javascript"></script>
   <!-- END switch_fb_login -->

   <!-- BEGIN switch_ticker -->
   <link type="text/css" rel="stylesheet" href="{JQUERY_DIR}ticker/ticker.css"/>
   <script src="{JQUERY_DIR}ticker/ticker.js" type="text/javascript"></script>
   <!-- END switch_ticker -->

   <!-- BEGIN switch_ticker_new -->
   <script src="{JQUERY_DIR}jcarousel/jquery.jcarousel.js" type="text/javascript"></script>
   <script type="text/javascript">
      //<![CDATA[
      /* Definir le sens de direction en fonction du panneau admin */
      var tickerDirParam = "{switch_ticker.DIRECTION}";
      var slid_vert = false;
      var auto_dir = 'next';
      var h_perso = parseInt({switch_ticker.HEIGHT});

      switch (tickerDirParam) {
         case 'top' :
            slid_vert = true;
            break;

         case 'left':
            break;

         case 'bottom':
            slid_vert = true;
            auto_dir = 'prev';
            break;

         case 'right':
            auto_dir = 'prev';
            break;

         default:
            slid_vert = true;
      }

      $(document).ready(function () {

         $('#fa_ticker_content').css('display', 'block');

         var width_max = $('ul#fa_ticker_content').width();
         var width_item = Math.floor(width_max / {switch_ticker.SIZE});

         if (width_max > 0) {
            $('ul#fa_ticker_content li').css('float', 'left').css('list-style', 'none').width(width_item).find('img').each(function () {
               if ($(this).width() > width_item) {
                  var ratio = $(this).width() / width_item;
                  var new_height = Math.round($(this).height() / ratio);
                  $(this).height(new_height).width(width_item);
               }
            });

            if (slid_vert) {
               var height_max = h_perso;

               $('ul#fa_ticker_content li').each(function () {
                  if ($(this).height() > height_max) {
                     height_max = $(this).height();
                  }
               });

               $('ul#fa_ticker_content').width(width_item).height(height_max).css('marginLeft', 'auto').css('marginRight', 'auto');
               $('ul#fa_ticker_content li').height(height_max);
            }


            $('#fa_ticker_content').jcarousel({
               vertical: slid_vert,
               wrap: 'circular',
               auto: {switch_ticker.STOP_TIME},
               auto_direction: auto_dir,
               scroll: 1,
               size: {switch_ticker.SIZE},
               height_max: height_max,
               animation: {switch_ticker.SPEED}
            });
         } else {
            $('ul#fa_ticker_content li:not(:first)').css('display', 'none');
            $('ul#fa_ticker_content li:first').css('list-style', 'none').css('text-align', 'center');
         }
      });
      //]]>
   </script>
   <!-- END switch_ticker_new -->

   <script type="text/javascript">//<![CDATA[
      $(document).ready(function () {
         <!-- BEGIN switch_enable_pm_popup -->
         pm = window.open('{U_PRIVATEMSGS_POPUP}', '_faprivmsg', 'HEIGHT=225,resizable=yes,WIDTH=400');
         if (pm != null) {
            pm.focus();
         }
         <!-- END switch_enable_pm_popup -->
         <!-- BEGIN switch_report_popup -->
         report = window.open('{switch_report_popup.U_REPORT_POPUP}', '_phpbbreport', 'HEIGHT={switch_report_popup.S_HEIGHT},resizable=yes,scrollbars=no,WIDTH={switch_report_popup.S_WIDTH}');
         if (report != null) {
            report.focus();
         }
         <!-- END switch_report_popup -->
         <!-- BEGIN switch_ticker -->
         Ticker.start({
            height: {switch_ticker.HEIGHT},
            spacing: {switch_ticker.SPACING},
            speed: {switch_ticker.SPEED},
            direction: '{switch_ticker.DIRECTION}',
            pause: {switch_ticker.STOP_TIME}
         });
         <!-- END switch_ticker -->

         document.onclick = function(e){
            if (!e.target.classList.contains('navicon')) {
               if ($(e.target).parents('.responsive-headerbar').length == 0 && e.target.id != "menu-btn") {
                  document.getElementById('menu-btn').checked = false;
               }
            }
         };
      });

      <!-- BEGIN switch_login_popup -->
      var logInPopUpLeft, logInPopUpTop, logInPopUpWidth = {LOGIN_POPUP_WIDTH},
         logInPopUpHeight = {LOGIN_POPUP_HEIGHT}, logInBackgroundResize = true, logInBackgroundClass = false;

      $(document).ready(function () {
         $(window).resize(function () {
            var windowWidth = document.documentElement.clientWidth;
            var popupWidth = $("#login_popup").width();
            var mypopup = $("#login_popup");

            $("#login_popup").css({
               "left": windowWidth / 2 - popupWidth / 2
            });
         });
      });
      <!-- END switch_login_popup -->
      //]]>
   </script>

   {GREETING_POPUP}

   <style type="text/css">
      #page-footer, div.navbar, div.navbar ul.linklist {
         display: block !important;
      }

      ul.linklist li.rightside, ul.linklist li.rightside a.copyright {
         display: inline !important;
      }

      <!-- BEGIN switch_ticker_new -->
      .jcarousel-skin-tango .jcarousel-item {
         text-align: center;
         width: 10px;
      }

      .jcarousel-skin-tango .jcarousel-item-horizontal {
         margin-right: {switch_ticker.SPACING}px;
      }

      .jcarousel-skin-tango .jcarousel-item-vertical {
         margin-bottom: {switch_ticker.SPACING}px;
      }

      <!-- END switch_ticker_new -->
   </style>

   {HOSTING_JS}

   <!-- BEGIN google_analytics_code -->
   <script async src="https://www.googletagmanager.com/gtag/js?id={G_ANALYTICS_ID}"></script>
   <script>
      window.dataLayer = window.dataLayer || [];
      function gtag(){dataLayer.push(arguments);}
      gtag('js', new Date());
      gtag('config', '{G_ANALYTICS_ID}', {'anonymize_ip': true, 'store_gac': false, 'cookie_expires': 13 * 30 * 24 * 60 * 60});
      <!-- BEGIN google_analytics_code_bis -->
      gtag('config', '{G_ANALYTICS_ID_BIS}', {'anonymize_ip': true, 'store_gac': false, 'cookie_expires': 13 * 30 * 24 * 60 * 60});
      <!-- END google_analytics_code_bis -->
   </script>
   <!-- END google_analytics_code -->

   <link href="https://fonts.googleapis.com/css?family=Roboto:300,400,400i,500,700,700i&amp;subset=cyrillic,cyrillic-ext,greek,greek-ext,latin-ext,vietnamese&display=swap"
        rel="stylesheet"/>
   <link href="https://code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css" rel="stylesheet"/>
</head>

<body id="modernbb">
  <div class="custom-switch"><input type="checkbox" class="toggle" id="darkSwitch"><label for="darkSwitch"></label></div>
<!-- BEGIN hitskin_preview -->
<div id="hitskin_preview" style="display: block;">
   <h1><img src="{hitskin_preview.PATH_IMG_FA}hitskin/hitskin_logo.png" alt="" loading="lazy" /> <em>Hit</em>skin.com</h1>
   <div class="content">
      <p>
         {hitskin_preview.L_THEME_SITE_PREVIEW}
         <br/>
         <span>{hitskin_preview.U_INSTALL_THEME}<a href="https://{hitskin_preview.U_RETURN_THEME}">{hitskin_preview.L_RETURN_THEME}</a></span>
      </p>
       
          </div>
</div>
<!-- END hitskin_preview -->

<!-- BEGIN inactive_users_modal -->
<div id="inactive_popup" style="z-index: 10000 !important;">
   <div class="h3">{inactive_users_modal.L_MODAL_TITLE}</div>
   <div id="inactive_popup_message">{inactive_users_modal.L_MODAL_BODY}</div>
   <div id="inactive_popup_buttons">
      <button id="inactive_popup_url" class="button1">{inactive_users_modal.L_MODAL_BUTTON}</button>
      <button id="inactive_popup_close" class="button1">{inactive_users_modal.L_CLOSE}</button>
   </div>
</div>
<script type="text/javascript">
   $('#inactive_popup #inactive_popup_close').on('mouseup', function () {
      document.cookie = "modal_require_activation_closed=1; max-age=86400*15; path=/;";
      $('#inactive_popup').hide(50);
   });
   $('#inactive_popup #inactive_popup_url').on('mouseup', function () {
      document.cookie = "modal_require_activation_closed=1; max-age=86400*15; path=/;";
      location.href = '{inactive_users_modal.U_MODAL}'
   })
</script>
<!-- END inactive_users_modal -->

<!-- BEGIN switch_login_popup -->
<div id="login_popup" style="z-index: 10000 !important;">
   <div class="h3">{SITENAME}</div>
   <div id="login_popup_message">
      {LOGIN_POPUP_MSG}
   </div>
   <!-- BEGIN switch_quick_login -->
   <br/>
   <div class="h3">{switch_login_popup.switch_quick_login.L_QUICK_CONNECT}</div>
   <div>
      <div class="mt10">
         <div class="social_btn">
            <!-- BEGIN fb_quick_connect -->
            <div class="fb-login-button"></div>
            <!-- END fb_quick_connect -->
            &nbsp;
            <!-- BEGIN topicit_quick_connect -->
            <div class="ti-connect"></div>
            <!-- END topicit_quick_connect -->
         </div>
      </div>
   </div>
   <br/>
   <!-- END switch_quick_login -->
   <div id="login_popup_buttons">
      <form action="{S_LOGIN_ACTION}" method="get">
         <input type="submit" class="button1" value="{L_LOGIN}"/>
         <input type="button" class="button1" value="{L_REGISTER}" onclick="parent.location='{U_REGISTER}';"/>
         <input id="login_popup_close" type="button" class="button2" value="{L_DONT_DISPLAY_AGAIN}"/>
      </form>
   </div>
</div>
<!-- END switch_login_popup -->

<!-- BEGIN switch_like_popup -->
<div id="like_popup" style="z-index: 10000 !important;">
   <div class="h3">{SITENAME}</div>
   <div id="like_popup_message">
        {LIKE_POPUP_MSG}
   </div>
   <div id="like_popup_buttons">
      <form action="{S_LOGIN_ACTION}" method="get">
         <input type="submit" class="button1" value="{L_LOGIN}"/>
         <input type="button" class="button1" value="{L_REGISTER}" onclick="parent.location='{U_REGISTER}';"/>
         <input id="like_popup_close" type="button" class="button2" value="{L_LIKE_CLOSE}"/>
      </form>
   </div>
</div>
<!-- END switch_like_popup -->

<a id="top" name="top" accesskey="t"></a>
{JAVASCRIPT}

<div id="page-header">
   <div class="headerbar">
      <div id="headerbar-top" class="responsive-headerbar">
         <div class="wrap">            
            <input class="menu-btn" type="checkbox" id="menu-btn" />
            <label class="menu-icon" for="menu-btn"><span class="navicon"></span></label>
            <ul id="modernbb-nav-menu" class="navbar navlinks{NAVBAR_BORDERLESS}">
               <li>{GENERATED_NAV_BAR}</li>
            </ul>
         </div>
      </div>

      <div class="wrap">
         <div id="site-desc">
            <!-- BEGIN switch_h1 -->
            <div id="site-title">{switch_h1.MAIN_SITENAME}</div>
            <!-- END switch_h1 -->
            <!-- BEGIN switch_desc -->
            <p>{switch_desc.SITE_DESCRIPTION}</p>
            <!-- END switch_desc -->
         </div>
      </div>
   </div>

   <!-- BEGIN switch_ticker_new -->
   <div id="fa_ticker_blockD" style="margin-top:4px;">
      <div class="module">
         <div class="inner">
            <div id="fa_ticker_container">
               <ul id="fa_ticker_content" class="jcarousel-skin-tango" style="display:none">
                  <!-- BEGIN ticker_row -->
                  <li>{switch_ticker.ticker_row.ELEMENT}</li>
                  <!-- END ticker_row -->
               </ul>
            </div>
         </div>
      </div>
   </div>
   <!-- END switch_ticker_new -->
</div>

<div class="conteneur_minwidth_IE modern-resp">
   <div class="conteneur_layout_IE">
      <div class="conteneur_container_IE">
         <div id="wrap">
            <div id="page-body">

               <!-- BEGIN switch_ticker -->
               <div id="fa_ticker_block" style="margin-top:4px;">
                  <div class="module">
                     <div class="inner">
                        <div id="fa_ticker_container">
                           <div id="fa_ticker" style="height:{switch_ticker.HEIGHT}px;">
                              <div class="fa_ticker_content">
                                 <!-- BEGIN ticker_row -->
                                 <div>{switch_ticker.ticker_row.ELEMENT}</div>
                                 <!-- END ticker_row -->
                              </div>
                           </div>
                        </div>
                     </div>
                  </div>
               </div>
               <!-- END switch_ticker -->

               <div id="{ID_CONTENT_CONTAINER}"{CLASS_CONTENT_CONTAINER}>
                  <div id="outer-wrapper">
                     <div id="wrapper">
                        <div id="{ID_LEFT}">
                           <!-- BEGIN giefmod_index1 -->
                           {giefmod_index1.MODVAR}
                           <!-- BEGIN saut -->
                           <div style="height:{SPACE_ROW}px"></div>
                           <!-- END saut -->
                           <!-- END giefmod_index1 -->
                        </div>

                        <div id="container">
                           <div id="content-main">
                              <div id="main">
                                 <div id="main-content">
                                                                                         
 <!---Fontawsome--->
                                                                                         
                                                                                          <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/all.min.css">

               

                                                                                           
Kanelan
Kanelan
Novo Membro

Membro desde : 24/07/2024
Mensagens : 12
Pontos : 21

https://www.brasilexperiencelife.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: Login em pop-up

Mensagem por Shek 03.08.24 22:37

Boa noite.

Este tópico possui a solução para sua dúvida: https://ajuda.forumeiros.com/t116203-login-em-pop-up

Atenciosamente,
Shek King
Shek
Shek
Principal Contribuidor
Principal Contribuidor

Membro desde : 11/04/2009
Mensagens : 19006
Pontos : 22968

https://shiftactive.blogspot.com/ https://www.facebook.com/ShiftActif https://twitter.com/ShiftActif

Ir para o topo Ir para baixo

Tópico resolvido Re: Login em pop-up

Mensagem por Kanelan 04.08.24 13:26

Olá, já vi todos os tópicos e não consegui, visualizei que os usuários tiveram ajuda dos ajudeiros, onde os mesmos editaram o template, eu mesmo não consegui fazer por conta própria
Kanelan
Kanelan
Novo Membro

Membro desde : 24/07/2024
Mensagens : 12
Pontos : 21

https://www.brasilexperiencelife.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: Login em pop-up

Mensagem por Shek 05.08.24 0:27

Boa noite.

Olha, se você quiser esperar os Ajudeiros, fique a vontade. Aliás, a última vez que vi um Ajudeiro online já tem meses (tipo, dois ou três meses online). Agora, se quiser tentar essa modificação abaixo acredito que você terá resultado.

No template overall_header, procure por esse trecho:
Código:
<!-- BEGIN switch_login_popup -->
<div id="login_popup" style="z-index: 10000 !important;">
   <div class="h3">{SITENAME}</div>
   <div id="login_popup_message">
      {LOGIN_POPUP_MSG}
   </div>
   <!-- BEGIN switch_quick_login -->
   <br/>
   <div class="h3">{switch_login_popup.switch_quick_login.L_QUICK_CONNECT}</div>
   <div>
      <div class="mt10">
         <div class="social_btn">
            <!-- BEGIN fb_quick_connect -->
            <div class="fb-login-button"></div>
            <!-- END fb_quick_connect -->
            &nbsp;
            <!-- BEGIN topicit_quick_connect -->
            <div class="ti-connect"></div>
            <!-- END topicit_quick_connect -->
         </div>
      </div>
   </div>
   <br/>
   <!-- END switch_quick_login -->
   <div id="login_popup_buttons">
      <form action="{S_LOGIN_ACTION}" method="get">
         <input type="submit" class="button1" value="{L_LOGIN}"/>
         <input type="button" class="button1" value="{L_REGISTER}" onclick="parent.location='{U_REGISTER}';"/>
         <input id="login_popup_close" type="button" class="button2" value="{L_DONT_DISPLAY_AGAIN}"/>
      </form>
   </div>
</div>
<!-- END switch_login_popup -->
Substitua por esse código:
Código:
<!-- BEGIN switch_login_popup -->
<div id="login_popup" class="login-pop-up">
   <div class="mfp-bg my-mfp-zoom-in mfp-ready"></div>
   <div class="mfp-wrap  mfp-close-btn-in mfp-auto-cursor my-mfp-zoom-in mfp-ready" tabindex="-1" style="overflow: hidden auto;">
      <div class="mfp-container mfp-s-ready mfp-inline-holder">
         <div class="mfp-content">
            <div id="login-dialog" class="login-popup zoom-anim-dialog">
               <!-- BEGIN switch_quick_login --><h3 class="aside-title">{switch_login_popup.switch_quick_login.L_QUICK_CONNECT}</h3><!-- END switch_quick_login -->
               <form action="{S_LOGIN_ACTION}" method="post" class="login-form" name="form_login">
                  <p>{LOGIN_POPUP_MSG}</p>
                  <label for="login-username-input-target" class="username-input"><input type="text" name="username" class="rounded-input blue-active inputbox fl_username" id="login-username-input-target" placeholder="{L_USERNAME}" autocomplete="username" required /><i class="ion-person" aria-hidden="true"></i></label>
                  <label for="login-password-input-target" class="password-input"><input type="password" name="password" class="rounded-input blue-active inputbox fl_password" id="login-password-input-target" placeholder="{L_PASSWORD}" autocomplete="current-password" required /><i class="ion-key" aria-hidden="true"></i></label>
                  <div style="font-size: 15px; margin-bottom: 5%;">
                     <label for="autologin-check">{L_AUTO_LOGIN}: <input id="autologin-check" class="radio" type="checkbox" name="autologin" {AUTOLOGIN_CHECKED} /></label>
                  </div>
                  <button type="submit" class="rounded-button login" id="doLogin" name="login">{L_LOGIN}</button>
                  {S_HIDDEN_FIELDS}
               </form>
               <button type="button" class="rounded-button" style="background-color:#84c754;margin: 5px;" onclick="parent.location='{U_REGISTER}';">{L_REGISTER}</button>
               <button type="button" id="login_popup_close" class="mfp-close" title="{L_DONT_DISPLAY_AGAIN}">×</button>
            </div>
         </div>
         <div class="mfp-preloader">Loading...</div>
      </div>
   </div>
</div>
<!-- END switch_login_popup -->
Depois, acesse sua folha de estilos CSS, e inclua o código CSS do tópico que citei antes.

Eu fiz alguns ajustes:
- O idioma dos botões foram corrigidos com as variáveis de template padrão;
- Botão de registro ganha um evento onclick do template padrão;
- Inclusão da variável <p>{LOGIN_POPUP_MSG}</p> para inserir mensagens personalizadas a partir do painel;
- Inclusão da variável de tradução <!-- BEGIN switch_quick_login --><h3 class="aside-title">{switch_login_popup.switch_quick_login.L_QUICK_CONNECT}</h3><!-- END switch_quick_login --> para informar que se conectar é fácil (OBS, precisa ativar topic'it connect ou facebook connect);
- Corrigido bug do "close pop-up". Se fechar a pop-up é preciso limpar o cachê do navegador pra vê-la de novo;

O resultado é esse:
Login em pop-up Screen83

Caso ainda deseje aguardar um Ajudeiro, boa sorte. Feliz 2

Atenciosamente,
Shek King
Shek
Shek
Principal Contribuidor
Principal Contribuidor

Membro desde : 11/04/2009
Mensagens : 19006
Pontos : 22968

https://shiftactive.blogspot.com/ https://www.facebook.com/ShiftActif https://twitter.com/ShiftActif

Ir para o topo Ir para baixo

Tópico resolvido Re: Login em pop-up

Mensagem por Kanelan 05.08.24 1:44

Olá, eu não quis dizer necessariamente um ajudeiro kkk, eu fico grato por pessoas como você com intenção de ajudar des de 2009! vamos la. eu coloquei do jeito que voce falou no template, porém não aparece a tela de login, poderia me dizer qual o problema ou se é o código css? veja:Login em pop-up Imagem11
Kanelan
Kanelan
Novo Membro

Membro desde : 24/07/2024
Mensagens : 12
Pontos : 21

https://www.brasilexperiencelife.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: Login em pop-up

Mensagem por Shek 05.08.24 22:56

Boa noite.

Você precisa ativar a pop-up de conexão no fórum. Acesse o Painel > Geral >> Configurações >> Pop-up de conexão e clique na opção Sim em Ativar. Aliás, como eu descrevi na mensagem anterior, eu fiz upgrades no código, por tanto a popup padrão do fórum foi substituído pela nova. Se você fechar a popup uma vez, só será possível vê-la de novo quando limpar os cookies do navegador ou acessar na aba privada. Você pode ver o resultado aqui: https://shek.forumeiros.com

O código CSS deve ser incluso em Visualização > Imagens e Cores > Cores > Folha de estilos CSS > Muito feliz
Shek
Shek
Principal Contribuidor
Principal Contribuidor

Membro desde : 11/04/2009
Mensagens : 19006
Pontos : 22968

https://shiftactive.blogspot.com/ https://www.facebook.com/ShiftActif https://twitter.com/ShiftActif

Ir para o topo Ir para baixo

Tópico resolvido Re: Login em pop-up

Mensagem por Kanelan 06.08.24 20:38

Muito obrigado ^^ foi, porém tem uns anuncios e algo que queria adicionar.

assim como este Login em pop-up Imagem17
gostaria que fosse fixo e não desse pra ninguem sair dessa tela de login, e quando eu estou nessa tela de log aparece uns anuncios. estamos em 90% Muito feliz

Link do fórum que vi isto:https://www.pmhabbo.com/login?redirect=%2Fgroups%3Fg%3D225
Kanelan
Kanelan
Novo Membro

Membro desde : 24/07/2024
Mensagens : 12
Pontos : 21

https://www.brasilexperiencelife.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: Login em pop-up

Mensagem por Shek 07.08.24 9:42

Bom dia.

Então neste caso você vai ter que usar o código antigo mesmo. Além do mais, se forçar uma tela de login que não seja a nativa, os internautas podem nem querer mais acessar o fórum, visto que ele não terá conteúdo para ser lido. Ao invés de forçar uma pop-up de conexão, queira optar por um fórum privado: https://www.forumeiros.com/criar-forum-privado

Mas, para tentar ajudá-lo na dúvida, exclua a mudança que fez no template overall_header e siga os novos passos. Abra novamente o overall_header, e pesquise por <body id="modernbb">. Ao encontrá-lo, abaixo dele insira isso:
Código:
<div class="login-pop-up">
<div class="mfp-bg my-mfp-zoom-in mfp-ready"></div>
<div class="mfp-wrap  mfp-close-btn-in mfp-auto-cursor my-mfp-zoom-in mfp-ready" tabindex="-1" style="overflow: hidden auto;">
  <div class="mfp-container mfp-s-ready mfp-inline-holder">
      <div class="mfp-content">
        <div id="login-dialog" class="login-popup zoom-anim-dialog">
            <h3 class="aside-title">LOGAR NO FÓRUM</h3>
            <form action="/login" method="post" class="login-form" name="form_login">
              <label for="login-username-input-target" class="username-input"><input type="text" name="username" class="rounded-input blue-active" id="login-username-input-target" placeholder="{L_USERNAME}" autocomplete="username" required=""><i class="fas fa-user" aria-hidden="true"></i></label><label for="login-password-input-target" class="password-input"><input type="password" name="password" class="rounded-input blue-active" id="login-password-input-target" placeholder="{L_PASSWORD}" autocomplete="current-password" required=""><i class="fas fa-key" aria-hidden="true"></i></label>
              <div style="font-size: 15px; margin-bottom: 5%;"><input class="radio" id="autologin-check" type="checkbox" name="autologin" checked="checked" {AUTOLOGIN_CHECKED} hidden><label for="autologin-check">Manter-me conectado.</label></div>
              <button type="submit" class="rounded-button login" id="doLogin" name="login">Vamos lá!</button>
            </form>
            <a href="/register"><button class="rounded-button register" name="register">Registrar</button></a><button title="Close (Esc)" type="button" class="mfp-close">×</button>
        </div>
      </div>
      <div class="mfp-preloader">Loading...</div>
  </div>
</div>
    </div>
Procure em seguida por {CSS} e abaixo dela insira:
Código:
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/3.7.2/animate.min.css">
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.8.2/css/solid.css" integrity="sha384-ioUrHig76ITq4aEJ67dHzTvqjsAP/7IzgwE7lgJcg2r7BRNGYSK0LwSmROzYtgzs" crossorigin="anonymous">
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.8.2/css/regular.css" integrity="sha384-hCIN6p9+1T+YkCd3wWjB5yufpReULIPQ21XA/ncf3oZ631q2HEhdC7JgKqbk//4+" crossorigin="anonymous">
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.8.2/css/brands.css" integrity="sha384-i2PyM6FMpVnxjRPi0KW/xIS7hkeSznkllv+Hx/MtYDaHA5VcF0yL3KVlvzp8bWjQ" crossorigin="anonymous">
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.8.2/css/fontawesome.css" integrity="sha384-sri+NftO+0hcisDKgr287Y/1LVnInHJ1l+XC7+FOabmTTIK0HnE2ID+xxvJ21c5J" crossorigin="anonymous">
Depois, acesse a aba Módulos > HTML e Javascript > Gestão dos códigos javascript > Criar um novo javascript e cole este novo código:
Código:
$(function() {
if(_userdata.session_logged_in == 0) {
$('.login-pop-up').show();
}
else {
$('.login-pop-up').hide();
}
});
Selecione o investimento para Todas as páginas e salve. O resultado já é visível no fórum. Contudo sobre a questão dos anúncios, você deve user o serviço de anúncios que desejar. Se fornecerem algum código que possa usar para exibir os anúncios, no template overall_header, insira o código do anunciante acima ou abaixo do código <div class="mfp-preloader">Loading...</div>.

Atenciosamente,
Shek King
Shek
Shek
Principal Contribuidor
Principal Contribuidor

Membro desde : 11/04/2009
Mensagens : 19006
Pontos : 22968

https://shiftactive.blogspot.com/ https://www.facebook.com/ShiftActif https://twitter.com/ShiftActif

Ir para o topo Ir para baixo

Tópico resolvido Re: Login em pop-up

Mensagem por Skouliki 13.08.24 7:34

Tópico resolvido


Tópico arquivado por inatividade por parte do autor, marcado como resolvido por ter solução apropriada à questão.
Skouliki
Skouliki
Moderadeira
Moderadeira

Membro desde : 12/10/2018
Mensagens : 1182
Pontos : 1419

http://iconskouliki.forumgreek.com https://www.facebook.com/Iconskouliki https://twitter.com/Iconskouliki

Ir para o topo Ir para baixo

Ir para o topo

- Tópicos semelhantes

Fórum dos Fóruns :: Ajuda e atendimento ao utilizador :: Questões sobre a aparência do fórum :: Questões resolvidas sobre a aparência do fórum

 
Permissões neste sub-fórum
Não podes responder a tópicos