Data/hora atual: 08.12.22 14:02

385 resultados encontrados para Menu

Alterar a cor do cabeçalho

Detalhes da questão


Endereço do fórum: https://forumempresatst.forumeiros.com/
Versão do fórum: AwesomeBB

Descrição


Gostaria de mudar a cor desse menu, porem não consigo encontrar essa opção no menu de edição de cores.

Menu - Procurar 110
por samuelaraujossantos
em 01.12.22 11:46
 
Procurar em: Questões resolvidas sobre o painel administrativo
Tópico: Alterar a cor do cabeçalho
Respostas: 3
Vistos: 53

Barra de navegação personalizada

Eu acabei respondendo o Mixeuzinho na mesma hora que ele respondeu meu tópico, fiquei esperando e não tive resposta, acabou que eu e meu amigo mexemos em algumas coisas no fórum e ficou quase do jeito que queríamos.

Conseguimos posicionar o menu em baixo do banner e essa parte de ocultar algumas opções do menu acabei descobrindo mexendo nas configurações.

Agora a única coisa que não estamos conseguindo, é desvincular o menu do banner, pois ele está aparecendo recortado. Parece que existe uma área limitada pro banner+menuComputador


Menu - Procurar Siteag10
por DeNieW
em 25.11.22 2:40
 
Procurar em: Questões resolvidas sobre a aparência do fórum
Tópico: Barra de navegação personalizada
Respostas: 9
Vistos: 98

Barra de navegação personalizada

Boa noite Autor.

Partindo do pressuposto que deseja deixar o menu na parte inferior ao logo como mencionou, sugiro acessar Visualização > Templates > Geral e no template overall_header, localizar esse trecho:
Código:
      <div id="headerbar-top" class="responsive-headerbar">
         <div class="wrap">
            <a href="{U_INDEX}" id="logo"><img loading="lazy" src="{LOGO}" alt="{L_INDEX}"/></a>
            <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>
Ao encontrá-lo, pressione o botão direito do mouse e clique em "Recortar". Ainda neste template, na caixa de busca procure por <!-- END switch_ticker_new --> insira o código recortado, clicando no botão direito do mouse, e depois em "Colar". Salve o template, e publique.

Ainda na aba "Visualização", acesse a opção "Cores & CSS" em Imagens e Cores, e a seguir em Folha de estilo (CSS) insira o código a seguir:
Código:
.is-sticky#headerbar-top,.responsive-headerbar {background-color: black !important;}
.is-sticky#headerbar-top {
    position: sticky !important;
    right: auto !important;
    top: auto !important;
}
Salve e veja se seria isso que deseja. Piscada

Quanto aos links, você não pode removê-los de forma usual, mas por script. Porém, recomendo não usar script para uma coisa tão simples. Você pode impedir que eles sejam visíveis aos usuários. Leia este FAQ para mais detalhes: https://ajuda.forumeiros.com/t16325-faq-gerir-os-botoes-do-menu-de-navegacao

Atenciosamente,
Shek King
por Shek
em 25.11.22 2:06
 
Procurar em: Questões resolvidas sobre a aparência do fórum
Tópico: Barra de navegação personalizada
Respostas: 9
Vistos: 98

Barra de navegação personalizada

Mixeuzinho escreveu:Olá, você entende que, segundo as normas do forumeiros, é proibida a cópia total ou parcial de algum outro fórum. O que podemos fazer é pegar de inspiração e criar o nosso. Vamos a isso?
O seu overall_header já possui alguma modificação? Se sim, envie-me o template supracitado.


Não quero copiar e sim saber, como deixar posicionado o menu ali em baixo para que eu possa colocar um banner naquela parte de cima, pois agora onde ela está localizada ta muito feio e quando coloco banner o banner não pega todo o espaço de cima e o menu fica espremido no canto. 

Olha ai...  Tonto
Menu - Procurar Feiodm10
por DeNieW
em 24.11.22 17:03
 
Procurar em: Questões resolvidas sobre a aparência do fórum
Tópico: Barra de navegação personalizada
Respostas: 9
Vistos: 98

Barra de navegação personalizada

Não possui alteração, pois eu não sei como alterar nada.  Não

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}

   <!-- 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">
<!-- 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">
            <a href="{U_INDEX}" id="logo"><img loading="lazy" src="{LOGO}" alt="{L_INDEX}"/></a>
            <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">
por DeNieW
em 24.11.22 16:59
 
Procurar em: Questões resolvidas sobre a aparência do fórum
Tópico: Barra de navegação personalizada
Respostas: 9
Vistos: 98

Barra de navegação personalizada

Detalhes da questão


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

Descrição



O menu do meu forum está dessa forma:
Menu - Procurar Forumk10


Como deixar o Menu do forum igual esse:
Menu - Procurar Forumf10
Fórum do print: https://playfatal.forumeiros.com/

Eu queria tirar algumas opções desse menu, deixar somente: Inicio, Portal, Perfil (Registrar e Entrar)

Pf, me ajudem Por favor, Insistênc
por DeNieW
em 24.11.22 14:21
 
Procurar em: Questões resolvidas sobre a aparência do fórum
Tópico: Barra de navegação personalizada
Respostas: 9
Vistos: 98

Últimas imagens: Navegue pelas imagens e fotos compartilhadas

Descobre uma nova forma de navegação
Uma nova #novidade Forumeiros!


Caros utilizadores,

Temos o prazer de anunciar que um novo recurso está disponível em todos os fóruns gratuitos Forumeiros: a possibilidade de visualizar todas as imagens compartilhadas nos tópicos.

Com este recurso é fácil navegar pelas imagens publicadas, classificadas das mais recentes às mais antigas. Uma maneira simples de redescobrir as discussões de forma diferente!

Vista geral

Módulo "Imagens compartilhadas recentemente"

Na página inicial acima de "Quem está conectado?" foi adicionado um novo módulo que apresenta as imagens. Um exemplo na versão #modernBB (a aparência muda de acordo com a versão escolhida):

Menu - Procurar Ghggh10


A exibição de imagens está sujeita às seguintes condições

  • Somente imagens com mais de 200px de largura são exibidas;
  • As imagens aparecem para os membros com base das permissões de visibilidade do tópico e imagem. Portanto, se o membro não tiver permissão para ler o tópico onde a imagem foi publicada, ele não verá a imagem no módulo. Da mesma forma, se os convidados do fórum não tiverem permissão para as visualizar imagens em uma específica secção, essas imagens não estarão presentes para eles por meio desse novo recurso;
  • As imagens contidas em determinados BBCodes (quote, hide, etc.) são excluídas da exibição;
  • Imagens hospedadas em determinados serviços externos que já foram descontinuados ou pagos (TinyPic, por exemplo) são excluídas da exibição;
  • Após adicionar uma nova imagem, pode levar até 5 minutos para que ela seja exibida no módulo.

Página "Últimas imagens"

Para além do módulo mencionado acima há disponível uma nova página dedicada para as imagens compartilhadas:

https:// <endereço_do_fórum> /imagens

O link permite um rápido acesso da comunidade a listagem de imagens e fotos podendo utilizar a hiperligação integrada ao menu de navegação do fórum (caso não tenha desativado a exibição deste link).

Como gerenciar no Painel administrativo

Configurar a permissão para visualizar

Pode escolher quem tem a permissão para ver este recurso através das "Permissões especiais". Esta configuração permite definir quais usuários verão ou não o: módulo na página inicial do fórum; a hiperligação no menu de navegação ou a página.

Por padrão, é permitido para todos (incluindo convidados).

A permissão para ver o item no menu de navegação, o módulo na página inicial do fórum e a página dedicada podem ser configurados aqui:

Painel de administração > Usuários e grupos > Permissões especiais > Imagens compartilhadas recentemente


Menu - Procurar Specia10

Configurar cada opção do recurso

Sabemos que, dependendo dos fóruns, da comunidade, do tema de discussão e de muitos outros critérios, as necessidades de cada um serão diferentes. É por isso que pode gerenciar cada opção:
  • Ativar "Imagens compartilhadas recentemente" no fórum
  • Mostrar a hiperligação na barra de navegação
  • Mostrar as imagens recentemente compartilhadas na página inicial
Painel de administração > Módulos > Permissões especiais > Configuração


Menu - Procurar Sdsd10


Até breve!
A tua equipa Forumeiros.  
por pedxz
em 21.11.22 15:50
 
Procurar em: Anúncios e atualizações
Tópico: Últimas imagens: Navegue pelas imagens e fotos compartilhadas
Respostas: 2
Vistos: 208

ModernBB: Agora é responsiva

Caso não tenha recebido este novo recurso no seu fórum é porque tem alguma edição dos templates album_moderate_body, groupcp_info_body, groupcp_pending_info, index_box, memberlist_body, overall_header, topics_list_box, viewcomments_body e viewtopic_body então é necessário adicionar manualmente na versão #ModernBB (Os administradores que não personalizaram esses templates não serão afetados por estas modificações incluídas nativamente nos templates padrões do fórum):

album_moderate_body:


groupcp_info_body:


groupcp_pending_info:


index_box:


memberlist_body:


overall_header:


topics_list_box:


viewcomments_body:


viewtopic_body:
por pedxz
em 15.11.22 14:35
 
Procurar em: Anúncios e atualizações
Tópico: ModernBB: Agora é responsiva
Respostas: 1
Vistos: 142

Alterar a imagem do cabeçalho

Detalhes da questão


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

Descrição


Gostaria de entender como adiciono um ícone ao fórum e uma capa!

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 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>
  <script type="text/javascript" src="https://illiweb.com/rs3/44/frm/mentions/tooltipster.js" ></script>
  <link rel="stylesheet" type="text/css" href="https://illiweb.com/rs3/44/frm/mentions/tooltipster.css" />
    <!-- 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}
 
 <!-- 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 -->
 $(document).ready(function() {
 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 -->
 });
 
 <!-- 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 type="text/javascript">
 //<![CDATA[
                (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
                    (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
                    m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
                })(window,document,'script','//www.google-analytics.com/analytics.js','ga');
 
                ga('create', '{G_ANALYTICS_ID}', 'auto');
                <!-- BEGIN google_analytics_code_bis -->
                ga('create', '{G_ANALYTICS_ID_BIS}', 'auto', 'bis');
                <!-- END google_analytics_code_bis -->
                ga('send', 'pageview');
                <!-- BEGIN google_analytics_code_bis -->
                ga('bis.send', 'pageview');
                <!-- END google_analytics_code_bis -->
            ga('set', 'anonymizeIp', true);
 <!-- BEGIN google_analytics_code_bis -->
 ga('bis.set', 'anonymizeIp', true);
 <!-- 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" rel="stylesheet" />
 <link href="https://code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css" rel="stylesheet" />
        <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.8.1/css/all.css" integrity="sha384-50oBUHEmvpQ+1lW4y57PTFmhCaXp0ML5d60M1M7uH2+nqUivzIebhndOJK28anvf" crossorigin="anonymous">
        <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css"/>
</head>
 
<body id="modernbb">
 <!-- BEGIN hitskin_preview -->
 <div id="hitskin_preview" style="display: block;">
 <h1><img src="{hitskin_preview.PATH_IMG_FA}hitskin/hitskin_logo.png" alt="" /> <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 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>
 <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 -->
 
 <a id="top" name="top" accesskey="t"></a>
 {JAVASCRIPT}
 
  <nav class="menu">
 <div class="menu-container">
 <div class="menu-link-wrapper">
 <a class="menu-link" href="/forum">
 <div class="icon forum"></div>
 <div class="text">Início</div>
 </a>
 <a class="menu-link" href="/portal">
 <div class="icon portal"></div>
 <div class="text">Portal</div>
                          </a>
 <a class="menu-link" href="/memberlist">
 <div class="icon membros"></div>
 <div class="text">Militares</div>
 </a>
 <a class="menu-link" href="/groups">
 <div class="icon grupos"></div>
 <div class="text">Grupos</div>
 </a>
 </div>
                  <a href="/forum"><div class="menu-logo"></div></a>
                  <div class="menu-social">
                        <a class="social-btn social-facebook" href="https://www.facebook.com/PoliciaRCC/" target="_blank"><i class="fab fa-facebook-f"></i></a>
                          <a class="social-btn social-twitter" href="https://twitter.com/JornalRevo" target="_blank"><i class="fab fa-twitter"></i></a>
                          <a class="social-btn social-youtube" href="https://www.youtube.com/channel/UCcwPHqJWiibA0i7RhjmlGqA" target="_blank"><i class="fab fa-youtube"></i></a>
                  </div>
 </div>
 </nav>
 
 <div id="page-header">
 <div class="headerbar">
        <div class="header-box">
                          <!-- BEGIN switch_user_logged_out -->
                    <div class="box-title">Área do Usuário</div>
                          <form action="{S_LOGIN_ACTION}" method="post" name="form_login">
                                <input type="text" class="login-inputbox" name="username" placeholder="{L_USERNAME}" required/>
 <input type="password" class="login-inputbox" name="password" placeholder="{L_PASSWORD}" required/>
                                  <input class="radio" type="checkbox" name="autologin" {AUTOLOGIN_CHECKED} hidden/>
                                  <input type="submit" class="login-btn login" name="login" value="{L_LOGIN}" />
                                  <input type="button" class="login-btn register" name="register" value="{L_REGISTER}" onclick="parent.location='{U_REGISTER}';" />
                          </form>
                          <!-- END switch_user_logged_out -->
                          <!-- BEGIN switch_user_logged_in -->
                          <div class="box-title">Olá, <script>document.write(_userdata.username)</script></div>
                          <div class="box-content">
                                <a href="/profile?mode=editprofile">Informações</a>
                                        <a href="/profile?mode=editprofile&page_profil=preferences">Preferências</a>
                                        <a href="/profile?mode=editprofile&page_profil=signature">Assinatura</a>
                                        <a href="/profile?mode=editprofile&page_profil=avatars">Avatar</a>
                                  <a href="/profile?mode=editprofile&page_profil=friendsfoes">Amigos e Ignorados</a>
                          </div>
                          <div class="box-avatar">
                                <img id="user-avatar" src=""/>
                                  <script>document.getElementById('user-avatar').src = "http://www.habbo.com.br/habbo-imaging/avatarimage?&user=" + _userdata.username + "&action=std,crr=6&direction=4&head_direction=3&img_format=png&gesture=sml&headonly=0&size=b";</script>
                          </div>
                          <div class="box-logout">
                                  <a href="/login?logout">
                                  <input type="button" class="login-btn logout" name="logout" value="Desconectar" />
                                  </a>
                                  <a href="/privmsg?folder=inbox" id="notify_link" data-status="{PRIVATE_MESSAGE_INFO}" title="{PRIVATE_MESSAGE_INFO}">
                                    <button type="button" class="login-btn mp" name="mp"></button>
                                  </a>
                                  <a href="/search?search_id=watchsearch" title="Notificações">
                                  <button type="button" class="login-btn notif" name="notif"></button>
                                  </a>
                        </div>
                          <!-- END switch_user_logged_in -->
                </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">
 <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">


Minha folha CSS:
Código:
/*  HEADER
**===================*/
 
/*--- MENU ---*/
.menu {
    width: 100%;
    position: fixed;
    top: 0;
    background-color: rgb(20,20,20);
    box-shadow: inset rgba(0, 0, 0, 0.20) 0px -2px 0px;
    height: 70px;
    z-index: 999;
}
 
.menu .menu-container {
    width: 95%;
    margin: 0 auto;
}
 
/*-- Links do menu --*/
.menu .menu-container .menu-link-wrapper {
    width: 40%;
    float: left;
}
 
.menu-link-wrapper .menu-link {
    background-color: rgba(190, 190, 190, 0.05);
    position: relative;
    display: inline-block;
    margin-right: 6px;
    width: 70px;
    height: 70px;
    cursor: pointer;
}
 
.menu-link-wrapper .menu-link .icon {
    width: 100%;
    filter: grayscale(100%);
    height: 70px;
    background-position: center;
    background-repeat: no-repeat;
}
 
.menu-link-wrapper .menu-link:hover .icon { filter: grayscale(0%); }
 
.menu-link-wrapper .menu-link .icon.forum { background-image: url(https://4.bp.blogspot.com/-3ld1TzBe_Zs/Wot_TvziG9I/AAAAAAABFbg/9EjzpIu6PdUxe6d4WgNHtZ1Wa7FA4jpwACKgBGAs/s1600/1519189552.png); }
.menu-link-wrapper .menu-link .icon.portal { background-image: url(https://1.bp.blogspot.com/-AWg9QQKijqM/WfCTjYd5AWI/AAAAAAAA-14/_0ww6jIm3KkcW3Q6PDsxIhAeHX7X6yWIwCKgBGAs/s1600/1628888838.png); }
.menu-link-wrapper .menu-link .icon.membros { background-image: url(https://3.bp.blogspot.com/-Ac1TicTk7H8/WRN4ZNQnXFI/AAAAAAAA3UU/jh-OTYnWjF8VubJFtPgwvGL9NipVjKxXgCKgB/s1600/fqjuFM1.png); }
.menu-link-wrapper .menu-link .icon.grupos { background-image: url(https://3.bp.blogspot.com/-VIsVh14BIkc/Waow4dJQtRI/AAAAAAAA8vE/50pmx7tnQQYK6L7JtSNOCBebZ3Io3h5PACKgBGAs/s1600/ARM31.gif); }
.menu-link-wrapper .menu-link .icon.hall { background-image: url(https://images.habbo.com/c_images/album1584/PT693.gif); }
 
.menu-link-wrapper .menu-link .text {
    border: 1px solid #2b2b2b;
    border-radius: 4px;
    background-color: #212121;
    box-shadow: 0 0 2px 1px rgba(255,255,255,.3) inset, 0 3px 9px rgba(0,0,0,.18);
    font-weight: 700;
    font-size: 1.3rem;
    line-height: 25px;
    color: #fff;
    position: absolute;
    bottom: -30px;
    left: -5px;
    z-index: 2;
    width: calc(100% + 5px + 5px);
    height: 28px;
    text-align: center;
    text-transform: uppercase;
    text-shadow: 0 1px 0 rgba(0,0,0,.18);
    opacity: 0;
    -webkit-transition: .3s opacity;
    -moz-transition: .3s opacity;
    transition: .3s opacity;
}
 
.menu-link-wrapper .menu-link:hover .text {
    opacity: 1;
    -webkit-transition: .3s opacity;
    -moz-transition: .3s opacity;
    transition: .3s opacity;
}
 
.menu-link-wrapper .menu-link .text:after {
    position: absolute;
    top: -8px;
    left: calc(50% - 7px);
    content: '';
    -webkit-filter: drop-shadow(0 3px 9px rgba(0,0,0,0.18));
    filter: drop-shadow(0 3px 9px rgba(0,0,0,0.18));
    height: 0;
    width: 0;
    border-left: 8px solid transparent;
    border-right: 8px solid transparent;
    border-bottom: 8px solid #464646;
}
 
/*-- Logo da RCC --*/
.menu .menu-container .menu-logo {
    background: url(https://www.imagemhost.com.br/images/2022/10/28/dpohabbo.png) no-repeat center center;
    float: left;
    width: 30%;
    height: 70px;
}
 
/*-- Links das redes sociais --*/
.menu .menu-container .menu-social {
    position: absolute;
    top: 15px;
    right: 10px;
}
 
.menu-social .social-btn {
    box-shadow: inset 0 3px rgba(255,255,255,0.15), inset 0 -3px rgba(0,0,0,0.15), 0 3px rgba(0,0,0,0.1);
    width: 40px;
    height: 40px;
    line-height: 40px;
    border: 1px solid rgba(0,0,0,0.2);
    border-radius: 20px;
    margin-top: 0px;
    text-align: center;
    color: #FFF;
    text-shadow: 0 4px rgba(0,0,0,0.2);
    font-size: 18px;
    float: left;
    padding: 5%;
    margin-right: 10px;
}
 
.menu-social .social-btn.social-facebook {
    background-color: rgb(80,113,156);
    background-image: linear-gradient(to bottom, rgb(80,113,156), rgb(55,80,115));
}
.menu-social .social-btn.social-facebook:active { background-image: linear-gradient(to top, rgb(80,113,156), rgb(55,80,115)); }
 
.menu-social .social-btn.social-twitter {
    background-color: rgb(56,161,243);
    background-image: linear-gradient(to bottom, rgb(56,161,243), rgb(13,123,210));
}
.menu-social .social-btn.social-twitter:active { background-image: linear-gradient(to top, rgb(56,161,243), rgb(13,123,210)); }
 
.menu-social .social-btn.social-youtube {
    background-color: rgb(237,56,51);
    background-image: linear-gradient(to bottom, rgb(237,56,51), rgb(194,22,17));
}
.menu-social .social-btn.social-youtube:active { background-image: linear-gradient(to top, rgb(237,56,51), rgb(194,22,17)); }
 
/*--- HEADER BOX ---*/
.header-box {
    background-image: linear-gradient(to bottom, rgba(0,0,0,0.3), rgba(0,0,0,0.8));
    width: 260px;
    height: 190px;
    border-radius: 10px;
    box-shadow: 0 3px rgba(0,0,0,0.15), 0 0 10px rgba(0,0,0,0.1), inset 0 -3px rgba(0,0,0,0.15);
    font-size: 13px;
    padding: 5px;
    color: #fff;
    text-shadow: 0 2px rgba(0,0,0,0.5);
    position: absolute;
    bottom: 5%;
    right: 5%;
}
 
.header-box .box-title {
    text-align: center;
    font-size: 20px;
}
 
.header-box .box-content {
    float: left;
    margin: 5px;
}
 
.box-content a {
    display: block;
    color: #fff;
}
.box-content a:hover { text-shadow: 0 0 5px; }
 
.header-box .box-avatar {
    float: right;
    margin-top: -5%;
}
 
.box-logout {
    float: left;
    width: 100%;
}
.login-inputbox {
    background-image: linear-gradient(to bottom, rgb(255,255,255), rgb(235,235,235));
    width: 240px;
    height: 40px;
    border: none;
    border-radius: 8px;
    margin: 5px;
    padding: 0 15px!important;
    font-size: 1em!important;
    cursor: auto!important;
    box-shadow: inset 0 -3px rgba(0,0,0,0.1), 0 0 4px rgba(0,0,0,0.15), 0 0 0 1px rgba(0,0,0,0.1);
}
.login-inputbox:hover, .login-inputbox:focus { border-bottom: none!important; }
 
.login-btn {
    height: 40px;
    border-radius: 8px!important;
    margin: 2px;
    box-shadow: 0 3px rgba(0,0,0,0.15), inset 0 -3px rgba(0,0,0,0.1), inset 0 1px rgba(255,255,255,0.3), 0 0 4px rgba(0,0,0,0.15)!important;
    color: #FFF;
    text-shadow: 0 2px rgba(0,0,0,0.2);
    text-transform: uppercase;
    font-weight: 500;
    font-size: 1.2rem;
    padding: 1px 10px!important;
    cursor: pointer!important;
}
 
.login-btn.login {
    background-image: linear-gradient(to bottom, rgb(80,113,156), rgb(55,80,115));
    border: 1px solid rgb(46,65,93);
    width: 140px!important;
}
.login-btn.login:active { background-image: linear-gradient(to top, rgb(80,113,156), rgb(55,80,115)); }
 
.login-btn.register {
    background-image: linear-gradient(to bottom, rgb(113,208,43), rgb(77,141,29));
    border: 1px solid rgb(48,88,18);
    width: 100px;
}
.login-btn.register:active { background-image: linear-gradient(to top, rgb(113,208,43), rgb(77,141,29)); }
 
.login-btn.logout {
    background-image: linear-gradient(to bottom, rgb(207,72,46), rgb(144,50,32));
    border: 1px solid rgb(102,36,23);
    width: 140px;
    margin-top: 0;
}
.login-btn.logout:active { background-image: linear-gradient(to top, rgb(207,72,46), rgb(144,50,32)); }
 
.login-btn.mp, .login-btn.notif {
    width: 48px;
    outline: none;
    font-size: 15px;
}
 
.login-btn.mp {
    background-image: linear-gradient(to bottom, rgb(255,165,0), rgb(179,116,0));
    border: 1px solid rgb(103,66,0);
}
.login-btn.mp:active { background-image: linear-gradient(to top, rgb(255,165,0), rgb(179,116,0)); }
.login-btn.mp:before {
    content: '\f0e0';
    font-family: 'Font Awesome 5 Free';
}
 
a[data-status*="Nova"] .login-btn.mp:after {
    content: '';
    width: 7px;
    height: 7px;
    background-color: red;
    border-radius: 50%;
    position: absolute;
    margin-left: -1%;
    margin-top: -.3%;
}
 
 
.login-btn.notif {
    background-image: linear-gradient(to bottom, rgb(113,208,43), rgb(77,141,29));
    border: 1px solid rgb(48,88,18);
}
.login-btn.notif:active { background-image: linear-gradient(to top, rgb(113,208,43), rgb(77,141,29)); }
.login-btn.notif:before {
    content: '\f0f3';
    font-family: 'Font Awesome 5 Free';
}
/*--- FÓRUNS E SUB-FÓRUNS ---*/
.forabg, .forumbg {
    background-color: transparent;
    box-shadow: 0 1px 6px rgba(0,0,0,0.06);
    margin-bottom: 24px;
}
 
.forabg .header, .forumbg .header {
    background-color: #ffbf00;
    border-radius: 3px;
    box-shadow: 0 2px 3px rgba(0,0,0,0.1), 0 0 2px rgba(0,0,0,0.1);
    color: #FFF;
    display: block;
    font-weight: 400;
    position: relative;
}
 
.btn-collapse i { font-size: 2.7rem!important; }
 
.forabg.hidden, .forumbg.hidden { background-color: transparent; }
 
.forabg.hidden .forums, .forumbg.hidden .forums { margin-top: 0; }
 
ul.forums, ul.topics {
    background-color: #fff;
    border-radius: 3px;
    box-shadow: 0 2px 3px rgba(0,0,0,0.1), 0 0 2px rgba(0,0,0,0.1);
    display: block;
    line-height: 22px;
    margin-top: 6px;
}
 
.topiclist .row {
    border-color: #f0f0f0;
    border-style: solid;
    border-width: 1px 0 0;
}
 
ul.topiclist.topics dd { padding: 8px 0; }
 
ul.topics .row dd.dterm, ul.topics .row dt { padding: 9px 18px 9px 30px; }
 
ul.forums dl.icon dd.dterm > div {
    margin-left: 30px!important;
    color: #777;
}
 
dd.dterm > div br { display: none; }
 
a.forumtitle:link,
a.forumtitle:visited,
a.topictitle:link,
a.topictitle:visited {
    color: #263238;
    margin-bottom: 1%;
}
 
dd.posts, dd.topics, dd.views { font-size: 16px; }
 
dd.posts span, dd.topics span, dd.views span {
    clear: both;
    color: #797979;
    display: block;
    font-size: 13px;
}
 
dd.lastpost span br:nth-child(3) { display: none!important; }
 
dd.lastpost span.color-groups { float: none!important; }
 
.lastpost-avatar { padding: 0 18px 0 0; }
 
.lastpost-avatar:after { top: 0; }
 
dd.lastpost > span > strong:before {
    content: "por";
    font-weight: 300;
    margin: 0 5px;
}
 
/*-- Forum Header --*/
.sub-header-info { width: 100%; }
 
h1.page-title {
    display: block;
    font-size: 30px;
    font-weight: 400;
    margin: 0 0 16px;
}
 
.sub-header-path {
    background-color: #263238;
    border-radius: 3px;
    clear: both;
    color: #fff;
    display: inline-block;
    font-size: 0;
    margin-bottom: 22px;
    max-width: 100%;
    overflow: hidden;
    position: relative;
    white-space: nowrap;
}
 
.sub-header-path a {
    border-radius: 3px;
    color: #fff;
    display: inline-block;
    font-size: 13px;
    padding: 9px 16px;
    position: relative;
}
 
.sub-header-path a:first-child { padding: 9px 16px!important; }
 
.sub-header-path a + a { margin-left: 0; }
 
.sub-header-path a + a:before {
    font-size: 16px;
    left: 0;
    pointer-events: none;
    position: absolute;
    top: 50%;
    transform: translate3d(-50%,-50%,0);
}
 
.sub-header-path a:hover { background-color: rgba(0,0,0,0.44); }
 
.sub-header-path a:last-child:after {
    bottom: 0;
    box-shadow: 0 0 11px 16px #263238;
    content: "";
    display: block;
    position: absolute;
    right: -5px;
    top: 0;
    transition: all .16s ease;
    width: 5px;
}
 
.sub-header-path a:hover:after {
    -ms-filter: brightness(50%);
    -webkit-filter: brightness(50%);
    filter: brightness(50%);
}
 
.topic-actions-buttons > a, .topic-actions-buttons > span { margin: 0 0 0 18px; }
 
.plus-menu-wrap { float: left; }
 
.topic-actions-buttons #plus_menu {
    left: auto!important;
    right: auto!important;
}
.fa-group:before, .fa-users:before {
    content: "\f0c0";
}
.fa {
    display: inline-block;
    font: normal normal normal 14px/1 FontAwesome;
    font-size: inherit;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    transform: translate(0, 0);
}
.fa-calendar:before {
    content: "\f073";
}
.fa-user:before {
    content: "\f007";
}
/*---RANKS---*/
.rank {
    color: #fff;
    font-size: 13px;
    font-weight: 700;
    height: 40px;
    line-height: 40px;
    margin: 10px auto 0;
    width: 200px;
    padding: 0 5px;
    border-radius: 4px;
    border-bottom: 2px solid rgba(0,0,0,0.2);
}
.rank:before {
    float: left;
    width: 40px;
    height: 40px;
    line-height: 40px;
    left: 5px;
    background-color: rgba(255,255,255,0.2);
    text-align: center;
    font-size: 15px;
    color: #fff;
    font-family: 'Font Awesome 5 Free';
}
@keyframes rainbow {0% {background-position: 0% 82%;} 50% {background-position: 100% 19%;} 100% {background-position: 0% 82%;}}
 
/* Ranks Administrativos*/
.rank.supr{
    background-image: linear-gradient(124deg, #FF0000, #FF7F00, #FFFF00, #00FF00, #0000ff, #4b0082, #8f00ff);
    background-size: 1800% 1800%;
    animation: rainbow 5s linear infinite;
}
.rank.supr:before {
    content: "\f521";
    margin-right: 5px;
    font-family: "Font Awesome 5 Free";
}
 
.rank.tec {
    background: linear-gradient(to right, #000000, #ff2400, #e81d1d, #e8b71d, #e3e81d, #1de840, #1ddde8, #2b1de8, #dd00f3, #c0c0c0, #FFFFFF);
    background-size: 1800% 1800%;
    animation: rainbow 10s ease infinite;
}
.rank.tec:before {
    content: "\f121";
    margin-right: 5px;
    font-family: "Font Awesome 5 Free";
}
 
.rank.p2 {
    background-image: linear-gradient(to right, #000000, #004002, #040038, #a98a01, #115000);
    background-size: 1800% 1800%;
    animation: rainbow 6s linear infinite;
}
.rank.p2:before {
    content: "\f21b";
    margin-right: 5px;
    font-family: "Font Awesome 5 Free";
}
 
.rank.oficial {
    background-image: linear-gradient(to left, #009688 0%, #009688 100%);
}
.rank.oficial:before {
    content: "\f4fe";
    margin-right: 5px;
    font-family: "Font Awesome 5 Free";
}
 
.rank.cor {
    background-image: linear-gradient(to right, #666666, #5c5c5c, #525252, #484848, #3f3f3f, #373737, #2f2f2f, #282828, #202020, #181818, #0e0e0e, #000000);
}
.rank.cor:before {
    content: "\f0e3";
    margin-right: 5px;
    font-family: "Font Awesome 5 Free";
}
 
.rank.bope {
    background: repeating-linear-gradient(to right, #100E0E, #696969);
    background-size: 1800% 1800%;
    animation: rainbow 1.8s ease infinite;
}
.rank.bope:before {
    content: "\f714";
    margin-right: 5px;
    font-family: "Font Awesome 5 Free";
}
 
.rank.sa {
    background-image: linear-gradient(to right, #00BF9F, #00ab8e, #008f77, #007562);
}
.rank.sa:before{
    content: "\f2bb";
    margin-right: 5px;
    font-family: "Font Awesome 5 Free";
}
 
.rank.sof {
    background-image: linear-gradient(to left, #C4B868 0%, #C4B868 100%);
}
.rank.sof:before {
    content: "\f201";
    margin-right: 5px;
    font-family: "Font Awesome 5 Free";
}
 
.rank.srp {
    background: linear-gradient(to left, #F0A000 0%, #F0A000 100%);
}
.rank.srp:before {
    content: "\f482";
    margin-right: 5px;
    font-family: "Font Awesome 5 Free";
}
 
/*Ranks dos UsuÃÆâ€:tm:¡rios*/
 
.rank.mbr {
    background: linear-gradient(to left, #78866B, #626e58, #515c49, #434d3c);
}
.rank.mbr:before {
    content: "\f007";
    margin-right: 5px;
    font-family: "Font Awesome 5 Free";
}
 
.rank.ins {
    background: linear-gradient(to left, #1D399E 0%, #1D399E 100%);
}
.rank.ins:before {
    content: "\f19d";
    margin-right: 5px;
    font-family: "Font Awesome 5 Free";
}
 
.rank.tre {
    background: linear-gradient(to left, #F21818 0%, #F21818 100%);
}
.rank.tre:before {
    content: "\f19d";
    margin-right: 5px;
    font-family: "Font Awesome 5 Free";
}
 
.rank.sup {
    background: linear-gradient(to left, #2BCF02 0%, #2BCF02 100%);
}
.rank.sup:before {
    content: "\f19d";
    margin-right: 5px;
    font-family: "Font Awesome 5 Free";
}
 
.rank.mkt {
    background: linear-gradient(to left, #f719ff 0%, #f719ff 100%);
}

.rank.sup:before {
    content: "\f19d";
    margin-right: 5px;
    font-family: "Font Awesome 5 Free";
}

.rank.prof {
    background: linear-gradient(to left, #821F82 0%, #821F82 100%);
}

.rank.prof:before {
    content: "\f19d";
    margin-right: 5px;
    font-family: "Font Awesome 5 Free";
}
 
.rank.apol {
    background: linear-gradient(to left, #A1A1A1 0%, #A1A1A1 100%);
}
.rank.apol:before {
    content: "\f549";
    margin-right: 5px;
    font-family: "Font Awesome 5 Free";
}
 
.rank.medalha {
    background: linear-gradient(to left, #c4ad00, #ad9900, #9e8c00, #827301);
}
.rank.medalha:before {
    content: "\f5a2";
    margin-right: 5px;
    font-family: "Font Awesome 5 Free";
}

a[href="/g2-fundacao"]::before {
content: '\f121 ';
font-family: 'FontAwesome';
}

/* AVATAR RETANGULAR */
.post .postprofile-avatar img {
    width: unset;
    height: unset;
    border-radius: 0;
    max-height: 250px;
}
/* EMBLEMAS */
.field_badge {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  flex-flow: row wrap;
  justify-content: space-around;
  width: 100%!important;
}
 
.field_badge td {
    position: relative;
    display: inline-flex;
}
 
.field_badge td > img {
    background: #fff;
    padding: 4px;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
    -moz-box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
    -webkit-box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
    border-radius: 4px;
    height: 35px !important;
    margin: auto 4px 4px auto;
    vertical-align: middle;
    width: 35px !important;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
 
.field_badge tbody > tr > td[data-title]:hover::before {
    content: attr(data-title);
    display: block!important;
    background: #47525D;
    padding: .5em 1em;
    position: absolute;
    white-space: nowrap;
    width: auto;
    z-index: 999;
    font-size: 10px!important;
    color: #fff;
    pointer-events: none;
    bottom: 100%;
    left: 50%;
    margin-bottom: 10px;
    transform: translate(-50%, 4px);
    transform-origin: top;
    white-space: normal;
    transition: all 0.18s ease-out 0.18s;
}
 
.field_badge br, .field_badge img img { display: none!important; }

por nicolas79789
em 29.10.22 16:22
 
Procurar em: Questões resolvidas sobre a aparência do fórum
Tópico: Alterar a imagem do cabeçalho
Respostas: 5
Vistos: 195

Alterar lugar da rádio

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 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}
 
  <!-- 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 -->
            $(document).ready(function() {
              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 -->
      });
 
      <!-- 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/6 - popupWidth/6
                    });
                });
            });
      <!-- 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 type="text/javascript">
      //<![CDATA[
      (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
      (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
            m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
      })(window,document,'script','//www.google-analytics.com/analytics.js','ga');
 
      ga('create', '{G_ANALYTICS_ID}', 'auto');
      ga('send', 'pageview');
      ga('set', 'anonymizeIp', true);
 
      <!-- BEGIN google_analytics_code_bis -->
      ga('create', '{G_ANALYTICS_ID_BIS}', 'auto', 'bis');
      ga('bis.send', 'pageview');
      ga('bis.set', 'anonymizeIp', true);
      <!-- 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" rel="stylesheet" />
  <link href="https://fonts.googleapis.com/css?family=Amatic+SC&display=swap" rel="stylesheet">
  <link href="https://fonts.googleapis.com/css?family=Permanent+Marker&display=swap" rel="stylesheet">
  <link href="https://code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css" rel="stylesheet" />
    <link href="https://use.fontawesome.com/releases/v5.10.2/css/all.css" rel="stylesheet" />
    <!-- BEGIN switch_user_logged_out -->
   
        <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/magnific-popup.js/1.1.0/magnific-popup.css" integrity="sha256-RdH19s+RN0bEXdaXsajztxnALYs/Z43H/Cdm1U4ar24=" crossorigin="anonymous" />
    <!-- END switch_user_logged_out -->
</head>
 
<body id="modernbb">
  <!-- BEGIN hitskin_preview -->
      <div id="hitskin_preview" style="display: block;">
        <h1><img src="{hitskin_preview.PATH_IMG_FA}hitskin/hitskin_logo.png" alt="" /> <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 switch_login_popup -->
      <div id="login_popup" style="z-index: 10000 !important;">
        <div class="h6">{SITENAME}</div>
            <div id="login_popup_message">
                {LOGIN_POPUP_MSG}
            </div>
        <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 -->
         
                  <a id="top" name="top" accesskey="t"></a>
                {JAVASCRIPT}
 
  <a id="top" name="top" accesskey="t"></a>
  {JAVASCRIPT}
 
  <div id="page-header">
      <div class="headerbar"></div>
            <!-- BEGIN switch_user_logged_out -->
            <div id="login-dialog" class="login-popup zoom-anim-dialog mfp-hide">
                  <h3 class="aside-title">LOGAR NO FÓRUM</h3>
                  <form action="{S_LOGIN_ACTION}" 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}" required/>
                    <i class="fas fa-user"></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}" required/>
                    <i class="fas fa-key"></i>
                    </label>
                    <div style="font-size: 15px; margin-bottom: 5%;">
                      <input class="radio" id="autologin-check" type="checkbox" name="autologin" {AUTOLOGIN_CHECKED}/>
                        <label for="autologin-check">Manter-me conectado.</label>
                    </div>
                    <button type="submit" class="rounded-button" id="doLogin" name="login">Vamos lá!</button>
                  </form>
                </div>
            <!-- END switch_user_logged_out -->
     
            <nav id="main-menu">
                          <div class="wrap">
                                  <div class="navbar-content">
                                  <ul class="navbar-links">
                                        <a href="/forum"><li><i class="fas fa-home"></i>Início</li></a>
                                              <a href="/groups"><li><i class="fas fa-user-friends"></i>Grupos</li></a>
                                              <a href="/memberlist"><li><i class="fas fa-users"></i>Membros</li></a>
                                                <a href="/privmsg?folder=inbox"><li><i class="fas fa-mail-bulk"></i>Mensagens Privadas</li></a>
                                      <a href="/h2-"><li><i class="fas fa-edit"></i>Realizar registro</li></a>
                                   
                                 
                                                                                                   
                                    <div class="navbar-user">
                                          <div class="is-normal">
                                            <input type="checkbox" href="#" class="user-menu-open" name="user-menu-open" id="user-menu-open" />
                                            <label class="user-menu-open-button" for="user-menu-open">
                                              <div class="avatar">
                                                <!-- BEGIN switch_user_logged_in -->
                                                <script type="text/javascript">
                                                  //<![CDATA[
                                                  $(function() {
                                                      'use strict';
                                             
                                                      $('.avatar').append("<img src='http://www.habbo.com.br/habbo-imaging/avatarimage?user=" + _userdata.username + "&action=std&direction=4&head_direction=3&gesture=sml&size=b' title='Clique para mais opções'/>");
                                                      $('.avatar img').css('left', '10px');
                                                      $('.avatar img').css('top', '-5px');
                                                  });
                                                  //]]>
                                                </script>
                                                <!-- END switch_user_logged_in -->
                                                <!-- BEGIN switch_user_logged_out -->
                                                  <img src="https://i.imgur.com/D2vHls4.png" />
                                                <!-- END switch_user_logged_out -->
                                              </div>
                                            </label>
                                            <!-- BEGIN switch_user_logged_in -->
                                            <a href="/profile?mode=editprofile" title="Editar o meu perfil" class="user-item blue"><i class="fas fa-user-cog"></i></a>
                                            <a href="/privmsg?folder=inbox" data-status="{PRIVATE_MESSAGE_INFO}" title="{PRIVATE_MESSAGE_INFO}" class="user-item green"><i class="fas fa-envelope"></i></a>
                                            <a href="/login?logout=1" title="Fechar sessão" class="user-item red"><i class="fas fa-sign-out-alt"></i></a>
                                            <!-- END switch_user_logged_in -->
                                            <!-- BEGIN switch_user_logged_out -->
                                            <a title="Iniciar sessão" class="user-item blue login-btn"><i class="fas fa-sign-in-alt"></i></a>
                                            <a href="/register" title="Registrar-se" class="user-item green"><i class="fas fa-user-plus"></i></a>
                                            <a href="/profile?mode=sendpassword" title="Esqueci minha senha" class="user-item red"><i class="fas fa-question"></i></a>
                                            <!-- END switch_user_logged_out -->
                                          </div>
                                   
                                   
                                            </div>
                                          </div>
                                      </div>
                                  </div>
                            </div>
                    </nav>
 
      <!-- BEGIN switch_ticker_new -->
    <div style="position: fixed; bottom: 25px; left: 25px; z-index: 999999;">
    <span class="radio-iframe-close" aria-label="Toggle" style="font-size: 1.5rem; color: #fff; position: absolute; top: 0; background: #15134C; padding: .25rem;">Ocultar</span>
    <iframe class="radio-iframe" src="https://stream.truesecurity.com.br/8006/stream" style="width: 314px;height: 156px;border: 0;" allow="autoplay; fullscreen" scrolling="no"></iframe>
  </div>
      <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">
  <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">
por wizardkiller.:.
em 30.09.22 19:36
 
Procurar em: Questões resolvidas sobre a aparência do fórum
Tópico: Alterar lugar da rádio
Respostas: 5
Vistos: 249

Tirar o sublinhado na hiperligação

Detalhes da questão


Endereço do fórum: https://rpghogwartsobliviate.forumeiros.com/forum
Versão do fórum: PunBB

Descrição


Bom Dia!,

Quero saber como tiro esse efeito sublinhado sobre os nomes dos usuários no Quem está Online e Tópicos conforme mostrado nas imagens abaixo.

Menu - Procurar KnJ1svh

Menu - Procurar V4oKMcx


Meu CSS:
Código:
/******     CONFIGURAÇÃO DO CORPO      ( NÃO MEXER )       ********/
.body{
  padding: 10px;
  background-attachment:scroll;
  background-color:#fff;
  background-image:url(https://i.servimg.com/u/f46/15/96/56/76/2nqe1e10.jpg);
}

.sidebar {
background-image: url(http://i.imm.io/P5EE.png);
text-align: justify;
top: 0px;
width: 250px;
}

.inputbox autowidth {
  border: 1px solid #000000;
-moz-border-radius: 6px;
background-image: url(https://2img.net/h/oi48.tinypic.com/20jmk44.jpg);
color:#404040;
font-size: 10px;
  }

td.catHead, th.thHead {
  text-align:center;
background-color: #080808;
font-size: 10px;
padding: 10px;
font-family:arial;
text-transform: uppercase;
}

.woaned {
background-image: url(http://i.imm.io/P77s.png);
text-align:center;
font-size: 10px;
padding: 10px;
font-family:arial;
text-transform: uppercase;
letter-spacing: 5px;
}

.select, textarea{
border: 1px solid #8E7264;
color: #404040;
font-size: 10px;
 }

body.chatbox {
background-image: url(https://www.hitskin.com/themes/14/44/31/i_background.gif);
background-size: 500px 500px;
opacity:.70;
}

.chatbox_row_1 , .chatbox_row_2 {
background-image: url(http://i.imm.io/P77s.png);
padding: 4px;
}

td.catBottom, th.thBottom {
border-width: 0 1px 1px;
background-color:#000;
}

.seconda{
text-transform: uppercase;
  text-align: left;
}


.forumline {
background-color: #000000;
border-bottom: 2px solid #1B1716;
border-left: 1px solid #000000;
border-right: 1px solid #000000;
border-top: 1px solid #000000;
}

td.cat, td.catbottom, td.cathead, td.catleft, td.catright, td.catsides {
background-color: #000;
opacity: 0.5;
text-align: center;
border: 1px solid #000000;
height: 28px;
}

.bodyline {
background-image: url(https://i.servimg.com/u/f45/15/65/31/89/vhg1111.png);
border-left: 5px solid #000000;
border-right: 5px solid #000000;
}


.navbar {
background-color: #101010;
height: 15px;
width: 100%;
text-align: center;
vertical-align: middle;
position: absolute;
top: 0px;
left: 0px;
padding: 13px;
}

a.mainmenu img:hover {
opacity:.90;
-webkit-transition: opacity 0.7s ease;
-moz-transition: opacity 0.7s ease;
-o-transition: opacity 0.7s ease;
transition: opacity 0.7s ease;
}

a.mainmenu img {
opacity:.50;
}

a.topictitle{
text-transform: uppercase;
}

.portoloin_groupe:hover {
display: block;
width: 136px;
height: 63px;
transition: all 1s;
-moz-transition: all 1s;
-o-transition: all 1s;
-webkit-transition: all 1s;
-htm-transition: all 1s;
}

.portoloin_groupe {
display: block;
width: 100%;
height: 163px;
transition: all 1s;
-moz-transition: all 1s;
-o-transition: all 1s;
-webkit-transition: all 1s;
-htm-transition: all 1s;
}

hr {
color:#3D3833;
  border: solid #3D3833 0;
}

/******     FIM DO CORPO      ( NÃO MEXER )       ********/


/******     APAGANDO OPÇÃO DE FAQ e BUSCA      ( ADICIONAR OUTRAS ABAS QUE DESEJA APAGAR )       ********/
a.mainmenu[href="/faq"]{
display: none !important;
}

.mainmenu[href="/search"] {
  display: none;
}
/******               FINAL DO MENU APAGADO                       ********/

/******     PAGINA DO PROFETA DIARIO  ALERTA!!!!!!      ( NÃO MEXER )   !!!!!!!    ********/
.dailyhead {
    width: 715px;
    height: 218px;
    background: url(https://i.imgur.com/LgAOUdF.jpg);
}
.dailybody {
    width: 715px;
    background-image: url(https://i.imgur.com/rUrMPsT.jpg);
}
/******     PAGINA DO PROFETA DIARIO  ALERTA!!!!!!      ( NÃO MEXER )   !!!!!!!    ********/

por LewisSmooken
em 06.06.22 15:29
 
Procurar em: Questões resolvidas sobre a aparência do fórum
Tópico: Tirar o sublinhado na hiperligação
Respostas: 3
Vistos: 294

Página HTML personalizada

Bom dia, troque o HTML por esse
Código:
<style type="text/css">
h1 {
  color: #00ffff !important;
  font-size: 3.25rem !important;
}
.mbr-arrow > a > i {
   top: 12px !important;
}
.mbr-fullscreen {
  background-image: url('https://i.servimg.com/u/f81/19/81/73/45/azul-e10.jpg');
}
</style>
    <html>
    <head>
      <!--  Site made with Mobirise Website Builder v4.3.4, https://mobirise.com  -->
      <meta charset="UTF-8"/>
        <meta http-equiv="X-UA-Compatible" content="IE=edge"/>
        <meta name="generator" content="Mobirise v4.3.4, mobirise.com"/>
        <meta name="viewport" content="width=device-width, initial-scale=1"/>
        <link rel="shortcut icon" href="" type="image/x-icon"/>
        <meta name="description" content=""/>
        <title>Bem vindo a Tech Gamer X</title>
      <link rel="stylesheet" href="https://punishersamp.github.io/lsr2/assets/web/assets/mobirise-icons/mobirise-icons.css"/>
      <link rel="stylesheet" href="https://punishersamp.github.io/lsr2/assets/tether/tether.min.css"/>
      <link rel="stylesheet" href="https://punishersamp.github.io/lsr2/assets/bootstrap/css/bootstrap.min.css"/>
      <link rel="stylesheet" href="https://punishersamp.github.io/lsr2/assets/bootstrap/css/bootstrap-grid.min.css"/>
      <link rel="stylesheet" href="https://punishersamp.github.io/lsr2/assets/bootstrap/css/bootstrap-reboot.min.css"/>
      <link rel="stylesheet" href="https://punishersamp.github.io/lsr2/assets/dropdown/css/style.css"/>
      <link rel="stylesheet" href="https://punishersamp.github.io/lsr2/assets/theme/css/style.css"/>
      <link rel="stylesheet" href="https://punishersamp.github.io/lsr2/assets/mobirise/css/mbr-additional.css" type="text/css"/>
      <link href="https://fonts.googleapis.com/css2?family=Rubik:wght@300;400;500;700;900&display=swap" rel="stylesheet"/>
    </head>
    <body>
   
   
   
   <section class="menu cid-qyd5JGS5lG" once="menu" id="menu1-j" data-rv-view="95">
 

    <nav class="navbar navbar-expand beta-menu navbar-dropdown align-items-center navbar-fixed-top navbar-toggleable-sm">
        <button class="navbar-toggler navbar-toggler-right" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
            <div class="hamburger">
                <span></span>
                <span></span>
                <span></span>
                <span></span>
            </div>
        </button>
        <div class="collapse navbar-collapse" id="navbarSupportedContent">
            <ul class="navbar-nav nav-dropdown" data-app-modern-menu="true"></ul>
            <div class="navbar-buttons mbr-section-btn"><a class="btn btn-sm btn-primary display-4"><span class=""></span>Tech Gamers X</a></div>
        </div>
    </nav>
</section>

 
 <section class="mbr-fullscreen mbr-parallax-background" id="header2-l" data-rv-view="97">   

    <div class="container align-center">
        <div class="row justify-content-md-center">
            <div class="mbr-white col-md-10">
            <h1 class="mbr-section-title mbr-bold pb-3 mbr-fonts-style display-1">BEM VINDO A TECH GAMER X</h1>
                <div class="mbr-section-btn">
               <a class="btn btn-md btn-primary-outline display-4" href="/register"><span class="mbri-edit mbr-iconfont mbr-iconfont-btn"></span>CRIAR CONTA</a>
               <a class="btn btn-md btn-primary-outline display-4" href="/forum"><span class="mbri-home mbr-iconfont mbr-iconfont-btn"></span>FÓRUM</a>
               <a class="btn btn-md btn-primary-outline display-4" href="https://tech-gamerx.blogspot.com/"><span class="mbri-edit2 mbr-iconfont mbr-iconfont-btn"></span>REGRAS</a>
               <a class="btn btn-md btn-primary-outline display-4" href="https://discordapp.com/invite/fVVnFJ8"><span class="mbri-globe mbr-iconfont mbr-iconfont-btn"></span>BLOG</a>
            </div>
            </div>
        </div>
    </div>
   
    <div class="mbr-arrow hidden-sm-down" aria-hidden="true">
        <a href="#next">
            <i class="mbri-down mbr-iconfont"></i>
        </a>
    </div>
</section>
 
<section once="" class="cid-qydaQVk06N" id="footer6-o" data-rv-view="100">   

    <div class="container">
        <div class="media-container-row align-center mbr-white">
            <div class="col-12">
                <p class="mbr-text mb-0 mbr-fonts-style display-7">
                    © Copyright 2017 Light Speed Racing - Desenvolvido por Punisher</p>
            </div>
        </div>
    </div>
</section>
 
  <script src="https://punishersamp.github.io/lsr2/assets/web/assets/jquery/jquery.min.js"></script>
  <script src="https://punishersamp.github.io/lsr2/assets/popper/popper.min.js"></script>
  <script src="https://punishersamp.github.io/lsr2/assets/tether/tether.min.js"></script>
  <script src="https://punishersamp.github.io/lsr2/assets/bootstrap/js/bootstrap.min.js"></script>
  <script src="https://punishersamp.github.io/lsr2/assets/smooth-scroll/smooth-scroll.js"></script>
  <script src="https://punishersamp.github.io/lsr2/assets/dropdown/js/script.min.js"></script>
  <script src="https://punishersamp.github.io/lsr2/assets/touch-swipe/jquery.touch-swipe.min.js"></script>
  <script src="https://punishersamp.github.io/lsr2/assets/jarallax/jarallax.min.js"></script>
  <script src="https://punishersamp.github.io/lsr2/assets/theme/js/script.js"></script>
 
 
  </body>
  </html>


Caso queira alterar a cor ou outra coisa, leia o meu post, nesse tópico.
por Harleen
em 02.06.22 15:07
 
Procurar em: Questões resolvidas sobre HTML e BBCode
Tópico: Página HTML personalizada
Respostas: 3
Vistos: 336

Página HTML personalizada

Detalhes da questão


Endereço do fórum: https://tech-gamers.forumbrasil.net/
Versão do fórum: ModernBB

Descrição


Boa noite, gostaria de alterar essa página inicial:

Código:
         
<!--  Site made with Mobirise Website Builder v4.3.4, https://mobirise.com  -->      <meta charset="UTF-8" />      <meta content="IE=edge" http-equiv="X-UA-Compatible" />        <meta content="Mobirise v4.3.4, mobirise.com" name="generator" />        <meta content="width=device-width, initial-scale=1" name="viewport" />        <link type="image/x-icon" href="https://punishersamp.github.io/lsr2/assets/images/15wmaok-56x60.png" rel="shortcut icon" />        <meta content="" name="description" />      <title>Home</title>        <link href="https://punishersamp.github.io/lsr2/assets/web/assets/mobirise-icons/mobirise-icons.css" rel="stylesheet" />        <link href="https://punishersamp.github.io/lsr2/assets/tether/tether.min.css" rel="stylesheet" />        <link href="https://punishersamp.github.io/lsr2/assets/bootstrap/css/bootstrap.min.css" rel="stylesheet" />        <link href="https://punishersamp.github.io/lsr2/assets/bootstrap/css/bootstrap-grid.min.css" rel="stylesheet" />        <link href="https://punishersamp.github.io/lsr2/assets/bootstrap/css/bootstrap-reboot.min.css" rel="stylesheet" />        <link href="https://punishersamp.github.io/lsr2/assets/dropdown/css/style.css" rel="stylesheet" />        <link href="https://punishersamp.github.io/lsr2/assets/theme/css/style.css" rel="stylesheet" />        <link type="text/css" href="https://punishersamp.github.io/lsr2/assets/mobirise/css/mbr-additional.css" rel="stylesheet" />                          <section data-rv-view="95" id="menu1-j" once="menu" class="menu cid-qyd5JGS5lG">                  <nav class="navbar navbar-expand beta-menu navbar-dropdown align-items-center navbar-fixed-top navbar-toggleable-sm">            </nav></section>
<button style="" aria-label="Toggle navigation" aria-expanded="false" aria-controls="navbarSupportedContent" data-target="#navbarSupportedContent" data-toggle="collapse" type="button" class="navbar-toggler navbar-toggler-right">
                
 <div class="hamburger">
                    <span></span>                    <span></span>                    <span></span>                    <span></span>                
 </div>
            
</button><section data-rv-view="95" id="menu1-j" once="menu" class="menu cid-qyd5JGS5lG"><nav class="navbar navbar-expand beta-menu navbar-dropdown align-items-center navbar-fixed-top navbar-toggleable-sm">            </nav></section>
<div style="" class="menu-logo">
                
 <div class="navbar-brand">
                    <span class="navbar-logo">                        <a href="https://mobirise.com">                          <img style="height: 3.8rem;" media-simple="true" title="" alt="Mobirise" src="https://punishersamp.github.io/lsr2/assets/images/15wmaok-56x60.png" />                        </a>                    </span>                    <span class="navbar-caption-wrap"><a href="https://mobirise.com" class="navbar-caption text-primary display-4"> Light Speed Racing</a></span>                
 </div>
            
</div><section data-rv-view="95" id="menu1-j" once="menu" class="menu cid-qyd5JGS5lG"><nav class="navbar navbar-expand beta-menu navbar-dropdown align-items-center navbar-fixed-top navbar-toggleable-sm">            </nav></section>
<div style="" id="navbarSupportedContent" class="collapse navbar-collapse">
                
 <ul data-app-modern-menu="true" class="navbar-nav nav-dropdown">
 <li class="nav-item">
                        <a href="http://www.nwdgames.com" class="nav-link link text-white display-4">                            <span class="mbri-home mbr-iconfont mbr-iconfont-btn"></span>                            NWD Games</a>                    
 </li>
 </ul>
                
 <div class="navbar-buttons mbr-section-btn">
 <a href="https://mobirise.com" class="btn btn-sm btn-primary display-4"><span class="mbri-rocket mbr-iconfont mbr-iconfont-btn"></span>                                              JOGAR NWD</a>
 </div>
            
</div><section data-rv-view="95" id="menu1-j" once="menu" class="menu cid-qyd5JGS5lG"><nav class="navbar navbar-expand beta-menu navbar-dropdown align-items-center navbar-fixed-top navbar-toggleable-sm">        </nav>    </section>      <section class="engine"><a href="https://mobirise.co/q">bootstrap slider</a></section><section data-rv-view="97" id="header2-l" class="cid-qyd8CmdMtf mbr-fullscreen mbr-parallax-background">                          </section>
<div style="" class="container align-center">
            
 <div class="row justify-content-md-center">
                
 <div class="mbr-white col-md-10">
                    
 <h1 class="mbr-section-title mbr-bold pb-3 mbr-fonts-style display-1">
 BEM VINDO AO FÓRUM
 </h1>
                                                        
 <div class="mbr-section-btn">
 <a href="http://lsr-nwd.forumeiros.com/register" class="btn btn-md btn-primary-outline display-4"><span class="mbri-edit mbr-iconfont mbr-iconfont-btn"></span>CRIAR CONTA</a> <a href="https://discordapp.com/invite/fVVnFJ8" class="btn btn-md btn-primary-outline display-4"><span class="mbri-mobile2 mbr-iconfont mbr-iconfont-btn"></span>DISCORD</a> <a href="http://lsr-nwd.forumeiros.com/forum" class="btn btn-md btn-primary-outline display-4"><span class="mbri-home mbr-iconfont mbr-iconfont-btn"></span>FÓRUM</a>
 </div>
                
 </div>
            
 </div>
        
</div><section data-rv-view="97" id="header2-l" class="cid-qyd8CmdMtf mbr-fullscreen mbr-parallax-background">        </section>
<div style="" aria-hidden="true" class="mbr-arrow hidden-sm-down">
            <a href="#next">                <em class="mbri-down mbr-iconfont"></em>            </a>        
</div><section data-rv-view="97" id="header2-l" class="cid-qyd8CmdMtf mbr-fullscreen mbr-parallax-background">    </section>      <section data-rv-view="100" id="footer6-o" class="cid-qydaQVk06N" once="">                          </section>
<div style="" class="container">
            
 <div class="media-container-row align-center mbr-white">
                
 <div class="col-12">
                    
 <p class="mbr-text mb-0 mbr-fonts-style display-7">
                        :copyright: Copyright 2017 Light Speed Racing - Desenvolvido por Punisher
 </p>
                
 </div>
            
 </div>
        
</div><section data-rv-view="100" id="footer6-o" class="cid-qydaQVk06N" once="">    </section>          <script src="https://punishersamp.github.io/lsr2/assets/web/assets/jquery/jquery.min.js"></script>      <script src="https://punishersamp.github.io/lsr2/assets/popper/popper.min.js"></script>      <script src="https://punishersamp.github.io/lsr2/assets/tether/tether.min.js"></script>      <script src="https://punishersamp.github.io/lsr2/assets/bootstrap/js/bootstrap.min.js"></script>      <script src="https://punishersamp.github.io/lsr2/assets/smooth-scroll/smooth-scroll.js"></script>      <script src="https://punishersamp.github.io/lsr2/assets/dropdown/js/script.min.js"></script>      <script src="https://punishersamp.github.io/lsr2/assets/touch-swipe/jquery.touch-swipe.min.js"></script>      <script src="https://punishersamp.github.io/lsr2/assets/jarallax/jarallax.min.js"></script>      <script src="https://punishersamp.github.io/lsr2/assets/theme/js/script.js"></script>                




Queria que retirassem a imagem e o texto/link do canto superior esquerdo Light Speed Racing e também o ícone da casinha e NWD Games.
Também queria que alterassem o texto de JOGAR NWD pra Tech Gamers X e tirassem a imagem do foguete.

Em bem vindo ao fórum, queria que fosse Bem vindo a Tech Gamer X.

Em criar conta queria que fosse direcionado pra criar conta no meu fórum, no lugar do discord queria que tivesse escrito Regras e em fórum fosse redirecionado ao meu fórum, e adicionassem um novo botão com o nome Blog, e com o link Blog.

E por fim alterassem  a imagem de fundo pra: Menu - Procurar Azul-e10

Muito obrigado desde já.
por juninho_xd
em 27.05.22 1:19
 
Procurar em: Questões resolvidas sobre HTML e BBCode
Tópico: Página HTML personalizada
Respostas: 3
Vistos: 336

Login em pop up

Detalhes da questão


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

Descrição


Detalhes da questão


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

Descrição



Olá,boa tarde

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: fnsystem.forumeiros.com

Se puder também na foto de fundo colocar essa: https://imgur.com/zwEdDJL

E o escudo esse: https://imgur.com/2cprsTR

Por gentileza Eu amo você

Meu overall_header: :
por Vitor Hugo18
em 05.04.22 19:05
 
Procurar em: Questões resolvidas sobre a aparência do fórum
Tópico: Login em pop up
Respostas: 8
Vistos: 658

Alterar a barra de navegação

Boa madrugada @Vitor Hugo18

Modifique seu overall_header para o seguinte código:

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


 <!-- 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 -->
 $(document).ready(function () {
 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 -->
 });


 <!-- 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://code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css" rel="stylesheet" />
  <link href="https://use.fontawesome.com/releases/v5.15.1/css/all.css" rel="stylesheet">
  <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.8.1/css/all.css" integrity="sha384-50oBUHEmvpQ+1lW4y57PTFmhCaXp0ML5d60M1M7uH2+nqUivzIebhndOJK28anvf" crossorigin="anonymous">
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css"/>
    <link href="https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap" rel="stylesheet">
</head>


<body id="modernbb">
<!-- 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">
<!-- BEGIN switch_user_logged_out -->
<div class="menu">
  <a href="/forum" class="menu-link"><i class="fas fa-home"></i> Início</a>
  <a href="/groups" class="menu-link"><i class="fas fa-user-friends"></i> Grupos</a>
  <a href="/memberlist" class="menu-link"><i class="fas fa-user-check"></i> Membros</a>
 
<div class="redes-sociais" style="float: right;">
  <a href="https://chat.whatsapp.com/DxwkiW3KlNtERNtvP77yfL" class="button-whatsapp"><i class="fab fa-whatsapp"></i></a>
  <a href="#" class="button-discord"><i class="fab fa-discord"></i></a>
  </div>
</div>
<!-- END switch_user_logged_out -->
           
<!-- BEGIN switch_user_logged_in -->
<div class="menu">
  <a href="/forum" class="menu-link"><i class="fas fa-home"></i> Início</a>
  <a href="/groups" class="menu-link"><i class="fas fa-user-friends"></i> Grupos</a>
  <a href="/memberlist" class="menu-link"><i class="fas fa-user-check"></i> Membros</a>
  <a href="/t1-" class="menu-link"><i class="fas fa-address-card"></i> Setor Administrativo</a>
  <a href="/t2-" class="menu-link"><i class="fas fa-landmark"></i> Setor Jurídico</a>
  <a href="/privmsg" class="menu-link"><i class="fas fa-archive"></i> Mensagens Privadas</a>
 
<div class="redes-sociais" style="float: right;">
  <a href="https://chat.whatsapp.com/DxwkiW3KlNtERNtvP77yfL" class="button-whatsapp"><i class="fab fa-whatsapp"></i></a>
  <a href="#" class="button-discord"><i class="fab fa-discord"></i></a>
  </div>
</div>
 <!-- END switch_user_logged_in -->
 
 
 </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">
 <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">


E adicione em sua Folha de estilo (CSS):
Código:
.menu {
    position: absolute;
    background: white;
    height: 50px;
    bottom: 0;
    width: 100%;
    box-shadow: inset 1px 2px 2px hsl(204deg 15% 20% / 33%);
}

.menu a {
    font-size: 12px;
    padding: 18px;
    position: relative;
    top: 15px;
    border-left: 2px solid rgba(0,0,0,.1);
    font-family: Poppins;
    font-weight: 500;
    left: 0;
}

.menu-link i {
    color: #333;
}
.menu a:hover {
    color: gray;
}
.menu .button-whatsapp {
    background-color: green;
    padding: 10px;
    font-size: 15px;
    color: white;
    border-radius: 5px;
    margin-right: 5px;
}
.menu .button-discord{
    background-color: #7289DA;
    padding: 10px;
    font-size: 15px;
    color: white;
    border-radius: 5px;
}
.redes-sociais a:hover {
    color: white!important;
}


(Aguardo respostas)
Abraços,
do seu amigo da comunidade, Musashi! Muito feliz
por Musashi
em 04.04.22 5:40
 
Procurar em: Questões resolvidas sobre a aparência do fórum
Tópico: Alterar a barra de navegação
Respostas: 5
Vistos: 433

Adicionar fundo aos campos de perfil no tópico

Altere para
Código:
a[href="/u1"] {
text-shadow: 0px 0px 5px #1c1c1c;
  background: url(http://img0.liveinternet.ru/images/attach/c/3/77/140/77140894_bluestarglitterangel.gif
}
div#site-desc {
  display: none;
}
 
.postprofile-name a[href] {
  background: url(https://i.imgur.com/FgKNYTV.gif);
}
 
.postprofile-avatar img {
  height: unset;
  width: unset;
  max-height: 300px;
  max-width: 150px;
  border-radius: 10px !important;
  border: 1px solid darkgray !important;
}
 
.post-head {
  border-width: 0 !important;
}
 
 
/*COR GRUPO LEGENDA*/
 
.color-groups[style$="#FF8C00"],
.postprofile-name span[style$="#FF8C00"],
a[href^="/u"] span[style$="#FF8C00"],
a[href^="/g3-"],
.color-groups[style$="#FF8C00"],
.color-groups[style$="#FF8C00"],
.postprofile-name span[style$="#FF8C00"],
a[href^="/u"] span[style$="#FF8C00"],
a[href^="/g5-"],
.color-groups[style$="#FF8C00"],
.postprofile-name span[style$="#FF8C00"],
a[href^="/u"] span[style$="#FF8C00"],
a[href^="/g6-"],
.color-groups[style$="#FF8C00"],
.postprofile-name span[style$="#FF8C00"],
a[href^="/u"] span[style$="#FF8C00"],
a[href^="/g7-"],
.color-groups[style$="#FF8C00"],
.postprofile-name span[style$="#FF8C00"],
a[href^="/u"] span[style$="#FF8C00"],
a[href^="/g8-"],
.color-groups[style$="#FF8C00"],
.postprofile-name span[style$="#FF8C00"],
a[href^="/u"] span[style$="#FF8C00"],
a[href^="/g9-"],
.color-groups[style$="#FF8C00"],
.postprofile-name span[style$="#FF8C00"],
a[href^="/u"] span[style$="#FF8C00"],
a[href^="/g10-"],
.color-groups[style$="#FF8C00"],
.color-groups[style$="#FF8C00"],
.postprofile-name span[style$="#FF8C00"],
a[href^="/u"] span[style$="#FF8C00"],
a[href^="/g4-"] {
  background: url(https://i.imgur.com/FgKNYTV.gif);
  text-shadow: 2px 0 11px CurrentColor;
}
 
.post-author-name {
  font-size: 18px;
}
 
 
/*BRILHO*/
 
a[style*="#CC0436"],
span[style*="color:#CC0436"],
a[style*="#FF0048"],
span[style*="color:#FF0048"],
a[style*="#7A2B00"],
span[style*="color:#7A2B00"],
a[style*="#D17008"],
span[style*="color:#D17008"],
a[style*="#0081C7"],
span[style*="color:#0081C7"] {
  background: url(https://i.imgur.com/FgKNYTV.gif);
  text-shadow: 2px 0 11px CurrentColor;
}
 
.page-topic .row .pagination {
  display: block;
}
 
.page-topic span.postreplies {
  margin-right: 8px;
}
 
.page-topic .postdetails {
  margin-top: 4px;
}
 
.page-topic .lastpost {
  float: right;
  display: flex;
  flex-flow: column;
  align-items: center;
}
 
.page-topic span.lastpost-avatar {
  padding: 0!important;
}
 
.page-topic .lastpost center span {
  text-align: center;
  width: 100%;
}
 
.forumbg.announcement {
  background-color: transparent;
}
 
.forumbg .header {
  background-color: #22b3a7;
}
 
.page-topic .row {
  border: 0;
  margin: 10px 0;
  box-shadow: 0 1px 6px rgb(0, 0, 0, 6%);
  display: grid;
  align-items: center;
  height: 130px;
}
 
 
/* Add a black background color to the top navigation */
 
.topnav {
  background-color: #333;
  overflow: hidden;
}
 
 
/* Style the links inside the navigation bar */
 
.topnav a {
  float: left;
  display: block;
  color: #f2f2f2;
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
  font-size: 17px;
}
 
 
/* Change the color of links on hover */
 
.topnav a:hover {
  background-color: #ddd;
  color: black;
}
 
 
/* Add an active class to highlight the current page */
 
.active {
  background-color: #4CAF50;
  color: white;
}
 
 
/* Hide the link that should open and close the topnav on small screens */
 
.topnav .icon {
  display: none;
  position: fixed!important;
}
 
.topnav {
  position: fixed;
  width: 100%;
  z-index: 10;
}
 
 
/***************fim menu**********/
 
#wrap {
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  box-sizing: border-box;
}
 
 
/***Efeito LightBox MP***/
 
.fancybox-tmp iframe,
.fancybox-tmp object {
  vertical-align: top;
  margin: 0;
  padding: 0
}
 
.fancybox-wrap {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1002
}
 
.fancybox-outer {
  background: #f9f9f9;
  color: #444;
  text-shadow: none;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  margin: 0;
  padding: 0
}
 
.fancybox-opened {
  z-index: 1003
}
 
.fancybox-opened .fancybox-outer {
  -webkit-box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5);
  -moz-box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5);
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5)
}
 
.fancybox-inner {
  width: 100%;
  height: 100%;
  position: relative;
  outline: none;
  overflow: hidden;
  margin: 0;
  padding: 0
}
 
.fancybox-error {
  color: #444;
  font: 14px/20px "Helvetica Neue", Helvetica, Arial, sans-serif;
  margin: 0;
  padding: 10px
}
 
.fancybox-image,
.fancybox-iframe {
  display: block;
  width: 100%;
  height: 100%;
  border: 0;
  vertical-align: top;
  margin: 0;
  padding: 0
}
 
.fancybox-image {
  max-width: 100%;
  max-height: 100%
}
 
#fancybox-loading {
  position: fixed;
  top: 50%;
  left: 50%;
  margin-top: -21px;
  margin-left: -21px;
  width: 42px;
  height: 42px;
  background: url(https://i.servimg.com/u/f48/16/58/89/73/fancyb10.gif);
  opacity: 0.8;
  cursor: pointer;
  z-index: 1010
}
 
.fancybox-close,
.fancybox-prev span,
.fancybox-next span {
  background-image: url(https://i.servimg.com/u/f48/16/58/89/73/fancyb10.png)
}
 
.fancybox-close {
  position: absolute;
  top: -18px;
  right: -18px;
  width: 36px;
  height: 36px;
  cursor: pointer;
  z-index: 1004
}
 
.fancybox-tmp {
  position: absolute;
  top: -9999px;
  left: -9999px;
  overflow: visible;
  visibility: hidden;
  padding: 0
}
 
#fancybox-overlay {
  position: absolute;
  top: 0;
  left: 0;
  overflow: hidden;
  display: none;
  z-index: 999;
  background: #000
}
 
.fancybox-title {
  display: none
}
 
.fancybox-title-float-wrap {
  position: absolute;
  bottom: 0;
  right: 50%;
  margin-bottom: -35px;
  z-index: 999;
  text-align: center
}
 
.fancybox-title-float-wrap .child {
  display: inline-block;
  margin-right: -100%;
  background: rgba(0, 0, 0, 0.8);
  -webkit-border-radius: 15px;
  -moz-border-radius: 15px;
  border-radius: 15px;
  text-shadow: 0 1px 2px #222;
  color: #FFF;
  font-weight: 700;
  line-height: 24px;
  white-space: nowrap;
  padding: 2px 20px
}
 
.fancybox-title-outside-wrap {
  position: relative;
  margin-top: 10px;
  color: #fff
}
 
.fancybox-title-inside-wrap {
  margin-top: 10px
}
 
.fancybox-title-over-wrap {
  position: absolute;
  bottom: 0;
  left: 0;
  color: #fff;
  background: rgba(0, 0, 0, .8);
  padding: 10px
}
 
 
/***Cursor Modificado***/
 
* {
  cursor: url(https://cur.cursors-4u.net/cursors/cur-1/cur90.cur), auto !important;
}
 
@import url('https://fonts.googleapis.com/css2?family=Lobster&display=swap');
.table-title h2 {
  font-family: 'Lobster', sans-serif !important;
  font-size: 2rem !important;
}
 
#right {
  display: block !important;
}
 
#container {
  margin-right: 250px !important;
  padding-right: 1rem;
}
 
.headerbar {
  z-index: 9999!important;
}
 
.postprofile-info,
.postprofile-info * {
  color: inherit !important;
}
 
 
/* MENU INICIAL */
 
a.gensmall {
  border: none;
}
 
.block {
  width: 100%;
  display: block;
  float: left;
  border-radius: 3px;
  background-color: #fff;
  box-shadow: 0 2px 3px rgba(0, 0, 0, 0.1), 0 0 2px rgba(0, 0, 0, 0.1);
  font-size: 13px;
  padding: 16px;
}
 
.block a:link,
.block a:visited {
  color: #444;
}
 
.block .h3 {
  font-size: 20px;
  border: none;
}
 
.block .h3 i {
  height: 28px;
  line-height: 30px;
  margin-right: 10px;
  color: #fff;
}
 
.stats-tabs br {
  display: none;
}
 
.stats-tabs section {
  display: none;
  padding: 20px 0 0;
}
 
.stats-tabs input {
  display: none;
}
 
.stats-tabs label {
  display: inline-block;
  margin: 0 0 -1px;
  padding: 15px 25px;
  font-weight: 600;
  text-align: center;
  color: #A0B8B5;
}
 
.stats-tabs label:before {
  font-family: "Font Awesome 5 Free";
  margin-right: 10px;
}
 
.stats-tabs label[for*='1']:before {
  content: '\f0c0';
}
 
.stats-tabs label[for*='2']:before {
  content: '\f1fd';
}
 
.stats-tabs label[for*='3']:before {
  content: '\f187';
}
 
.stats-tabs label:hover {
  color: darkcyan;
  cursor: pointer;
}
 
.stats-tabs input:checked+label {
  color: darkcyan;
  border-top: 2px solid darkcyan;
  border-left: 1px solid #A0B8B5;
  border-right: 1px solid #A0B8B5;
  border-bottom: 1px solid #fff;
}
 
.stats-tabs #tab1:checked~#content1,
.stats-tabs #tab2:checked~#content2,
.stats-tabs #tab3:checked~#content3 {
  display: block;
}
 
@media screen and (max-width: 800px) {
  .stats-tabs label {
      font-size: 0;
  }
  .stats-tabs label:before {
      margin: 0;
      font-size: 18px;
  }
}
 
@media screen and (max-width: 500px) {
  .stats-tabs label {
      padding: 15px;
  }
}
 
.block .legend {
  font-size: 0px;
}
 
.block .legend b a {
  font-size: 13px;
  font-weight: 600;
}
 
.block .legend b a::after {
  content: ", ";
  font-weight: 400;
  color: #fff;
}
 
.block .legend b:last-child a::after {
  content: "";
}
 
.block .legend {
  display: inline-flex;
  white-space: break-spaces;
}
 
#content1,
#content2 {
  line-height: 3;
}
 
.stats-tabs section {
  border-top: 1px solid #A0B8B5;
}
 
 
/*END Whos online*/
 
 
/* Banner */
 
.headerbar {
  height: 150px;
}
 
 
/* Posicao menu */
 
div#headerbar-top:not(.is-sticky) {
  margin-top: 81px;
}
 
#wrap {
  padding: 9px;
}
 
 
/* Remover faq/calendario do menu */
 
.mainmenu[href="/faq"],
.mainmenu[href="/calendar"] {
  display: none !important;
}
 
 
/* Icons menu */
 
.mainmenu>img {
  display: none;
}
 
.mainmenu::before {
  font-family: "Font Awesome 5 Free";
  content: "\f015";
  display: inline;
  margin-right: 5px;
  font: normal normal normal 14px/1 FontAwesome;
  font-size: 15px;
  font-size: inherit;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
 
.mainmenu[href*="groups"]::before {
  content: "\f1b2";
}
 
.mainmenu[href*="search"]::before {
  content: "\f002";
}
 
.mainmenu[href*="memberlist"]::before {
  content: "\f0c0";
}
 
.mainmenu[href*="privmsg"]::before {
  content: "\f0e0";
}
 
.mainmenu[href*="profile"]::before {
  content: "\f007";
}
 
.mainmenu[href*="login"]::before {
  content: "\f011";
}
 
.mainmenu[href*="register"]::before {
  content: "\f2b9";
}
 
 
/* Nick Piscando  KKKKK*/
 
span[style="color:#CC0436"] strong {
  -webkit-animation-name: blinker;
  -webkit-animation-duration: 1s;
  -webkit-animation-timing-function: linear;
  -webkit-animation-iteration-count: infinite;
  -moz-animation-name: blinker;
  -moz-animation-duration: 1s;
  -moz-animation-timing-function: linear;
  -moz-animation-iteration-count: infinite;
  animation-name: blinker;
  animation-duration: 1s;
  animation-timing-function: linear;
  animation-iteration-count: infinite;
}
 
@-moz-keyframes blinker {
  0% {
      opacity: 1.0;
  }
  50% {
      opacity: 0.0;
  }
  100% {
      opacity: 1.0;
  }
}
 
@-webkit-keyframes blinker {
  0% {
      opacity: 1.0;
  }
  50% {
      opacity: 0.0;
  }
  100% {
      opacity: 1.0;
  }
}
 
@keyframes blinker {
  0% {
      opacity: 1.0;
  }
  50% {
      opacity: 0.0;
  }
  100% {
      opacity: 1.0;
  }
}
 
#container {
  margin-right: 90px !important;
  margin-left: 0 !important;
  padding-right: 1rem;
}
 
.page-topic .topic-title a {
  font-size: 16px !important;
}
.page-topic .lastpost span>center>span {
  font-size: 14px !important;
}

.postprofile-info .profile_field {
  background-color: #e9ebed;
  border: 1px solid #aaa9a9;
  border-left-width: 4px;
  padding: .5rem;
}
 
.postprofile-info .profile_field:not(:last-child) {
  margin-bottom: .25rem;
}
por pedxz
em 25.03.22 1:09
 
Procurar em: Questões resolvidas sobre a aparência do fórum
Tópico: Adicionar fundo aos campos de perfil no tópico
Respostas: 8
Vistos: 604

Adicionar fundo aos campos de perfil no tópico

Código:
a[href="/u1"] {
text-shadow: 0px 0px 5px #1c1c1c;
  background: url(http://img0.liveinternet.ru/images/attach/c/3/77/140/77140894_bluestarglitterangel.gif
}
div#site-desc {
  display: none;
}
 
.postprofile-name a[href] {
  background: url(https://i.imgur.com/FgKNYTV.gif);
}
 
.postprofile-avatar img {
  height: unset;
  width: unset;
  max-height: 300px;
  max-width: 150px;
  border-radius: 10px !important;
  border: 1px solid darkgray !important;
}
 
.post-head {
  border-width: 0 !important;
}
 
 
/*COR GRUPO LEGENDA*/
 
.color-groups[style$="#FF8C00"],
.postprofile-name span[style$="#FF8C00"],
a[href^="/u"] span[style$="#FF8C00"],
a[href^="/g3-"],
.color-groups[style$="#FF8C00"],
.color-groups[style$="#FF8C00"],
.postprofile-name span[style$="#FF8C00"],
a[href^="/u"] span[style$="#FF8C00"],
a[href^="/g5-"],
.color-groups[style$="#FF8C00"],
.postprofile-name span[style$="#FF8C00"],
a[href^="/u"] span[style$="#FF8C00"],
a[href^="/g6-"],
.color-groups[style$="#FF8C00"],
.postprofile-name span[style$="#FF8C00"],
a[href^="/u"] span[style$="#FF8C00"],
a[href^="/g7-"],
.color-groups[style$="#FF8C00"],
.postprofile-name span[style$="#FF8C00"],
a[href^="/u"] span[style$="#FF8C00"],
a[href^="/g8-"],
.color-groups[style$="#FF8C00"],
.postprofile-name span[style$="#FF8C00"],
a[href^="/u"] span[style$="#FF8C00"],
a[href^="/g9-"],
.color-groups[style$="#FF8C00"],
.postprofile-name span[style$="#FF8C00"],
a[href^="/u"] span[style$="#FF8C00"],
a[href^="/g10-"],
.color-groups[style$="#FF8C00"],
.color-groups[style$="#FF8C00"],
.postprofile-name span[style$="#FF8C00"],
a[href^="/u"] span[style$="#FF8C00"],
a[href^="/g4-"] {
  background: url(https://i.imgur.com/FgKNYTV.gif);
  text-shadow: 2px 0 11px CurrentColor;
}
 
.post-author-name {
  font-size: 18px;
}
 
 
/*BRILHO*/
 
a[style*="#CC0436"],
span[style*="color:#CC0436"],
a[style*="#FF0048"],
span[style*="color:#FF0048"],
a[style*="#7A2B00"],
span[style*="color:#7A2B00"],
a[style*="#D17008"],
span[style*="color:#D17008"],
a[style*="#0081C7"],
span[style*="color:#0081C7"] {
  background: url(https://i.imgur.com/FgKNYTV.gif);
  text-shadow: 2px 0 11px CurrentColor;
}
 
.page-topic .row .pagination {
  display: block;
}
 
.page-topic span.postreplies {
  margin-right: 8px;
}
 
.page-topic .postdetails {
  margin-top: 4px;
}
 
.page-topic .lastpost {
  float: right;
  display: flex;
  flex-flow: column;
  align-items: center;
}
 
.page-topic span.lastpost-avatar {
  padding: 0!important;
}
 
.page-topic .lastpost center span {
  text-align: center;
  width: 100%;
}
 
.forumbg.announcement {
  background-color: transparent;
}
 
.forumbg .header {
  background-color: #22b3a7;
}
 
.page-topic .row {
  border: 0;
  margin: 10px 0;
  box-shadow: 0 1px 6px rgb(0, 0, 0, 6%);
  display: grid;
  align-items: center;
  height: 130px;
}
 
 
/* Add a black background color to the top navigation */
 
.topnav {
  background-color: #333;
  overflow: hidden;
}
 
 
/* Style the links inside the navigation bar */
 
.topnav a {
  float: left;
  display: block;
  color: #f2f2f2;
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
  font-size: 17px;
}
 
 
/* Change the color of links on hover */
 
.topnav a:hover {
  background-color: #ddd;
  color: black;
}
 
 
/* Add an active class to highlight the current page */
 
.active {
  background-color: #4CAF50;
  color: white;
}
 
 
/* Hide the link that should open and close the topnav on small screens */
 
.topnav .icon {
  display: none;
  position: fixed!important;
}
 
.topnav {
  position: fixed;
  width: 100%;
  z-index: 10;
}
 
 
/***************fim menu**********/
 
#wrap {
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  box-sizing: border-box;
}
 
 
/***Efeito LightBox MP***/
 
.fancybox-tmp iframe,
.fancybox-tmp object {
  vertical-align: top;
  margin: 0;
  padding: 0
}
 
.fancybox-wrap {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1002
}
 
.fancybox-outer {
  background: #f9f9f9;
  color: #444;
  text-shadow: none;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  margin: 0;
  padding: 0
}
 
.fancybox-opened {
  z-index: 1003
}
 
.fancybox-opened .fancybox-outer {
  -webkit-box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5);
  -moz-box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5);
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5)
}
 
.fancybox-inner {
  width: 100%;
  height: 100%;
  position: relative;
  outline: none;
  overflow: hidden;
  margin: 0;
  padding: 0
}
 
.fancybox-error {
  color: #444;
  font: 14px/20px "Helvetica Neue", Helvetica, Arial, sans-serif;
  margin: 0;
  padding: 10px
}
 
.fancybox-image,
.fancybox-iframe {
  display: block;
  width: 100%;
  height: 100%;
  border: 0;
  vertical-align: top;
  margin: 0;
  padding: 0
}
 
.fancybox-image {
  max-width: 100%;
  max-height: 100%
}
 
#fancybox-loading {
  position: fixed;
  top: 50%;
  left: 50%;
  margin-top: -21px;
  margin-left: -21px;
  width: 42px;
  height: 42px;
  background: url(https://i.servimg.com/u/f48/16/58/89/73/fancyb10.gif);
  opacity: 0.8;
  cursor: pointer;
  z-index: 1010
}
 
.fancybox-close,
.fancybox-prev span,
.fancybox-next span {
  background-image: url(https://i.servimg.com/u/f48/16/58/89/73/fancyb10.png)
}
 
.fancybox-close {
  position: absolute;
  top: -18px;
  right: -18px;
  width: 36px;
  height: 36px;
  cursor: pointer;
  z-index: 1004
}
 
.fancybox-tmp {
  position: absolute;
  top: -9999px;
  left: -9999px;
  overflow: visible;
  visibility: hidden;
  padding: 0
}
 
#fancybox-overlay {
  position: absolute;
  top: 0;
  left: 0;
  overflow: hidden;
  display: none;
  z-index: 999;
  background: #000
}
 
.fancybox-title {
  display: none
}
 
.fancybox-title-float-wrap {
  position: absolute;
  bottom: 0;
  right: 50%;
  margin-bottom: -35px;
  z-index: 999;
  text-align: center
}
 
.fancybox-title-float-wrap .child {
  display: inline-block;
  margin-right: -100%;
  background: rgba(0, 0, 0, 0.8);
  -webkit-border-radius: 15px;
  -moz-border-radius: 15px;
  border-radius: 15px;
  text-shadow: 0 1px 2px #222;
  color: #FFF;
  font-weight: 700;
  line-height: 24px;
  white-space: nowrap;
  padding: 2px 20px
}
 
.fancybox-title-outside-wrap {
  position: relative;
  margin-top: 10px;
  color: #fff
}
 
.fancybox-title-inside-wrap {
  margin-top: 10px
}
 
.fancybox-title-over-wrap {
  position: absolute;
  bottom: 0;
  left: 0;
  color: #fff;
  background: rgba(0, 0, 0, .8);
  padding: 10px
}
 
 
/***Cursor Modificado***/
 
* {
  cursor: url(https://cur.cursors-4u.net/cursors/cur-1/cur90.cur), auto !important;
}
 
@import url('https://fonts.googleapis.com/css2?family=Lobster&display=swap');
.table-title h2 {
  font-family: 'Lobster', sans-serif !important;
  font-size: 2rem !important;
}
 
#right {
  display: block !important;
}
 
#container {
  margin-right: 250px !important;
  padding-right: 1rem;
}
 
.headerbar {
  z-index: 9999!important;
}
 
.postprofile-info,
.postprofile-info * {
  color: inherit !important;
}
 
 
/* MENU INICIAL */
 
a.gensmall {
  border: none;
}
 
.block {
  width: 100%;
  display: block;
  float: left;
  border-radius: 3px;
  background-color: #fff;
  box-shadow: 0 2px 3px rgba(0, 0, 0, 0.1), 0 0 2px rgba(0, 0, 0, 0.1);
  font-size: 13px;
  padding: 16px;
}
 
.block a:link,
.block a:visited {
  color: #444;
}
 
.block .h3 {
  font-size: 20px;
  border: none;
}
 
.block .h3 i {
  height: 28px;
  line-height: 30px;
  margin-right: 10px;
  color: #fff;
}
 
.stats-tabs br {
  display: none;
}
 
.stats-tabs section {
  display: none;
  padding: 20px 0 0;
}
 
.stats-tabs input {
  display: none;
}
 
.stats-tabs label {
  display: inline-block;
  margin: 0 0 -1px;
  padding: 15px 25px;
  font-weight: 600;
  text-align: center;
  color: #A0B8B5;
}
 
.stats-tabs label:before {
  font-family: "Font Awesome 5 Free";
  margin-right: 10px;
}
 
.stats-tabs label[for*='1']:before {
  content: '\f0c0';
}
 
.stats-tabs label[for*='2']:before {
  content: '\f1fd';
}
 
.stats-tabs label[for*='3']:before {
  content: '\f187';
}
 
.stats-tabs label:hover {
  color: darkcyan;
  cursor: pointer;
}
 
.stats-tabs input:checked+label {
  color: darkcyan;
  border-top: 2px solid darkcyan;
  border-left: 1px solid #A0B8B5;
  border-right: 1px solid #A0B8B5;
  border-bottom: 1px solid #fff;
}
 
.stats-tabs #tab1:checked~#content1,
.stats-tabs #tab2:checked~#content2,
.stats-tabs #tab3:checked~#content3 {
  display: block;
}
 
@media screen and (max-width: 800px) {
  .stats-tabs label {
      font-size: 0;
  }
  .stats-tabs label:before {
      margin: 0;
      font-size: 18px;
  }
}
 
@media screen and (max-width: 500px) {
  .stats-tabs label {
      padding: 15px;
  }
}
 
.block .legend {
  font-size: 0px;
}
 
.block .legend b a {
  font-size: 13px;
  font-weight: 600;
}
 
.block .legend b a::after {
  content: ", ";
  font-weight: 400;
  color: #fff;
}
 
.block .legend b:last-child a::after {
  content: "";
}
 
.block .legend {
  display: inline-flex;
  white-space: break-spaces;
}
 
#content1,
#content2 {
  line-height: 3;
}
 
.stats-tabs section {
  border-top: 1px solid #A0B8B5;
}
 
 
/*END Whos online*/
 
 
/* Banner */
 
.headerbar {
  height: 150px;
}
 
 
/* Posicao menu */
 
div#headerbar-top:not(.is-sticky) {
  margin-top: 81px;
}
 
#wrap {
  padding: 9px;
}
 
 
/* Remover faq/calendario do menu */
 
.mainmenu[href="/faq"],
.mainmenu[href="/calendar"] {
  display: none !important;
}
 
 
/* Icons menu */
 
.mainmenu>img {
  display: none;
}
 
.mainmenu::before {
  font-family: "Font Awesome 5 Free";
  content: "\f015";
  display: inline;
  margin-right: 5px;
  font: normal normal normal 14px/1 FontAwesome;
  font-size: 15px;
  font-size: inherit;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
 
.mainmenu[href*="groups"]::before {
  content: "\f1b2";
}
 
.mainmenu[href*="search"]::before {
  content: "\f002";
}
 
.mainmenu[href*="memberlist"]::before {
  content: "\f0c0";
}
 
.mainmenu[href*="privmsg"]::before {
  content: "\f0e0";
}
 
.mainmenu[href*="profile"]::before {
  content: "\f007";
}
 
.mainmenu[href*="login"]::before {
  content: "\f011";
}
 
.mainmenu[href*="register"]::before {
  content: "\f2b9";
}
 
 
/* Nick Piscando  KKKKK*/
 
span[style="color:#CC0436"] strong {
  -webkit-animation-name: blinker;
  -webkit-animation-duration: 1s;
  -webkit-animation-timing-function: linear;
  -webkit-animation-iteration-count: infinite;
  -moz-animation-name: blinker;
  -moz-animation-duration: 1s;
  -moz-animation-timing-function: linear;
  -moz-animation-iteration-count: infinite;
  animation-name: blinker;
  animation-duration: 1s;
  animation-timing-function: linear;
  animation-iteration-count: infinite;
}
 
@-moz-keyframes blinker {
  0% {
      opacity: 1.0;
  }
  50% {
      opacity: 0.0;
  }
  100% {
      opacity: 1.0;
  }
}
 
@-webkit-keyframes blinker {
  0% {
      opacity: 1.0;
  }
  50% {
      opacity: 0.0;
  }
  100% {
      opacity: 1.0;
  }
}
 
@keyframes blinker {
  0% {
      opacity: 1.0;
  }
  50% {
      opacity: 0.0;
  }
  100% {
      opacity: 1.0;
  }
}
 
#container {
  margin-right: 90px !important;
  margin-left: 0 !important;
  padding-right: 1rem;
}
 
.page-topic .topic-title a {
  font-size: 16px !important;
}
.page-topic .lastpost span>center>span {
  font-size: 14px !important;
.postprofile-info .profile_field {
  background-color: #e9ebed;
  border: 1px solid #aaa9a9;
  border-left-width: 4px;
  padding: .5rem;
}
 
.postprofile-info .profile_field:not(:last-child) {
  margin-bottom: .25rem;
}}
por PauloVinicios1755
em 25.03.22 1:04
 
Procurar em: Questões resolvidas sobre a aparência do fórum
Tópico: Adicionar fundo aos campos de perfil no tópico
Respostas: 8
Vistos: 604

Menu rápido efeito ao passar o cursor

Olá @LucianoMicle,

Não sei se compreendi corretamente a questão, mas esse espaçamento a direita e resultante deste código margin-left: 32px; existente na página JavaScript (código desse menu). Altere também
Código:
                    '.fa-quick-links-category ul {',
                    '  margin: -63px;',
                    '  margin-top: -20px;',
                    '  margin-bottom: 1px;',
                  '  margin-right: 0px;',
                    '}',
                    '',

para
Código:
                    '.fa-quick-links-category ul {',
                    '  margin-top: -20px;',
                  '  margin-left: 0;',
                    '}',
                    '',
Atenciosamente,
pedxz.
por pedxz
em 24.03.22 11:21
 
Procurar em: Questões resolvidas sobre códigos Javascript e jQuery
Tópico: Menu rápido efeito ao passar o cursor
Respostas: 3
Vistos: 439

Header modificar

Boa tarde @PauloVinicios1755

Tópico movido


O tópico foi movido para o setor: Questões sobre a aparência do fórum.


Nota: É importante que procure escolher a área certa para a sua questão afim de manter a organização do fórum.
Para mais informações, leia o Regulamento do Fórum dos Fóruns

Modifique seu overall_header para este seguinte código:
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 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="stylesheet" href="http://code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css" />
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.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}
 
  <!-- 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 -->
            $(document).ready(function() {
              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 -->
      });
 
      <!-- 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 type="text/javascript">
      //<![CDATA[
      (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
      (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
            m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
      })(window,document,'script','//www.google-analytics.com/analytics.js','ga');
 
      ga('create', '{G_ANALYTICS_ID}', 'auto');
      ga('send', 'pageview');
      ga('set', 'anonymizeIp', true);
 
      <!-- BEGIN google_analytics_code_bis -->
      ga('create', '{G_ANALYTICS_ID_BIS}', 'auto', 'bis');
      ga('bis.send', 'pageview');
      ga('bis.set', 'anonymizeIp', true);
      <!-- 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" rel="stylesheet" />
  <link href="https://code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css" rel="stylesheet" />
</head>
 
<body id="modernbb">
  <!-- BEGIN hitskin_preview -->
      <div id="hitskin_preview" style="display: block;">
        <h1><img src="{hitskin_preview.PATH_IMG_FA}hitskin/hitskin_logo.png" alt="" /> <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 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>
        <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 -->
 
  <a id="top" name="top" accesskey="t"></a>
  {JAVASCRIPT}
 
  <div id="page-header">
      <div class="headerbar">
        <div id="headerbar-top">
            <div class="wrap">
              <a href="{U_INDEX}" id="logo"><img src="{LOGO}" alt="{L_INDEX}" /></a>
 
            </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>
             
                          <!-- BEGIN switch_search_box -->
 
<style>
 
</style>
 <!-- END switch_search_box -->
 
 
        </div>
      </div>
 
          <!-- BEGIN switch_user_logged_out -->
<ul class="menu"><div class="meio wrap"><li class="div">
<a class="mainmenu" href="/">INICIO</a> &nbsp;</li>
<li><a class="mainmenu" href="/search">Buscar</a> &nbsp;</li>
<li><a class="mainmenu" href="/memberlist">Membros</a> &nbsp;</li>
  <div style="float: right;">
<li><a class="mainmenu" href="/login">Login</a> &nbsp;</li>
    <li><a class="mainmenu" href="/register" rel="nofollow">Registrar-se</a> &nbsp;</li></div>
 
</div></ul>
<!-- END switch_user_logged_out -->
             
<!-- BEGIN switch_user_logged_in -->
<ul class="menu"><div class="meio wrap"><li class="div">
&nbsp;
<a class="mainmenu" href="/forum">INICIO</a> &nbsp;</li>
<li><a class="mainmenu" href="/search">Buscar</a> &nbsp;</li>
<li><a class="mainmenu" href="/memberlist">Membros</a> &nbsp;</li>
<li><a class="mainmenu" href="/grouplist">Grupos</a> &nbsp;</li>
<li><a class="mainmenu" href="/privmsg?folder=inbox">Mensagens Privadas</a> &nbsp;</li>
<div style="float: right;right: 2rem;position: absolute;">
<li><a class="mainmenu" href="/profile?mode=editprofile">Perfil</a> &nbsp;</li>
 
    <li><a class="mainmenu" href="/login?logout">Sair</a> &nbsp;</li></div>
</div></ul>
 <!-- END switch_user_logged_in -->
 
<style>
 
.menu {
                    font-family: FontAwesome;
                    background: #2a2a2a;
                    box-shadow: rgba(161, 161, 161, 0.10) 0 1px 5px;
                    height: 54px;
                    line-height: 35px;
                    width: 100%;
                    z-index: 999;
                    overflow-y: hidden;
                    margin-left: auto !important;
                    margin-right: auto !important;
                    position: relative !important;
                }
 
                .menu div {
                    display: -ms-flexbox;
                    display: inline;
                    -ms-flex-wrap: nowrap;
                    flex-wrap: nowrap;
                    overflow-x: auto;
                    text-align: center;
                    white-space: nowrap;
                }
  /*.meio {
    height: auto;
    margin: auto;
width: 100%;
  }*/
.menu li {
    color: #666;
    float: left;
    font-size: 14px;
    font-weight: 400;
    list-style: none;
    margin-right: 5px;
    padding: 10px;
    transition: .05s all;
}
.menu li:hover {
    background: #575757;
    padding: 11px;
    transition: .1s cubic-bezier(0.39,0.58,0.57,1);
}
  a.mainmenu {
    color: white!important;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
  font-family: Roboto;
}
</style>
 
 
 
      <!-- 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">
  <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">
                            <script src="https://kit.fontawesome.com/a611d9acaf.js" crossorigin="anonymous"></script>


Abraços,
do seu amigo da comunidade, Musashi! Muito feliz
por Musashi
em 19.03.22 17:25
 
Procurar em: Questões resolvidas sobre a aparência do fórum
Tópico: Header modificar
Respostas: 5
Vistos: 521

Determinada cor para cada link

LucianoMicle escreveu:Olá @Pedxz
Ele paira no texto, pode ser feito em segundo plano? Deixe o texto permanecer preto e quando você passar o mouse ele muda para branco.
Por exemplo "Faça parte da equipe" = Passe o mouse na cor de fundo vermelho e texto branco, mas antes de passar o mouse o texto fica preto.
Me entendo?

Então pretende que ao passar o cursor em cada item do menu apareça um fundo com cor e não que altere a cor do link? Certo? Se sim, altere o código novamente para
Código:
        /*globals jQuery*/
                
                /**
                 * Creates a custom links tab.
                 *
                 * @author  Luiz Felipe F.
                 * @see      https://lffg.github.io
                 * @version  1.0.0
                 * @license  MIT
                 */
                (function($, css) {
                    'use strict';
                
                    var categories = [{
                        name: '',
                        links: [{
                            html: '<i class="fa fa-star" style=""></i> Mejoras del Usuario',
                            color: '#e34242',
                            href: 'https://divtes.foroactivo.com/h3-mejoras'
                        }, {
                            html: '<i class="fa fa-graduation-cap" style=""></i> Presentación',
                            color: '#4dbd65',
                            href: 'https://divtes.foroactivo.com/h1-div-tes-presentaciones'
                        }, {
                            html: '<i class="fa fa-shield" style=""></i> Formar parte del Staff',
                            color: '#2c2b2b',
                            href: 'https://divtes.foroactivo.com/h2-div-tes-formar-parte-del-staff'
                        }, {
                            html: '<i class="fa fa-user-plus" style=""></i> Registrate',
                            color: '',
                            href: 'https://divtes.foroactivo.com/register'
                        }]
                  
                    }];
                
                    $(function() {
                        var $wrapper = $([
                            '<li class="fa-quick-links-wrapper">',
                            '  <a class="fa-quick-links-toggler">',
                            '  MENÚ <i class="material-icons">menu</i>',
                            '  </a>',
                            '  <div class="fa-quick-links-inner"></div>',
                            '</li>'
                        ].join(''));
                
                        var $toggler = $wrapper.find('.fa-quick-links-toggler');
                        var $links = $wrapper.find('.fa-quick-links-inner');
                
                        $toggler.on('click', function(event) {
                            event.preventDefault();
                
                            $(this).toggleClass('active');
                        });
                
                        $wrapper.on('click', function(event) {
                            event.stopPropagation();
                        });
                
                        $(document).on('click', function() {
                            if ($toggler.is('.active')) $toggler.removeClass('active');
                        });
                
                        $.each(categories, function(index, category) {
                            if (!category.links) return;
                
                            var $category = $([
                                '<div class="fa-quick-links-category">',
                                '  ' + $('<label>', {
                                    'text': category.name
                                }).prop('outerHTML'),
                                '  <ul></ul>',
                                '</div>'
                            ].join(''));
                
                            $.each(category.links, function(index, link) {
                                if (!link.href || !link.html) return;
                
                                $('<a>', {
                                    'class': 'fa-quick-links-link',
                                    'style': '--link-color:' + (link.color ? link.color : '#3498DB'),
                                    'href': link.href,
                                    'html': link.html
                                }).appendTo($category.find('ul'));
                            });
                
                            $category.appendTo($links);
                        });
                
                        $wrapper.appendTo('#header-navigation');
                        $('<style>', {
                            'text': css.join('')
                        }).appendTo('head');
                    });
                })(jQuery, [
                    '.fa-quick-links-wrapper, .fa-quick-links-wrapper * {',
                    '  box-sizing: border-box;',
                    '      margin-left: 32px;',
                    '}',
                    '',
                    '.fa-quick-links-wrapper > .fa-quick-links-toggler:hover {',
                    '  background-color: #444;',
                    '}',
                    '',
                    '.fa-quick-links-wrapper > .fa-quick-links-inner {',
                    '  display: none;',
                    '}',
                    '',
                    '.fa-quick-links-wrapper > .fa-quick-links-toggler.active + .fa-quick-links-inner {',
                    '  display: block;',
                    '}',
                    '',
                    '.fa-quick-links-inner {',
                    '  background-color: #fff;',
                    '  box-shadow: 0 2px 3px rgba(0,0,0,0.1), 0 0 2px rgba(0,0,0,0.1);',
                    '  border-radius: 3px;',
                    '  margin-top: 1px;',
                    '  padding: .25rem;',
                    '  width: 310px;',
                    '  max-height: 300px;',
                    '  position: absolute;',
                    '}',
                    '',
                    '.fa-quick-links-category ul {',
                    '  margin: -63px;',
                    '  margin-top: -20px;',
                    '  margin-bottom: 1px;',
                  '  margin-right: 0px;',
                    '}',
                    '',
                    '.fa-quick-links-inner > div a {',
                    '  display: block !important;',
                    '  font-size: 13px;',
                    '  color: #263238 !important;',
                    '  height: auto !important;',
                    '  line-height: 3;',
                    '  font-family: inherit;',
                    '  font-weight: 500;',
                    '  margin-bottom: .25rem;',
                    '}',
                    '',
                    '.fa-quick-links-inner > div a:hover {',
                    '  background-color: var(--link-color, #3498DB) !important;',
                    '  border-radius: 3px;',
                    '  color: #fff !important;',
                    '}',
                    '',
                    '.fa-quick-links-inner::-webkit-scrollbar {',
                    '  width: 10px;',
                    '}',
                    '',
                    '.fa-quick-links-inner::-webkit-scrollbar-track {',
                    '  background: #dddddd;',
                    '}',
                    '',
                    '.fa-quick-links-inner::-webkit-scrollbar-thumb {',
                    '  background: #c3c5c5;',
                    '  box-shadow: inset 0 0 3px 1px #00000026;',
                    '}'
                ]);
por pedxz
em 19.03.22 11:30
 
Procurar em: Questões resolvidas sobre códigos Javascript e jQuery
Tópico: Determinada cor para cada link
Respostas: 7
Vistos: 340

Header modificar

eu achei um de um tópico de vocês mais está meio bugado ai eu ja adiantei o processo, depois que eu coloquei ficou assim https://imgur.com/kanjqLZ
codigo que usei:
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 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="stylesheet" href="http://code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css" />
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.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}
 
  <!-- 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 -->
            $(document).ready(function() {
              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 -->
      });
 
      <!-- 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 type="text/javascript">
      //<![CDATA[
      (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
      (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
            m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
      })(window,document,'script','//www.google-analytics.com/analytics.js','ga');
 
      ga('create', '{G_ANALYTICS_ID}', 'auto');
      ga('send', 'pageview');
      ga('set', 'anonymizeIp', true);
 
      <!-- BEGIN google_analytics_code_bis -->
      ga('create', '{G_ANALYTICS_ID_BIS}', 'auto', 'bis');
      ga('bis.send', 'pageview');
      ga('bis.set', 'anonymizeIp', true);
      <!-- 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" rel="stylesheet" />
  <link href="https://code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css" rel="stylesheet" />
</head>
 
<body id="modernbb">
  <!-- BEGIN hitskin_preview -->
      <div id="hitskin_preview" style="display: block;">
        <h1><img src="{hitskin_preview.PATH_IMG_FA}hitskin/hitskin_logo.png" alt="" /> <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 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>
        <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 -->
 
  <a id="top" name="top" accesskey="t"></a>
  {JAVASCRIPT}
 
  <div id="page-header">
      <div class="headerbar">
        <a href="https://discord.gg/uXRGNj5" class="logindc"><i class="fab fa-discord"></i> Conectar-se ao Discord</a>
<a href="https://ritys-nwd.forumeiros.com/t4-" class="crewrules"><i class="fas fa-book"></i> Ler regras do Clã</a>
        <div id="headerbar-top">
            <div class="wrap">
              <a href="{U_INDEX}" id="logo"><img src="{LOGO}" alt="{L_INDEX}" /></a>
 
            </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>
               
                          <!-- BEGIN switch_search_box -->
 
<style>
 
</style>
 <!-- END switch_search_box -->
 
 
        </div>
      </div>
 
          <!-- BEGIN switch_user_logged_out -->
<ul class="menu"><div class="meio wrap"><li class="div">
<a class="mainmenu" href="/">INICIO</a> &nbsp;</li>
<li><a class="mainmenu" href="/search">Buscar</a> &nbsp;</li>
<li><a class="mainmenu" href="/memberlist">Membros</a> &nbsp;</li>
  <div style="float: right;">
<li><a class="mainmenu" href="/login">Login</a> &nbsp;</li>
    <li><a class="mainmenu" href="/register" rel="nofollow">Registrar-se</a> &nbsp;</li></div>
 
</div></ul>
<!-- END switch_user_logged_out -->
               
<!-- BEGIN switch_user_logged_in -->
<ul class="menu"><div class="meio wrap"><li class="div">
&nbsp;
<a class="mainmenu" href="/forum">INICIO</a> &nbsp;</li>
<li><a class="mainmenu" href="/search">Buscar</a> &nbsp;</li>
<li><a class="mainmenu" href="/memberlist">Membros</a> &nbsp;</li>
<li><a class="mainmenu" href="/grouplist">Grupos</a> &nbsp;</li>
<li><a class="mainmenu" href="/privmsg?folder=inbox">Mensagens Privadas</a> &nbsp;</li>
  <div style="float: right;">
<li><a class="mainmenu" href="/profile?mode=editprofile">Perfil</a> &nbsp;</li>
 
    <li><a class="mainmenu" href="/login?logout">Sair</a> &nbsp;</li></div>
</div></ul>
 <!-- END switch_user_logged_in -->
 
<style>
  .menu {
  font: normal normal normal 14px/1 FontAwesome;
  font-family: FontAwesome;
    background: #F7CA18;
    box-shadow: rgba(161, 161, 161, 0.10) 0 1px 5px;
    height: 54px;
    line-height: 35px;
    width: 98%;
    z-index: 999;
    overflow-y: hidden;
  margin-left: auto !important;
  margin-right: auto !important;
  position: relative !important;
}
.menu div {
    display: -ms-flexbox;
    display: block;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    overflow-x: auto;
    text-align: center;
    white-space: nowrap;
    -webkit-overflow-scrolling: touch;
}
  /*.meio {
    height: auto;
    margin: auto;
width: 100%;
  }*/
.menu li {
    color: #666;
    float: left;
    font-size: 14px;
    font-weight: 400;
    list-style: none;
    margin-right: 5px;
    padding: 10px;
    transition: .05s all;
}
.menu li:hover {
    background: #575757;
    padding: 11px;
    transition: .1s cubic-bezier(0.39,0.58,0.57,1);
}
  a.mainmenu {
    color: white!important;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
  font-family: Roboto;
}
</style>
 
 
 
      <!-- 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">
  <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">
                            <div class="btnbanner">
                              </div>
                            <script src="https://kit.fontawesome.com/a611d9acaf.js" crossorigin="anonymous"></script>
                                    <div class="btnbanner">
              <ul>
                <li><a href="https://discord.gg/uXRGNj5"><i class="fab fa-discord"></i> DISCORD DO CLÃ</a></li>
                <li><a href="https://ritys-nwd.forumeiros.com/t4-regras-do-cla-atualizadas-em-18-06-2020-importante-leia"><i class="fas fa-clipboard-list"></i> REGRAS DO CLÃ</a></li>
              </ul>
        </div>


e tipo já pra adiantar queria deixar ali Login e registre-se, e se caso a pessoa estiver logado colocaa meu perfil e a foto do perfil bem pequeno do lado esquerdo junto acom algumas informações iguala  fórum de cima!
por PauloVinicios1755
em 18.03.22 22:39
 
Procurar em: Questões resolvidas sobre a aparência do fórum
Tópico: Header modificar
Respostas: 5
Vistos: 521

Determinada cor para cada link

Altere o código para
Código:
/*globals jQuery*/
        
        /**
         * Creates a custom links tab.
         *
         * @author  Luiz Felipe F.
         * @see      https://lffg.github.io
         * @version  1.0.0
         * @license  MIT
         */
        (function($, css) {
            'use strict';
        
            var categories = [{
                name: '',
                links: [{
                    html: '<i class="fa fa-star" style=""></i> Mejoras del Usuario',
                    color: '#e34242',
                    href: 'https://divtes.foroactivo.com/h3-mejoras'
                }, {
                    html: '<i class="fa fa-graduation-cap" style=""></i> Presentación',
                    color: '#4dbd65',
                    href: 'https://divtes.foroactivo.com/h1-div-tes-presentaciones'
                }, {
                    html: '<i class="fa fa-shield" style=""></i> Formar parte del Staff',
                    color: '#2c2b2b',
                    href: 'https://divtes.foroactivo.com/h2-div-tes-formar-parte-del-staff'
                }, {
                    html: '<i class="fa fa-user-plus" style=""></i> Registrate',
                    color: '',
                    href: 'https://divtes.foroactivo.com/register'
                }]
          
            }];
        
            $(function() {
                var $wrapper = $([
                    '<li class="fa-quick-links-wrapper">',
                    '  <a class="fa-quick-links-toggler">',
                    '  MENÚ <i class="material-icons">menu</i>',
                    '  </a>',
                    '  <div class="fa-quick-links-inner"></div>',
                    '</li>'
                ].join(''));
        
                var $toggler = $wrapper.find('.fa-quick-links-toggler');
                var $links = $wrapper.find('.fa-quick-links-inner');
        
                $toggler.on('click', function(event) {
                    event.preventDefault();
        
                    $(this).toggleClass('active');
                });
        
                $wrapper.on('click', function(event) {
                    event.stopPropagation();
                });
        
                $(document).on('click', function() {
                    if ($toggler.is('.active')) $toggler.removeClass('active');
                });
        
                $.each(categories, function(index, category) {
                    if (!category.links) return;
        
                    var $category = $([
                        '<div class="fa-quick-links-category">',
                        '  ' + $('<label>', {
                            'text': category.name
                        }).prop('outerHTML'),
                        '  <ul></ul>',
                        '</div>'
                    ].join(''));
        
                    $.each(category.links, function(index, link) {
                        if (!link.href || !link.html) return;
        
                        $('<a>', {
                            'class': 'fa-quick-links-link',
                            'style': '--link-color:' + (link.color ? link.color : '#3498DB'),
                            'href': link.href,
                            'html': link.html
                        }).appendTo($category.find('ul'));
                    });
        
                    $category.appendTo($links);
                });
        
                $wrapper.appendTo('#header-navigation');
                $('<style>', {
                    'text': css.join('')
                }).appendTo('head');
            });
        })(jQuery, [
            '.fa-quick-links-wrapper, .fa-quick-links-wrapper * {',
            '  box-sizing: border-box;',
            '      margin-left: 32px;',
            '}',
            '',
            '.fa-quick-links-wrapper > .fa-quick-links-toggler:hover {',
            '  background-color: #444;',
            '}',
            '',
            '.fa-quick-links-wrapper > .fa-quick-links-inner {',
            '  display: none;',
            '}',
            '',
            '.fa-quick-links-wrapper > .fa-quick-links-toggler.active + .fa-quick-links-inner {',
            '  display: block;',
            '}',
            '',
            '.fa-quick-links-inner {',
            '  background-color: #fff;',
            '  box-shadow: 0 2px 3px rgba(0,0,0,0.1), 0 0 2px rgba(0,0,0,0.1);',
            '  border-radius: 3px;',
            '  margin-top: 1px;',
            '  padding: .25rem;',
            '  width: 310px;',
            '  max-height: 300px;',
            '  position: absolute;',
            '}',
            '',
            '.fa-quick-links-category ul {',
            '  margin: -63px;',
            '  margin-top: -20px;',
            '  margin-bottom: 1px;',
          '  margin-right: 0px;',
            '}',
            '',
            '.fa-quick-links-inner > div a {',
            '  display: block !important;',
            '  font-size: 13px;',
            '  color: #263238 !important;',
            '  height: auto !important;',
            '  line-height: 3;',
            '  font-family: inherit;',
            '  font-weight: 500;',
            '}',
            '',
            '.fa-quick-links-inner > div a:hover {',
            '  color: var(--link-color, #3498DB) !important;',
            '  border-radius: 3px;',
            '  background-color: #f0f0f0 !important;',
            '}',
            '',
            '.fa-quick-links-inner::-webkit-scrollbar {',
            '  width: 10px;',
            '}',
            '',
            '.fa-quick-links-inner::-webkit-scrollbar-track {',
            '  background: #dddddd;',
            '}',
            '',
            '.fa-quick-links-inner::-webkit-scrollbar-thumb {',
            '  background: #c3c5c5;',
            '  box-shadow: inset 0 0 3px 1px #00000026;',
            '}'
        ]);

Pode definir a cor de cada link em color::
Código:
                links: [{
                    html: '<i class="fa fa-star" style=""></i> Mejoras del Usuario',
                    color: '#e34242',
                    href: 'https://divtes.foroactivo.com/h3-mejoras'
                }, {
                    html: '<i class="fa fa-graduation-cap" style=""></i> Presentación',
                    color: '#4dbd65',
                    href: 'https://divtes.foroactivo.com/h1-div-tes-presentaciones'
                }, {
                    html: '<i class="fa fa-shield" style=""></i> Formar parte del Staff',
                    color: '#2c2b2b',
                    href: 'https://divtes.foroactivo.com/h2-div-tes-formar-parte-del-staff'
                }, {
                    html: '<i class="fa fa-user-plus" style=""></i> Registrate',
                    color: '',
                    href: 'https://divtes.foroactivo.com/register'
                }]
por pedxz
em 17.03.22 23:46
 
Procurar em: Questões resolvidas sobre códigos Javascript e jQuery
Tópico: Determinada cor para cada link
Respostas: 7
Vistos: 340

Determinada cor para cada link

Oi @Pedxz
Spoiler:
por LucianoMicle
em 17.03.22 21:06
 
Procurar em: Questões resolvidas sobre códigos Javascript e jQuery
Tópico: Determinada cor para cada link
Respostas: 7
Vistos: 340

Alterar a cor dos campos no tópico

Altere a folha de estilo para
Código:
div#site-desc {
   display: none;
}

.postprofile-name a[href] {
   background: url(https://i.imgur.com/FgKNYTV.gif);
}

.postprofile-avatar img {
   height: unset;
   width: unset;
   max-height: 300px;
   max-width: 150px;
   border-radius: 10px !important;
   border: 1px solid darkgray !important;
}

.post-head {
   border-width: 0 !important;
}


/*COR GRUPO LEGENDA*/

.color-groups[style$="#FF8C00"],
.postprofile-name span[style$="#FF8C00"],
a[href^="/u"] span[style$="#FF8C00"],
a[href^="/g3-"],
.color-groups[style$="#FF8C00"],
.color-groups[style$="#FF8C00"],
.postprofile-name span[style$="#FF8C00"],
a[href^="/u"] span[style$="#FF8C00"],
a[href^="/g5-"],
.color-groups[style$="#FF8C00"],
.postprofile-name span[style$="#FF8C00"],
a[href^="/u"] span[style$="#FF8C00"],
a[href^="/g6-"],
.color-groups[style$="#FF8C00"],
.postprofile-name span[style$="#FF8C00"],
a[href^="/u"] span[style$="#FF8C00"],
a[href^="/g7-"],
.color-groups[style$="#FF8C00"],
.postprofile-name span[style$="#FF8C00"],
a[href^="/u"] span[style$="#FF8C00"],
a[href^="/g8-"],
.color-groups[style$="#FF8C00"],
.postprofile-name span[style$="#FF8C00"],
a[href^="/u"] span[style$="#FF8C00"],
a[href^="/g9-"],
.color-groups[style$="#FF8C00"],
.postprofile-name span[style$="#FF8C00"],
a[href^="/u"] span[style$="#FF8C00"],
a[href^="/g10-"],
.color-groups[style$="#FF8C00"],
.color-groups[style$="#FF8C00"],
.postprofile-name span[style$="#FF8C00"],
a[href^="/u"] span[style$="#FF8C00"],
a[href^="/g4-"] {
   background: url(https://i.imgur.com/FgKNYTV.gif);
   text-shadow: 2px 0 11px CurrentColor;
}

.post-author-name {
   font-size: 18px;
}


/*BRILHO*/

a[style*="#CC0436"],
span[style*="color:#CC0436"],
a[style*="#FF0048"],
span[style*="color:#FF0048"],
a[style*="#7A2B00"],
span[style*="color:#7A2B00"],
a[style*="#D17008"],
span[style*="color:#D17008"],
a[style*="#0081C7"],
span[style*="color:#0081C7"] {
   background: url(https://i.imgur.com/FgKNYTV.gif);
   text-shadow: 2px 0 11px CurrentColor;
}

.page-topic .row .pagination {
   display: block;
}

.page-topic span.postreplies {
   margin-right: 8px;
}

.page-topic .postdetails {
   margin-top: 4px;
}

.page-topic .lastpost {
   float: right;
   display: flex;
   flex-flow: column;
   align-items: center;
}

.page-topic span.lastpost-avatar {
   padding: 0!important;
}

.page-topic .lastpost center span {
   text-align: center;
   width: 100%;
}

.forumbg.announcement {
   background-color: transparent;
}

.forumbg .header {
   background-color: #22b3a7;
}

.page-topic .row {
   border: 0;
   margin: 10px 0;
   box-shadow: 0 1px 6px rgb(0, 0, 0, 6%);
   display: grid;
   align-items: center;
   height: 130px;
}


/* Add a black background color to the top navigation */

.topnav {
   background-color: #333;
   overflow: hidden;
}


/* Style the links inside the navigation bar */

.topnav a {
   float: left;
   display: block;
   color: #f2f2f2;
   text-align: center;
   padding: 14px 16px;
   text-decoration: none;
   font-size: 17px;
}


/* Change the color of links on hover */

.topnav a:hover {
   background-color: #ddd;
   color: black;
}


/* Add an active class to highlight the current page */

.active {
   background-color: #4CAF50;
   color: white;
}


/* Hide the link that should open and close the topnav on small screens */

.topnav .icon {
   display: none;
   position: fixed!important;
}

.topnav {
   position: fixed;
   width: 100%;
   z-index: 10;
}


/***************fim menu**********/

#wrap {
   margin-left: auto;
   margin-right: auto;
   width: 100%;
   box-sizing: border-box;
}


/***Efeito LightBox MP***/

.fancybox-tmp iframe,
.fancybox-tmp object {
   vertical-align: top;
   margin: 0;
   padding: 0
}

.fancybox-wrap {
   position: absolute;
   top: 0;
   left: 0;
   z-index: 1002
}

.fancybox-outer {
   background: #f9f9f9;
   color: #444;
   text-shadow: none;
   -webkit-border-radius: 4px;
   -moz-border-radius: 4px;
   border-radius: 4px;
   margin: 0;
   padding: 0
}

.fancybox-opened {
   z-index: 1003
}

.fancybox-opened .fancybox-outer {
   -webkit-box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5);
   -moz-box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5);
   box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5)
}

.fancybox-inner {
   width: 100%;
   height: 100%;
   position: relative;
   outline: none;
   overflow: hidden;
   margin: 0;
   padding: 0
}

.fancybox-error {
   color: #444;
   font: 14px/20px "Helvetica Neue", Helvetica, Arial, sans-serif;
   margin: 0;
   padding: 10px
}

.fancybox-image,
.fancybox-iframe {
   display: block;
   width: 100%;
   height: 100%;
   border: 0;
   vertical-align: top;
   margin: 0;
   padding: 0
}

.fancybox-image {
   max-width: 100%;
   max-height: 100%
}

#fancybox-loading {
   position: fixed;
   top: 50%;
   left: 50%;
   margin-top: -21px;
   margin-left: -21px;
   width: 42px;
   height: 42px;
   background: url(https://i.servimg.com/u/f48/16/58/89/73/fancyb10.gif);
   opacity: 0.8;
   cursor: pointer;
   z-index: 1010
}

.fancybox-close,
.fancybox-prev span,
.fancybox-next span {
   background-image: url(https://i.servimg.com/u/f48/16/58/89/73/fancyb10.png)
}

.fancybox-close {
   position: absolute;
   top: -18px;
   right: -18px;
   width: 36px;
   height: 36px;
   cursor: pointer;
   z-index: 1004
}

.fancybox-tmp {
   position: absolute;
   top: -9999px;
   left: -9999px;
   overflow: visible;
   visibility: hidden;
   padding: 0
}

#fancybox-overlay {
   position: absolute;
   top: 0;
   left: 0;
   overflow: hidden;
   display: none;
   z-index: 999;
   background: #000
}

.fancybox-title {
   display: none
}

.fancybox-title-float-wrap {
   position: absolute;
   bottom: 0;
   right: 50%;
   margin-bottom: -35px;
   z-index: 999;
   text-align: center
}

.fancybox-title-float-wrap .child {
   display: inline-block;
   margin-right: -100%;
   background: rgba(0, 0, 0, 0.8);
   -webkit-border-radius: 15px;
   -moz-border-radius: 15px;
   border-radius: 15px;
   text-shadow: 0 1px 2px #222;
   color: #FFF;
   font-weight: 700;
   line-height: 24px;
   white-space: nowrap;
   padding: 2px 20px
}

.fancybox-title-outside-wrap {
   position: relative;
   margin-top: 10px;
   color: #fff
}

.fancybox-title-inside-wrap {
   margin-top: 10px
}

.fancybox-title-over-wrap {
   position: absolute;
   bottom: 0;
   left: 0;
   color: #fff;
   background: rgba(0, 0, 0, .8);
   padding: 10px
}


/***Cursor Modificado***/

* {
   cursor: url(https://cur.cursors-4u.net/cursors/cur-1/cur90.cur), auto !important;
}

@import url('https://fonts.googleapis.com/css2?family=Lobster&display=swap');
.table-title h2 {
   font-family: 'Lobster', sans-serif !important;
   font-size: 2rem !important;
}

#right {
   display: block !important;
}

#container {
   margin-right: 250px !important;
   padding-right: 1rem;
}

.headerbar {
   z-index: 9999!important;
}

.postprofile-info,
.postprofile-info * {
   color: inherit !important;
}


/* MENU INICIAL */

a.gensmall {
   border: none;
}

.block {
   width: 100%;
   display: block;
   float: left;
   border-radius: 3px;
   background-color: #fff;
   box-shadow: 0 2px 3px rgba(0, 0, 0, 0.1), 0 0 2px rgba(0, 0, 0, 0.1);
   font-size: 13px;
   padding: 16px;
}

.block a:link,
.block a:visited {
   color: #444;
}

.block .h3 {
   font-size: 20px;
   border: none;
}

.block .h3 i {
   height: 28px;
   line-height: 30px;
   margin-right: 10px;
   color: #fff;
}

.stats-tabs br {
   display: none;
}

.stats-tabs section {
   display: none;
   padding: 20px 0 0;
}

.stats-tabs input {
   display: none;
}

.stats-tabs label {
   display: inline-block;
   margin: 0 0 -1px;
   padding: 15px 25px;
   font-weight: 600;
   text-align: center;
   color: #A0B8B5;
}

.stats-tabs label:before {
   font-family: "Font Awesome 5 Free";
   margin-right: 10px;
}

.stats-tabs label[for*='1']:before {
   content: '\f0c0';
}

.stats-tabs label[for*='2']:before {
   content: '\f1fd';
}

.stats-tabs label[for*='3']:before {
   content: '\f187';
}

.stats-tabs label:hover {
   color: darkcyan;
   cursor: pointer;
}

.stats-tabs input:checked+label {
   color: darkcyan;
   border-top: 2px solid darkcyan;
   border-left: 1px solid #A0B8B5;
   border-right: 1px solid #A0B8B5;
   border-bottom: 1px solid #fff;
}

.stats-tabs #tab1:checked~#content1,
.stats-tabs #tab2:checked~#content2,
.stats-tabs #tab3:checked~#content3 {
   display: block;
}

@media screen and (max-width: 800px) {
   .stats-tabs label {
      font-size: 0;
   }
   .stats-tabs label:before {
      margin: 0;
      font-size: 18px;
   }
}

@media screen and (max-width: 500px) {
   .stats-tabs label {
      padding: 15px;
   }
}

.block .legend {
   font-size: 0px;
}

.block .legend b a {
   font-size: 13px;
   font-weight: 600;
}

.block .legend b a::after {
   content: ", ";
   font-weight: 400;
   color: #fff;
}

.block .legend b:last-child a::after {
   content: "";
}

.block .legend {
   display: inline-flex;
   white-space: break-spaces;
}

#content1,
#content2 {
   line-height: 3;
}

.stats-tabs section {
   border-top: 1px solid #A0B8B5;
}


/*END Whos online*/


/* Banner */

.headerbar {
   height: 150px;
}


/* Posicao menu */

div#headerbar-top:not(.is-sticky) {
   margin-top: 81px;
}

#wrap {
   padding: 9px;
}


/* Remover faq/calendario do menu */

.mainmenu[href="/faq"],
.mainmenu[href="/calendar"] {
   display: none !important;
}


/* Icons menu */

.mainmenu>img {
   display: none;
}

.mainmenu::before {
   font-family: "Font Awesome 5 Free";
   content: "\f015";
   display: inline;
   margin-right: 5px;
   font: normal normal normal 14px/1 FontAwesome;
   font-size: 15px;
   font-size: inherit;
   text-rendering: auto;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
}

.mainmenu[href*="groups"]::before {
   content: "\f1b2";
}

.mainmenu[href*="search"]::before {
   content: "\f002";
}

.mainmenu[href*="memberlist"]::before {
   content: "\f0c0";
}

.mainmenu[href*="privmsg"]::before {
   content: "\f0e0";
}

.mainmenu[href*="profile"]::before {
   content: "\f007";
}

.mainmenu[href*="login"]::before {
   content: "\f011";
}

.mainmenu[href*="register"]::before {
   content: "\f2b9";
}


/* Nick Piscando  KKKKK*/

span[style="color:#CC0436"] strong {
   -webkit-animation-name: blinker;
   -webkit-animation-duration: 1s;
   -webkit-animation-timing-function: linear;
   -webkit-animation-iteration-count: infinite;
   -moz-animation-name: blinker;
   -moz-animation-duration: 1s;
   -moz-animation-timing-function: linear;
   -moz-animation-iteration-count: infinite;
   animation-name: blinker;
   animation-duration: 1s;
   animation-timing-function: linear;
   animation-iteration-count: infinite;
}

@-moz-keyframes blinker {
   0% {
      opacity: 1.0;
   }
   50% {
      opacity: 0.0;
   }
   100% {
      opacity: 1.0;
   }
}

@-webkit-keyframes blinker {
   0% {
      opacity: 1.0;
   }
   50% {
      opacity: 0.0;
   }
   100% {
      opacity: 1.0;
   }
}

@keyframes blinker {
   0% {
      opacity: 1.0;
   }
   50% {
      opacity: 0.0;
   }
   100% {
      opacity: 1.0;
   }
}

#container {
   margin-right: 90px !important;
   margin-left: 0 !important;
   padding-right: 1rem;
}

.page-topic .topic-title a {
   font-size: 16px !important;
}

.page-topic .lastpost span>center>span {
   font-size: 14px !important;
}
por pedxz
em 17.03.22 20:11
 
Procurar em: Questões resolvidas sobre a aparência do fórum
Tópico: Alterar a cor dos campos no tópico
Respostas: 7
Vistos: 477

Menu rápido efeito ao passar o cursor

Detalhes da questão


Endereço do fórum: https://divtes.foroactivo.com/
Versão do fórum: AwesomeBB

Descrição


Olá a todos. Estou tentando acomodar o hover, mas não consigo. Eu seleciono uma camada inteira e parece errado ao passar o mouse.
Por exemplo, use o elemento de fa-quick-links-toggler mas eu seleciono o elemento inteiro. E quando eu adiciono cor a ele. O hover está muito lá fora.
Spoiler:




Aqui mostro o que só quero que ele verifique quando escolho uma cor ao passar o mouse.
Spoiler:
por LucianoMicle
em 17.03.22 17:51
 
Procurar em: Questões resolvidas sobre códigos Javascript e jQuery
Tópico: Menu rápido efeito ao passar o cursor
Respostas: 3
Vistos: 439

Criar menu suspenso na barra de navegação

LucianoMicle escreveu:Olá amigo! @Pedxz
A parte quando você clica no menu e move o mouse para baixo. Eles também se movem
Como fiz a edição na versão #AwesomeBB sem edições o sub-menu ficou fixo. Altere ' position: fixed;', para ' position: absolute;',
por pedxz
em 17.03.22 15:21
 
Procurar em: Questões resolvidas sobre códigos Javascript e jQuery
Tópico: Criar menu suspenso na barra de navegação
Respostas: 8
Vistos: 517

Criar menu suspenso na barra de navegação

Olá amigo! @Pedxz
A parte quando você clica no menu e move o mouse para baixo. Eles também se movem
por LucianoMicle
em 17.03.22 15:18
 
Procurar em: Questões resolvidas sobre códigos Javascript e jQuery
Tópico: Criar menu suspenso na barra de navegação
Respostas: 8
Vistos: 517

Criar menu suspenso na barra de navegação

Altere o código para
Código:
/*globals jQuery*/

/**
 * Creates a custom links tab.
 *
 * @author  Luiz Felipe F.
 * @see      https://lffg.github.io
 * @version  1.0.0
 * @license  MIT
 */
(function($, css) {
    'use strict';

    var categories = [{
        name: 'Categoria de Links 1',
        links: [{
            html: 'Link 1 (Cat. 1)',
            href: '#'
        }, {
            html: 'Link 3 (Cat. 1)',
            href: '#'
        }, {
            html: 'Link 2 (Cat. 1)',
            href: '#'
        }]
    }, {
        name: 'Categoria de Links 2',
        links: [{
            html: 'Link 1 (Cat. 2)',
            href: '#'
        }, {
            html: 'Link 3 (Cat. 2)',
            href: '#'
        }, {
            html: 'Link 2 (Cat. 2)',
            href: '#'
        }]
    }];

    $(function() {
        var $wrapper = $([
            '<li class="fa-quick-links-wrapper">',
            '  <a class="fa-quick-links-toggler">',
            '    <i class="material-icons">menu</i>',
            '  </a>',
            '  <div class="fa-quick-links-inner"></div>',
            '</li>'
        ].join(''));

        var $toggler = $wrapper.find('.fa-quick-links-toggler');
        var $links = $wrapper.find('.fa-quick-links-inner');

        $toggler.on('click', function(event) {
            event.preventDefault();

            $(this).toggleClass('active');
        });

        $wrapper.on('click', function(event) {
            event.stopPropagation();
        });

        $(document).on('click', function() {
            if ($toggler.is('.active')) $toggler.removeClass('active');
        });

        $.each(categories, function(index, category) {
            if (!category.links) return;

            var $category = $([
                '<div class="fa-quick-links-category">',
                '  ' + $('<label>', {
                    'text': category.name
                }).prop('outerHTML'),
                '  <ul></ul>',
                '</div>'
            ].join(''));

            $.each(category.links, function(index, link) {
                if (!link.href || !link.html) return;

                $('<a>', {
                    'class': 'fa-quick-links-link',
                    'href': link.href,
                    'html': link.html
                }).appendTo($category.find('ul'));
            });

            $category.appendTo($links);
        });

        $wrapper.appendTo('#header-navigation');
        $('<style>', {
            'text': css.join('')
        }).appendTo('head');
    });
})(jQuery, [
    '.fa-quick-links-wrapper, .fa-quick-links-wrapper * {',
    '  box-sizing: border-box;',
    '}',
    '',
    '.fa-quick-links-wrapper > .fa-quick-links-toggler:hover {',
    '  background-color: #444;',
    '}',
    '',
    '.fa-quick-links-wrapper > .fa-quick-links-inner {',
    '  display: none;',
    '}',
    '',
    '.fa-quick-links-wrapper > .fa-quick-links-toggler.active + .fa-quick-links-inner {',
    '  display: block;',
    '}',
    '',
    '.fa-quick-links-inner {',
    '  background-color: #fff;',
    '  box-shadow: 0 2px 3px rgba(0,0,0,0.1), 0 0 2px rgba(0,0,0,0.1);',
    '  border-radius: 3px;',
    '  margin-top: 1px;',
    '  padding: .25rem;',
    '  width: 310px;',
    '  max-height: 300px;',
    '  overflow-y: scroll;',
    '  position: fixed;',
    '}',
    '',
    '.fa-quick-links-category ul {',
    '  margin: 0;',
    '  margin-top: .25rem;',
    '  margin-bottom: .25rem;',
    '}',
    '',
    '.fa-quick-links-inner > div > label {',
    '  background-color: #263238;',
    '  display: block;',
    '  color: #fff;',
    '  border-radius: 3px;',
    '  font-weight: 400;',
    '  margin-bottom: 0;',
    '  height: 45px;',
    '  line-height: 45px;',
    '  text-indent: 12px;',
    '}',
    '',
    '.fa-quick-links-inner > div a {',
    '  display: block !important;',
    '  font-size: 11.6px;',
    '  color: #263238 !important;',
    '  height: auto !important;',
    '  line-height: 4;',
    '}',
    '',
    '.fa-quick-links-inner > div a:hover {',
    '  color: #1E88E5 !important;',
    '  border-radius: 3px;',
    '  background-color: #f0f0f0 !important;',
    '}',
    '',
    '.fa-quick-links-inner::-webkit-scrollbar {',
    '  width: 10px;',
    '}',
    '',
    '.fa-quick-links-inner::-webkit-scrollbar-track {',
    '  background: #dddddd;',
    '}',
    '',
    '.fa-quick-links-inner::-webkit-scrollbar-thumb {',
    '  background: #c3c5c5;',
    '  box-shadow: inset 0 0 3px 1px #00000026;',
    '}'
]);
Demonstração

Menu - Procurar Image28
por pedxz
em 17.03.22 15:08
 
Procurar em: Questões resolvidas sobre códigos Javascript e jQuery
Tópico: Criar menu suspenso na barra de navegação
Respostas: 8
Vistos: 517

Criar menu suspenso na barra de navegação

Olá @Pedxz
Eu o instalei, mas, ao instalá-lo, ele permanece fixo na barra do navegador.
Quer dizer, isso quer dizer que está ao lado das últimas edições.

Menu - Procurar Menu110

Edit: Também está atrás do menu.
Menu - Procurar Menu210
por LucianoMicle
em 16.03.22 17:59
 
Procurar em: Questões resolvidas sobre códigos Javascript e jQuery
Tópico: Criar menu suspenso na barra de navegação
Respostas: 8
Vistos: 517

Alterar a cor dos campos no tópico

Código:
div#site-desc {
    display: none;
}
.postprofile-name a[href] {
    background: url(https://i.imgur.com/FgKNYTV.gif);
}
.postprofile-avatar img {
height: unset;
width: unset;
max-height: 300px;
max-width: 150px;
border-radius: 10px !important;
border: 1px solid darkgray !important;
}
.post-head {
    border-width: 0 !important;
}
/*COR GRUPO LEGENDA*/
.color-groups[style$="##FF8C00"],
.postprofile-name span[style$="#FF8C00"],
a[href^="/u"] span[style$="#FF8C00"],
a[href^="/g3-"],
.color-groups[style$="##FF8C00"],
.color-groups[style$="##FF8C00"],
.postprofile-name span[style$="#FF8C00"],
a[href^="/u"] span[style$="#FF8C00"],
a[href^="/g5-"],
.color-groups[style$="##FF8C00"],
.postprofile-name span[style$="#FF8C00"],
a[href^="/u"] span[style$="#FF8C00"],
a[href^="/g6-"],
.color-groups[style$="##FF8C00"],
.postprofile-name span[style$="#FF8C00"],
a[href^="/u"] span[style$="#FF8C00"],
a[href^="/g7-"],
.color-groups[style$="##FF8C00"],
.postprofile-name span[style$="#FF8C00"],
a[href^="/u"] span[style$="#FF8C00"],
a[href^="/g8-"],
.color-groups[style$="##FF8C00"],
.postprofile-name span[style$="#FF8C00"],
a[href^="/u"] span[style$="#FF8C00"],
a[href^="/g9-"],
.color-groups[style$="##FF8C00"],
.postprofile-name span[style$="#FF8C00"],
a[href^="/u"] span[style$="#FF8C00"],
a[href^="/g10-"],
.color-groups[style$="##FF8C00"],
.color-groups[style$="##FF8C00"],
.postprofile-name span[style$="#FF8C00"],
a[href^="/u"] span[style$="#FF8C00"],
a[href^="/g4-"] { 
  background: url(https://i.imgur.com/FgKNYTV.gif);
  text-shadow: 2px 0 11px CurrentColor;
}
.post-author-name {
    font-size: 18px;
}
/*BRILHO*/
a[style*="#CC0436"], span[style*="color:#CC0436"], a[style*="#FF0048"], span[style*="color:#FF0048"], a[style*="#7A2B00"], span[style*="color:#7A2B00"], a[style*="#D17008"], span[style*="color:#D17008"], a[style*="#0081C7"], span[style*="color:#0081C7"] {
    background: url(https://i.imgur.com/FgKNYTV.gif);
    text-shadow: 2px 0 11px CurrentColor;
}
.page-topic .row .pagination{
  display: block;
}
.page-topic span.postreplies{
  margin-right: 8px;
}
.page-topic .postdetails{
  margin-top: 4px;
}
.page-topic .lastpost{
  float: right;
  display: flex;
  flex-flow: column;
  align-items: center;
}
.page-topic span.lastpost-avatar{
  padding: 0!important;
}
.page-topic .lastpost center span{
  text-align: center;
  width: 100%;
}
.forumbg.announcement {
    background-color: transparent;
}
.forumbg .header {
    background-color: #22b3a7;
}
.page-topic .row {
    border: 0;
    margin: 10px 0;
    box-shadow: 0 1px 6px rgb(0,0,0,6%);
    display: grid;
    align-items: center;
    height: 130px;
}
/* Add a black background color to the top navigation */
.topnav {
  background-color: #333;
  overflow: hidden;
}
 
/* Style the links inside the navigation bar */
.topnav a {
  float: left;
  display: block;
  color: #f2f2f2;
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
  font-size: 17px;
 
}
 
 
/* Change the color of links on hover */
.topnav a:hover {
  background-color: #ddd;
  color: black;
}
 
/* Add an active class to highlight the current page */
.active {
  background-color: #4CAF50;
  color: white;
}
 
/* Hide the link that should open and close the topnav on small screens */
.topnav .icon {
  display: none;
 
  position: fixed!important;
}
.topnav {
    position: fixed;
    width: 100%;
    z-index: 10;
}
 
 /***************fim menu**********/





#wrap {
    margin-left: auto;
    margin-right: auto;
    width: 100%;
    box-sizing: border-box;
}


/***Efeito LightBox MP***/
 
.fancybox-tmp iframe,.fancybox-tmp object{vertical-align:top;margin:0;padding:0}
.fancybox-wrap{position:absolute;top:0;left:0;z-index:1002}
.fancybox-outer{background:#f9f9f9;color:#444;text-shadow:none;-webkit-border-radius:4px;-moz-border-radius:4px;border-radius:4px;margin:0;padding:0}
.fancybox-opened{z-index:1003}
.fancybox-opened .fancybox-outer{-webkit-box-shadow:0 10px 25px rgba(0,0,0,0.5);-moz-box-shadow:0 10px 25px rgba(0,0,0,0.5);box-shadow:0 10px 25px rgba(0,0,0,0.5)}
.fancybox-inner{width:100%;height:100%;position:relative;outline:none;overflow:hidden;margin:0;padding:0}
.fancybox-error{color:#444;font:14px/20px "Helvetica Neue",Helvetica,Arial,sans-serif;margin:0;padding:10px}
.fancybox-image,.fancybox-iframe{display:block;width:100%;height:100%;border:0;vertical-align:top;margin:0;padding:0}
.fancybox-image{max-width:100%;max-height:100%}
#fancybox-loading{position:fixed;top:50%;left:50%;margin-top:-21px;margin-left:-21px;width:42px;height:42px;background:url(https://i.servimg.com/u/f48/16/58/89/73/fancyb10.gif);opacity:0.8;cursor:pointer;z-index:1010}
.fancybox-close,.fancybox-prev span,.fancybox-next span{background-image:url(https://i.servimg.com/u/f48/16/58/89/73/fancyb10.png)}
.fancybox-close{position:absolute;top:-18px;right:-18px;width:36px;height:36px;cursor:pointer;z-index:1004}
.fancybox-tmp{position:absolute;top:-9999px;left:-9999px;overflow:visible;visibility:hidden;padding:0}
#fancybox-overlay{position:absolute;top:0;left:0;overflow:hidden;display:none;z-index: 999;background:#000}
.fancybox-title{display:none}
.fancybox-title-float-wrap{position:absolute;bottom:0;right:50%;margin-bottom:-35px;z-index: 999;text-align:center}
.fancybox-title-float-wrap .child{display:inline-block;margin-right:-100%;background:rgba(0,0,0,0.8);-webkit-border-radius:15px;-moz-border-radius:15px;border-radius:15px;text-shadow:0 1px 2px #222;color:#FFF;font-weight:700;line-height:24px;white-space:nowrap;padding:2px 20px}
.fancybox-title-outside-wrap{position:relative;margin-top:10px;color:#fff}
.fancybox-title-inside-wrap{margin-top:10px}
.fancybox-title-over-wrap{position:absolute;bottom:0;left:0;color:#fff;background:rgba(0,0,0,.8);padding:10px}
/***Cursor Modificado***/
 }
/* Start https://www.cursors-4u.com */ * {cursor: url(https://cur.cursors-4u.net/cursors/cur-1/cur90.cur), auto !important;} /* End https://www.cursors-4u.com */
.forabg .header {
@import url('https://fonts.googleapis.com/css2?family=Lobster&display=swap');
.table-title h2 {
font-family: 'Lobster', sans-serif !important;
font-size: 2rem !important;
}
#right {
display: block !important;
}
       
 #container {
margin-right: 250px !important;
padding-right: 1rem;
}


.headerbar {
    z-index: 9999!important;
}
  .postprofile-info, .postprofile-info * {
  color: inherit !important;
}
/* MENU INICIAL */
a.gensmall {border: none;}
.block {width: 100%;display: block;float: left;border-radius: 3px;background-color: #fff;
box-shadow: 0 2px 3px rgba(0,0,0,0.1), 0 0 2px rgba(0,0,0,0.1);font-size: 13px;padding: 16px;}
.block a:link,.block a:visited {color: #444;}
.block .h3 { font-size: 20px;border: none;}
.block .h3 i {height: 28px;line-height: 30px;margin-right: 10px;color: #fff;}
.stats-tabs br {display:none;}
.stats-tabs section {display: none;padding: 20px 0 0;}
.stats-tabs input { display: none; }
.stats-tabs label {display: inline-block;margin: 0 0 -1px;padding: 15px 25px;font-weight: 600;text-align: center;color: #A0B8B5;}
.stats-tabs label:before {font-family: "Font Awesome 5 Free";margin-right: 10px;}
.stats-tabs label[for*='1']:before { content: '\f0c0'; }
.stats-tabs label[for*='2']:before { content: '\f1fd'; }
.stats-tabs label[for*='3']:before { content: '\f187'; }
.stats-tabs label:hover {color: darkcyan;cursor: pointer;}
.stats-tabs input:checked + label {color: darkcyan;border-top: 2px solid darkcyan;border-left: 1px solid #A0B8B5;border-right: 1px solid #A0B8B5;border-bottom: 1px solid #fff;}
.stats-tabs #tab1:checked ~ #content1,.stats-tabs #tab2:checked ~ #content2,.stats-tabs #tab3:checked ~ #content3 { display: block; }
@media screen and (max-width: 800px) {.stats-tabs label {font-size: 0;}
.stats-tabs label:before {margin: 0;font-size: 18px;}}
@media screen and (max-width: 500px) {.stats-tabs label {padding: 15px;}}
.block .legend { font-size: 0px; }
.block .legend b a {font-size: 13px;font-weight: 600;}
.block .legend b a::after {content: ", ";font-weight: 400;color: #fff;}
.block .legend b:last-child a::after { content: ""; }
.block .legend {display: inline-flex;white-space:break-spaces;}
#content1, #content2 {line-height: 3;}
.stats-tabs section {border-top: 1px solid #A0B8B5;}
}
/*END Who's online*/
 
 
/* Banner */
.headerbar {
height: 150px;
}
/* Posição menu */
div#headerbar-top:not(.is-sticky) {
    margin-top: 81px;
}
#wrap {
    padding: 9px;
}
/* Remover faq/calendario do menu */
.mainmenu[href="/faq"],
.mainmenu[href="/calendar"] {
    display: none !important;
}
/* Icons menu */
.mainmenu > img {
  display: none;
}
 
.mainmenu::before {
  font-family: "Font Awesome 5 Free"
  content: "\f015"
  display: inline;
  margin-right: 5px;
  font: normal normal normal 14px/1 FontAwesome;
  font-size: 15px;
  font-size: inherit;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
 
.mainmenu[href*="groups"]::before {
  content: "\f1b2";
}
 
.mainmenu[href*="search"]::before {
  content: "\f002";
}
 
.mainmenu[href*="memberlist"]::before {
  content: "\f0c0";
}
 
.mainmenu[href*="privmsg"]::before {
  content: "\f0e0";
}
 
.mainmenu[href*="profile"]::before {
  content: "\f007";
}
 
.mainmenu[href*="login"]::before {
  content: "\f011";
}
 
.mainmenu[href*="register"]::before {
  content: "\f2b9";
  /* Nick Piscando  KKKKK*/
span[style="color:#CC0436"] strong {
    -webkit-animation-name: blinker;
    -webkit-animation-duration: 1s;
    -webkit-animation-timing-function: linear;
    -webkit-animation-iteration-count: infinite;
 
    -moz-animation-name: blinker;
    -moz-animation-duration: 1s;
    -moz-animation-timing-function: linear;
    -moz-animation-iteration-count: infinite;
 
    animation-name: blinker;
    animation-duration: 1s;
    animation-timing-function: linear;
    animation-iteration-count: infinite;
}
 
@-moz-keyframes blinker {
    0% { opacity: 1.0; }
    50% { opacity: 0.0; }
    100% { opacity: 1.0; }
}
 
@-webkit-keyframes blinker {
    0% { opacity: 1.0; }
    50% { opacity: 0.0; }
    100% { opacity: 1.0; }
}
 
@keyframes blinker {
    0% { opacity: 1.0; }
    50% { opacity: 0.0; }
    100% { opacity: 1.0; }
}
 #container {
    margin-right: 90px !important;
    margin-left: 0 !important;
    padding-right: 1rem;
}
        .page-topic .topic-title a {
            font-size: 16px !important;
        }
       
        .page-topic .lastpost span > center > span {
            font-size: 14px !important;
        }

pronto <3
por PauloVinicios1755
em 16.03.22 16:25
 
Procurar em: Questões resolvidas sobre a aparência do fórum
Tópico: Alterar a cor dos campos no tópico
Respostas: 7
Vistos: 477

Modificar a barra de interações do fórum

Olá @NiltoN_C,

Primeiramente faça a alteração neste tópico "Remover menu fixo ao descer a página (ModernBB)" e após adicione na folha de estilo (CSS) o seguinte código:
Código:
#page-header {
  display: flex;
  justify-content: center;
  align-content: center;
  height: auto;
  margin-top: 5rem;
  width: 73.4333%;
  margin-right: auto;
  margin-left: auto;
}

#page-header .headerbar {
  width: 100%;
  height: auto;
}

#headerbar-top::after {

    clear: both;
    content: "";
    display: block;

}

#headerbar-top {
    background-color: #2c353b !important;
}

#page-header .wrap {
  padding: 0;
  margin: 0;
  width: 100%;
  max-width: 100%;
  height: inherit;
}

#page-header .navlinks {
  height: inherit;
  display: flex;
  justify-content: space-around;
  align-items: center;
}

#page-header .navbar li {
  display: inline-flex;
  margin: 0;
}
Atenciosamente,
pedxz.
por pedxz
em 16.03.22 15:48
 
Procurar em: Questões resolvidas sobre a aparência do fórum
Tópico: Modificar a barra de interações do fórum
Respostas: 3
Vistos: 468

Criar menu suspenso na barra de navegação

Olá @LucianoMicle,

Veja se este tutorial ajuda: "Criar um menu lateral com links rápidos". Qualquer dúvida disponha!


Atenciosamente,
pedxz.
por pedxz
em 16.03.22 15:19
 
Procurar em: Questões resolvidas sobre códigos Javascript e jQuery
Tópico: Criar menu suspenso na barra de navegação
Respostas: 8
Vistos: 517

Mensagem na Página Principal

Musashi escreveu:Boa noite @Invisveel!

Primeiramente me informe o seu overall_header para que possamos dar continuidade em sua questão! Muito feliz

(Aguardo respostas)
Abraços,
do seu amigo da comunidade, Musashi! Muito feliz


Olá! Bom dia, o código está no spoiler abaixo:

overral_header:
por Invisveel
em 14.03.22 12:20
 
Procurar em: Questões resolvidas sobre HTML e BBCode
Tópico: Mensagem na Página Principal
Respostas: 10
Vistos: 461

Criar menu suspenso na barra de navegação

Detalhes da questão


Endereço do fórum: https://divtes.foroactivo.com/
Versão do fórum: AwesomeBB

Descrição


Olá
Eu estava procurando no fórum um tutorial ou um tópico semelhante ao que estou procurando, mas não encontrei nenhum.
Quero adicionar um menu suspenso na barra de navegação e os elementos que aparecem nesse menu vão para uma página criada por HTML.
Deixo um exemplo:
Spoiler:



Aguardo resposta, abraço
por LucianoMicle
em 13.03.22 5:00
 
Procurar em: Questões resolvidas sobre códigos Javascript e jQuery
Tópico: Criar menu suspenso na barra de navegação
Respostas: 8
Vistos: 517

Separe o nome e o avatar por caixas nos tópico

Tópico movido


O tópico foi movido para o setor: Questões sobre a aparência do fórum.


Nota: É importante que procure escolher a área certa para a sua questão afim de manter a organização do fórum.
Para mais informações, leia o Regulamento do Fórum dos Fóruns

Boa noite @LucianoMicle!

Adicione em sua Folha de Estilo (CSS) o seguinte código:

Código:
.post-author-name {
  border-left: 5px solid #c3c3c3;
  background-color: #F5F5F5;
  border-radius: 3px;
  box-shadow: 0 2px 3px rgb(0 0 0 / 10%), 0 0 2px rgb(0 0 0 / 10%);
  font-size: 13px;
  margin: 6px 3px 0;
  padding: 6px 10px;
  height: 30px;
  position: absolute;
  z-index: 999;
  float: left;
  left: 19px;
  width: calc(19% + 7px);
  text-align: center;
}
.post-aside {
    border-left: 5px solid #c3c3c3;
    background-color: #F5F5F5;
    border-radius: 3px;
    box-shadow: 0 2px 3px rgb(0 0 0 / 10%), 0 0 2px rgb(0 0 0 / 10%);
    flex-basis: 235px;
    flex-grow: 0;
    flex-shrink: 0;
    float: left;
    font-size: 13px;
    margin: 6px 3px 0;
    padding: 10px 10px;
    position: relative;
    text-align: center;
    margin-top: 45px;
}


Logo em seguida, modifique seu viewtopic_body para este:

Código:
<!-- BEGIN switch_plus_menu -->
<script type="text/javascript">
 //<![CDATA[
 var multiquote_img_off = '{JS_MULTIQUOTE_IMG_OFF}', multiquote_img_on = '{JS_MULTIQUOTE_IMG_ON}';
</script>
<!-- END switch_plus_menu -->
<script type="text/javascript">
    var hiddenMsgLabel = { visible:'{JS_HIDE_HIDDEN_MESSAGE}', hidden:'{JS_SHOW_HIDDEN_MESSAGE}' };
    showHiddenMessage = function(id)
    {
        try
        {
            var regId = parseInt(id, 10);
            if( isNaN(regId) ) { regId = 0; }
 
            if( regId > 0)
            {
                $('.post--' + id).parent().toggle(0, function()
                {
                    if( $(this).is(":visible") )
                    {
                        $('#hidden-title--' + id).html(hiddenMsgLabel.visible);
                    }
                    else
                    {
                        $('#hidden-title--' + id).html(hiddenMsgLabel.hidden);
                    }
                });
            }
        }
        catch(e) { }
 
        return false;
    };
    //]]>
</script>
 
<main id="topic">
    <div class="topic-header">
        <h1><a href="{TOPIC_URL}">{TOPIC_TITLE}</a></h1>
        <!-- BEGIN switch_user_authpost -->
        <a href="{U_POST_NEW_TOPIC}" rel="nofollow" title="{T_POST_NEW_TOPIC}" {S_POST_NEW_TOPIC} class="btn btn-default mobile-hidden">
            <i class="material-icons">{I_POST_NEW_TOPIC}</i>
            <span>{L_POST_NEW_TOPIC}</span>
        </a>
        <!-- END switch_user_authpost -->
        <!-- BEGIN switch_user_authreply -->
        <a href="{U_POST_REPLY_TOPIC}" title="{T_POST_REPLY_TOPIC}" {S_POST_REPLY_TOPIC} class="btn btn-default">
            <i class="material-icons">{I_POST_REPLY_TOPIC}</i>
            <span>{L_POST_REPLY_TOPIC}</span>
        </a>
        <!-- END switch_user_authreply -->
        {POSTERS_LIST}
        <div id="breadcrumbs" class="breadcrumbs-topic">
            <a href="{U_INDEX}"><i class="material-icons">home</i> <span>{L_INDEX}</span></a>
            {NAV_CAT_DESC}
        </div>
        <!-- BEGIN topicpagination -->
        <div class="pagination">
            {PAGINATION}
        </div>
        <!-- END topicpagination -->
    </div>
 
    <div class="topic-actions">
        <div class="topic-actions-buttons">
            <!-- BEGIN switch_plus_menu -->
            <div class="plus-menu-wrap">
                <script type="text/javascript">//<![CDATA[
                    var url_favourite = '{U_FAVOURITE_JS_PLUS_MENU}';
                    var url_newposts = '{U_NEWPOSTS_JS_PLUS_MENU}';
                    var url_egosearch = '{U_EGOSEARCH_JS_PLUS_MENU}';
                    var url_unanswered = '{U_UNANSWERED_JS_PLUS_MENU}';
                    var url_watchsearch = '{U_WATCHSEARCH_JS_PLUS_MENU}';
                    insert_plus_menu_new('f{FORUM_ID}&amp;t={TOPIC_ID}','{JS_SESSION_ID}', {JS_AUTH_FAVOURITES});
                    //]]>
                </script>
            </div>
            <!-- END switch_plus_menu -->
 
            <!-- BEGIN switch_twitter_btn -->
            <span>
 <a href="https://twitter.com/share" class="twitter-share-button" data-via="{TWITTER}">Tweet</a>
 <script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+'://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js,fjs);}}(document, 'script', 'twitter-wjs');</script>
 </span>
            <!-- END switch_twitter_btn -->
 
            <!-- BEGIN switch_fb_likebtn -->
            <script>(function(d, s, id) {
                    var js, fjs = d.getElementsByTagName(s)[0];
                    if (d.getElementById(id)) return;
                    js = d.createElement(s); js.id = id;
                    js.src = "https://connect.facebook.net/{LANGUAGE}/all.js#xfbml=1";
                    fjs.parentNode.insertBefore(js, fjs);
                }(document, 'script', 'facebook-jssdk'));</script>
            <span class="fb-like" data-href="{FORUM_URL}{TOPIC_URL}" data-layout="button_count" data-action="like" data-show-faces="false" data-share="false"></span>
            <!-- END switch_fb_likebtn -->
 
            <!-- BEGIN switch_plus_menu -->
 <div id="addthis-toolbar">
 <div class="btn-floating-left" tabindex="100">
                    {L_SHARE}
 </div>
 <div class="addthis-toolbar-btn" style="position:absolute; z-index:1000; display: none; background-color: #fff;">
                    {switch_plus_menu.SOCIAL_BUTTONS}
 </div>
 </div>
 
            {switch_plus_menu.JS_SOCIAL_BUTTONS}
            <!-- END switch_plus_menu -->
        </div>
    </div>
 <!-- BEGIN switch_isconnect -->
 <div class="quick-nav-topics">
 <a href="{U_VIEW_OLDER_TOPIC}" title="{L_VIEW_PREVIOUS_TOPIC}"><i class="material-icons">chevron_left</i><span>{L_PREVIOUS}</span></a>
 <a href="{U_VIEW_NEWER_TOPIC}" title="{L_VIEW_NEXT_TOPIC}" style="float: right;"><span>{L_NEXT}</span><i class="material-icons">chevron_right</i></a>
 </div>
 <!-- END switch_isconnect -->
 
    {POLL_DISPLAY}
 
    <!-- BEGIN postrow -->
    <!-- BEGIN hidden -->
    <div class="post-wrap {postrow.hidden.ROW_CLASS} post-hidden">
        <div class="block">
            <div class="block-content">
                {postrow.hidden.MESSAGE}
                <div class="block-footer" style="display: none;">
                    <!-- END hidden -->
 
                    <!-- BEGIN displayed -->
                    <div id="post-{postrow.U_POST_ID}" class="post-wrap {postrow.displayed.ROW_COUNT}{postrow.displayed.ONLINE_IMG_NEW} post--{postrow.displayed.U_POST_ID}">
                        <div id="{postrow.U_POST_ID}" class="post-header">
                            <h2>
                                <i class="material-icons">description</i>
                                {postrow.displayed.ICON}
 <span class="post-heading-wrap">
 <a href="{postrow.displayed.POST_URL}">{postrow.displayed.POST_SUBJECT}</a>
 <span class="post-date">{postrow.displayed.POST_DATE_NEW}</span>
 </span>
 </h2>
 <div class="mobile-hide post-buttons">
 <ul>
 <li class="btn-thank">
                                        {postrow.displayed.THANK_IMG}
                                    </li>
                                    <li class="btn-quote-multi">
                                        {postrow.displayed.MULTIQUOTE_IMG}
                                    </li>
                                    <li class="btn-quote">
                                        {postrow.displayed.QUOTE_IMG}
                                    </li>
                                    <li class="btn-edit">
                                        {postrow.displayed.EDIT_IMG}
                                    </li>
                                    <li class="btn-delete">
                                        {postrow.displayed.DELETE_IMG}
                                    </li>
                                    <li class="btn-ip">
                                        {postrow.displayed.IP_IMG}
                                    </li>
                                    <li class="btn-report">
                                        {postrow.displayed.REPORT_IMG_NEW}
                                    </li>
                                </ul>
                            </div>
                            <div class="mobile-show dropdown post-buttons-mobile">
                                <i class="material-icons">more_horiz</i>
                                <ul class="dropdown-box">
                                    <li class="btn-thank">
                                        {postrow.displayed.THANK_IMG}
                                    </li>
                                    <li class="btn-quote-multi">
                                        {postrow.displayed.MULTIQUOTE_IMG}
                                    </li>
                                    <li class="btn-quote">
                                        {postrow.displayed.QUOTE_IMG}
                                    </li>
                                    <li class="btn-edit">
                                        {postrow.displayed.EDIT_IMG}
                                    </li>
                                    <li class="btn-delete">
                                        {postrow.displayed.DELETE_IMG}
                                    </li>
                                    <li class="btn-ip">
                                        {postrow.displayed.IP_IMG}
                                    </li>
                                    <li class="btn-report">
                                        {postrow.displayed.REPORT_IMG_NEW}
                                    </li>
                                </ul>
                            </div>
                        </div>
                        <div class="post-body">
                            <div class="post">
                                <div class="post-content">
                                    {postrow.displayed.MESSAGE}
 
                                    {postrow.displayed.EDITED_MESSAGE}
 
                                    <!-- BEGIN switch_attachments -->
                                    <div class="attachbox">
 <b>{postrow.displayed.switch_attachments.L_ATTACHMENTS}</b>
                                        <dl class="attachments">
                                            <!-- BEGIN switch_post_attachments -->
                                            <dt>
                                                <!-- BEGIN switch_dl_att -->
                                                <a class="postlink btn btn-flat" href="{postrow.displayed.switch_attachments.switch_post_attachments.switch_dl_att.U_ATTACHMENT}"><i class="material-icons">attach_file</i>{postrow.displayed.switch_attachments.switch_post_attachments.switch_dl_att.ATTACHMENT}</a> {postrow.displayed.switch_attachments.switch_post_attachments.switch_dl_att.ATTACHMENT_DEL}
                                                <!-- END switch_dl_att -->
                                                <!-- BEGIN switch_no_dl_att -->
 <div class="postlink btn btn-flat" style="cursor: not-allowed"><i class="material-icons">attach_file</i>{postrow.displayed.switch_attachments.switch_post_attachments.switch_no_dl_att.ATTACHMENT}</div> {postrow.displayed.switch_attachments.switch_post_attachments.switch_no_dl_att.ATTACHMENT_DEL}
                                                <!-- END switch_no_dl_att -->
                                            </dt>
                                            <dd>
                                                <!-- BEGIN switch_no_comment -->
                                                <p>
                                                    {postrow.displayed.switch_attachments.switch_post_attachments.switch_no_comment.ATTACHMENT_COMMENT}
 </p>
 <!-- END switch_no_comment -->
 <!-- BEGIN switch_no_dl_att -->
 <p><strong>{postrow.displayed.switch_attachments.switch_post_attachments.switch_no_dl_att.TEXT_NO_DL}</strong></p>
 <!-- END switch_no_dl_att -->
 <p>(<span class="ltr">{postrow.displayed.switch_attachments.switch_post_attachments.FILE_SIZE}</span>) {postrow.displayed.switch_attachments.switch_post_attachments.NB_DL}</p>
 </dd>
 <!-- END switch_post_attachments -->
 </dl>
 </div>
 <!-- END switch_attachments -->
 <!-- BEGIN switch_signature -->
 <div class="post-signature" id="sig{postrow.displayed.U_POST_ID}">{postrow.displayed.SIGNATURE_NEW}</div>
 <!-- END switch_signature -->
 </div>
 <div class="post-footer<!-- BEGIN switch_likes_active --> likes-active<!-- END switch_likes_active --><!-- BEGIN switch_vote_active --> vote-active<!-- END switch_vote_active -->">
 <!-- BEGIN switch_likes_active -->
 <div class="fa_like_div">
 <button class="rep-button {postrow.displayed.switch_likes_active.C_VOTE_LIKE}"  data-href="{postrow.displayed.switch_likes_active.U_VOTE_LIKE}" data-href-rm="{postrow.displayed.switch_likes_active.U_VOTE_RM_LIKE}">
 <span class="rep-cat">
 <i class="material-icons">thumb_up</i>
 {postrow.displayed.switch_likes_active.COUNT_VOTE_LIKE}
 </span>
 <span>{postrow.displayed.switch_likes_active.L_LIKE}</span>
 </button>
 <!-- BEGIN switch_dislike_button -->
 <button class="rep-button {postrow.displayed.switch_likes_active.switch_dislike_button.C_VOTE_DISLIKE}" data-href="{postrow.displayed.switch_likes_active.switch_dislike_button.U_VOTE_DISLIKE}" data-href-rm="{postrow.displayed.switch_likes_active.switch_dislike_button.U_VOTE_RM_LIKE}">
 <span class="rep-cat">
 <i class="material-icons">thumb_down</i>
 {postrow.displayed.switch_likes_active.switch_dislike_button.COUNT_VOTE_DISLIKE}
 </span>
 <span>{postrow.displayed.switch_likes_active.switch_dislike_button.L_DISLIKE}</span>
 </button>
 <!-- END switch_dislike_button -->
                                        <!-- BEGIN switch_like_list -->
                                        {postrow.displayed.switch_likes_active.switch_like_list.D_LIKE_LIST}
                                        <!-- END switch_like_list -->
                                        <!-- BEGIN switch_dislike_list -->
                                        {postrow.displayed.switch_likes_active.switch_dislike_list.D_DISLIKE_LIST}
                                        <!-- END switch_dislike_list -->
 </div>
 <!-- END switch_likes_active -->
 <!-- BEGIN switch_vote_active -->
 <div class="vote">
 <!-- BEGIN switch_vote -->
 <a href="{postrow.displayed.switch_vote_active.switch_vote.U_VOTE_PLUS}" class="vote-up">
 <i class="material-icons">add_circle_outline</i>
 </a>
 <!-- END switch_vote -->
 
 <!-- BEGIN switch_vote -->
 <a href="{postrow.displayed.switch_vote_active.switch_vote.U_VOTE_MINUS}" class="vote-down">
 <i class="material-icons">remove_circle_outline</i>
 </a>
 <!-- END switch_vote -->
 
                                        <!-- BEGIN switch_bar -->
                                        <div class="vote-bar" title="{postrow.displayed.switch_vote_active.L_VOTE_TITLE}">
                                            <div class="vote-bar-desc">
                                                {postrow.displayed.switch_vote_active.L_VOTE_TITLE}
                                            </div>
 
                                            <div class="vote-bars">
                                                <!-- BEGIN switch_vote_plus -->
                                                <div class="vote-bar-plus" style="width:{postrow.displayed.switch_vote_active.switch_bar.switch_vote_plus.HEIGHT_PLUS}px;"></div>
                                                <!-- END switch_vote_plus -->
 
                                                <!-- BEGIN switch_vote_minus -->
                                                <div class="vote-bar-minus" style="width:{postrow.displayed.switch_vote_active.switch_bar.switch_vote_minus.HEIGHT_MINUS}px;"></div>
                                                <!-- END switch_vote_minus -->
                                            </div>
                                        </div>
                                        <!-- END switch_bar -->
 
 <!-- BEGIN switch_no_bar -->
 <div title="{postrow.displayed.switch_vote_active.L_VOTE_TITLE}" class="vote-bar-empty"></div>
 <!-- END switch_no_bar -->
 </div>
 <!-- END switch_vote_active -->
 </div>
 </div>
 <div class="post-author-status"></div>
 <div class="post-author">
 <span class="post-author-name">
 {postrow.displayed.POSTER_NAME}
 </span>
                                    <span class="post-author-title">
 
 </span>
                                </div>
  <aside class="post-aside">
 <div class="post-author-avatar">
                                    <div class="avatar-big">
                                        {postrow.displayed.POSTER_AVATAR}
                                    </div>
                                                                                                                                                                                    {postrow.displayed.POSTER_RANK_NEW}{postrow.displayed.RANK_IMAGE}
                                </div>
 <div {postrow.displayed.AWARDS_SHOW} class="dd_award {postrow.displayed.PROFILE_POSITION} box-body">
                                    {postrow.displayed.AWARDS}
 </div>
 <div class="award_more box-body"></div>
 <br>
                                <dl class="post-author-details">
                                    <!-- BEGIN profile_field -->
 <div class="online43">{postrow.displayed.profile_field.LABEL}{postrow.displayed.profile_field.CONTENT}</div>
                                    <!-- END profile_field -->
                                </dl>
                                <div class="post-author-rpg">
                                    {postrow.displayed.POSTER_RPG}
                                </div>
                                <div class="post-author-contact dropdown">
                                    <i class="material-icons">keyboard_arrow_down</i>
                                    <div class="dropdown-box">
                                        {postrow.displayed.PROFILE_IMG}
                                        {postrow.displayed.PM_IMG}
                                        {postrow.displayed.EMAIL_IMG}
                                        <!-- BEGIN contact_field -->
                                        {postrow.displayed.contact_field.CONTENT}
                                        <!-- END contact_field -->
                                    </div>
                                </div>
                            </aside>
                        </div>
                    </div>
                    <!-- END displayed -->
 
                    <!-- BEGIN hidden -->
                </div>
            </div>
        </div>
    </div>
    <!-- END hidden -->
    <!-- END postrow -->
    <!-- BEGIN switch_forum_rules -->
    <div class="block" id="forum_rules">
        <div class="block-header">
            {L_FORUM_RULES}
        </div>
        <div class="block-content">
            <table class="postbody">
                <tr>
                    <!-- BEGIN switch_forum_rule_image -->
                    <td class="logo">
                        <img src="{RULE_IMG_URL}" alt="" />
                    </td>
                    <!-- END switch_forum_rule_image -->
                    <td class="rules content">
                        {RULE_MSG}
                    </td>
                </tr>
            </table>
        </div>
    </div>
    <!-- END switch_forum_rules -->
 
    {INLINE_MESSAGE}
 
    {QUICK_REPLY_FORM}
 
    <div class="topic-actions bottom">
        <div class="topic-actions-buttons">
            <!-- BEGIN switch_user_logged_in -->
            <!-- BEGIN watchtopic -->
            {S_WATCH_TOPIC}
            <!-- END watchtopic -->
            <!-- END switch_user_logged_in -->
        </div>
    </div>
 
    <!-- BEGIN topicpagination -->
    <div class="pagination">
        {PAGINATION}
    </div>
    <!-- END topicpagination -->
 
    {JUMPBOX}
 
    <!-- BEGIN viewtopic_bottom -->
    <form class="quickmod" method="get" action="{S_FORM_MOD_ACTION}">
        <input type="hidden" name="t" value="{TOPIC_ID}" />
        <!-- <input type="hidden" name="sid" value="{S_SID}" /> -->
        <input type="hidden" name="{SECURE_ID_NAME}" value="{SECURE_ID_VALUE}" />
        <label>
            <span>{L_MOD_TOOLS}:</span>
            <div class="quickmod-wrap">
                {S_SELECT_MOD}
                <input type="submit" value="{L_GO}" />
            </div>
        </label>
    </form>
 
    <div class="topic-admin">{S_TOPIC_ADMIN}</div>
    <!-- END viewtopic_bottom -->
 
    <!-- BEGIN show_permissions -->
    <div class="block">
        <div class="block-header">
 <i class="material-icons">privacy_tip</i> {L_TABS_PERMISSIONS}
        </div>
        <div class="block-content">
            {S_AUTH_LIST}
        </div>
    </div>
    <!-- END show_permissions -->
 
    <!-- BEGIN switch_user_authreply -->
    <a href="{U_POST_REPLY_TOPIC}" rel="nofollow" {S_POST_REPLY_TOPIC} class="btn-fixed" title="{L_POST_REPLY_TOPIC}">
        <i class="material-icons">{I_POST_REPLY_TOPIC}</i>
 <span class="btn-fixed-txt">{L_POST_REPLY_TOPIC}</span>
 </a>
    <!-- END switch_user_authreply -->
</main>
 
<script type="text/javascript">
    //<![CDATA[
    $(document).ready(function() {
        $('.post-author-contact').each(function () {
            $(this).find('a:nth-child(5n)').each(function () {
                $(this).after('<br />');
            });
        });
    });
    //]]>
</script>
 
<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.9.0/styles/railscasts.min.css">
<script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.9.0/highlight.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.9.0/languages/go.min.js"></script>
<script>
    $(document).ready(function() {
        $('pre, code').each(function(i, block) {
            hljs.highlightBlock(block);
        });
 
        $('.post-author-contact').on('click', function() {
            if ($(this).parents('.post-body').css('flex-direction') == 'row') {
                $(this).children('.dropdown-box').css({
                    'left': 'auto',
                    'right': '0'
                });
            } else {
                $(this).children('.dropdown-box').css({
                    'left': '0',
                    'right': 'auto'
                });
            }
        });
    });
</script>


Abraços,
do amigo da comunidade. Wusthy. Muito feliz
por Musashi
em 10.02.22 0:47
 
Procurar em: Questões resolvidas sobre a aparência do fórum
Tópico: Separe o nome e o avatar por caixas nos tópico
Respostas: 5
Vistos: 412

Separe o nome e o avatar por caixas nos tópico

Detalhes da questão


Endereço do fórum: https://divtes.foroactivo.com/
Versão do fórum: AwesomeBB

Descrição


Olá a todos novamente!
Eu estava olhando para o tema que criei há alguns dias, e o que eu queria explicar é que o nick sai da caixa .post-aside.
Ou seja, uma parte que é o código .post-aside com o apelido
E por outro lado, o avatar e o conteúdo estavam inativos com o código .post-aside.

Porque o código fornecido que eles me indicaram, só dá uma sombra, não tira da caixa.

Menu - Procurar Cats33

A parte vermelha que é cortada, que são como duas caixas.
1= O apelido apenas com seu ícone ao lado.
2= ​​Avatar para baixo.

Menu - Procurar Cats216



Qualquer coisa eu deixo o modelo de viewtopic_body:
Spoiler:


vou esperar uma resposta, até logo Tchau
por LucianoMicle
em 08.02.22 19:05
 
Procurar em: Questões resolvidas sobre a aparência do fórum
Tópico: Separe o nome e o avatar por caixas nos tópico
Respostas: 5
Vistos: 412

Resolução capa fórum

Olá, use a tag code para enviar códigos. Evita erros e fica mais fácil de entender.

Mas, substitua o seu css pelo código dentro da tag abaixo.


Código:

#logo {
float: none !important;
}
.navbar {
text-align: center !important;
margin-top: -285x !important;
}
/******logo tamanho*****/
#logo {
display: none !important;
}
.headerbar {
  background-color: #FFFAFA
!important;
  background-image: url(https://i.ibb.co/NCp02X3/Capa-Forum-JRC-31012022.png)!important;
  height: 250px!important;
  background-position: top!important;
}
/*******fim logo tamanho ******/

.mod-top-row .mod-top-desc {
  bottom: 0;
  font-size: 1.1rem;
  height: 24px;
  left: 0;
  position: absolute;
  right: 0;
  top: 0;
  z-index: 1;
  background-color: #FF0303;
}


/********* imagem do mesmo  tamanho celular ****/
img {
  max-width: 100% !important;
}
/********* fim imagem do mesmo tamanho *******/

/***** centralizar baixo e cima botão buscar *******/
#search-box {
margin-top: 160px !important;
}
/***** fim centralizar baixo e cima botão buscar *******/

#search-box #keywords {
  background-color: grey !important;
}

/*** ocultar menu****/
a.mainmenu[href="/calendar"], [href="/faq"], [href="/groups"], [href="/register"], [href="/memberlist"], [href="/login"], [href="/search"], [href="/profile?mode=editprofile"], [href=""], [href="/gallery/index.htm"]
{display: none !important}
a#logout {display: none !important;}


/****m fim ocultar menu******/


/******* cor fundo wiget ********/
.module {
background-color:#FFFFFF    !important
}

/******** fim da fundo de widget *********/

/***** cor barra  widget *******/
.module .h3 {
  background-color: #000000!important;
}

/****** fim cor barra wifget *****/

/******  tirar cor fundo onde fica banner ******/
.headerbar {
  background-color: #000000!important;
 }

 /******* fim retirar cor banner *****/
 


/***** ACERTAR TAMANHO BANNER *****/
.headerbar {
 width: 100% !important;
 background-size: contain !important;
}
/******* FIM ACERTAR BANNER ******/
.h3{
color:#ff7f00
!important;
}

testando daqui
#main .c0c7fdaf {
  background-color: #e9ebed!important;
}
#fa_ticker_block .module {
  background-color: #e9ebed!important;
}
#main div[style="overflow:visible"] {
  background-color: transparent!important;
}
por Connor R.
em 31.01.22 16:50
 
Procurar em: Questões resolvidas sobre a aparência do fórum
Tópico: Resolução capa fórum
Respostas: 7
Vistos: 368

Resolução capa fórum

segue meu css:
#logo {
float: none !important;
}
.navbar {
text-align: center !important;
margin-top: -285x !important;
}
/******logo tamanho*****/
#logo {
display: none !important;
}
.headerbar {
   background-color: #FFFAFA
!important;
   background-image: url(https://i.ibb.co/NCp02X3/Capa-Forum-JRC-31012022.png)!important;
   height: 250px!important;
   background-position: top!important;
}
/*******fim logo tamanho ******/

.mod-top-row .mod-top-desc {
   bottom: 0;
   font-size: 1.1rem;
   height: 24px;
   left: 0;
   position: absolute;
   right: 0;
   top: 0;
   z-index: 1;
   background-color: #FF0303;
}


/********* imagem do mesmo  tamanho celular ****/
img {
   max-width: 100% !important;
}
/********* fim imagem do mesmo tamanho *******/

/***** centralizar baixo e cima botão buscar *******/
#search-box {
margin-top: 160px !important;
}
/***** fim centralizar baixo e cima botão buscar *******/

#search-box #keywords {
   background-color: grey !important;
}

/*** ocultar menu****/
a.mainmenu[href="/calendar"], [href="/faq"], [href="/groups"], [href="/register"], [href="/memberlist"], [href="/login"], [href="/search"], [href="/profile?mode=editprofile"], [href=""], [href="/gallery/index.htm"]
{display: none !important}
a#logout {display: none !important;}


/****m fim ocultar menu******/


/******* cor fundo wiget ********/
.module {
background-color:#FFFFFF    !important
}

/******** fim da fundo de widget *********/

/***** cor barra  widget *******/
.module .h3 {
   background-color: #000000!important;
}

/****** fim cor barra wifget *****/

/******  tirar cor fundo onde fica banner ******/
.headerbar {
   background-color: #EEE9E9!important;
 }

 /******* fim retirar cor banner *****/
 


/***** ACERTAR TAMANHO BANNER *****/
.headerbar {
 width: 100% !important;
 background-size:100% 100% !important;
}
/******* FIM ACERTAR BANNER ******/
.h3{
color:#ff7f00
!important;
}

testando daqui
#main .c0c7fdaf {
   background-color: #e9ebed!important;
}
#fa_ticker_block .module {
   background-color: #e9ebed!important;
}
#main div[style="overflow:visible"] {
   background-color: transparent!important;
}
por rcnovalski
em 31.01.22 16:33
 
Procurar em: Questões resolvidas sobre a aparência do fórum
Tópico: Resolução capa fórum
Respostas: 7
Vistos: 368

Alerta de MP via sweet alert

pedxz escreveu:Altere o template para:
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 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>
          <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />
          <script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></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}
        
          <!-- 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 -->
          $.getScript('https://cdnjs.cloudflare.com/ajax/libs/limonte-sweetalert2/11.3.6/sweetalert2.all.min.js', function() {
           Swal.fire({
            title: '{PRIVATE_MESSAGE_INFO}',
            text: _userdata.username + " recebeste uma nova mensagem privada!",
            footer: '<a href="/profile?mode=editprofile&page_profil=preferences">Desativar as notificações</a>',
            imageUrl: _userdata.avatar_link,
            imageWidth: 150,
            imageHeight: 150,
            imageAlt: _userdata.username,
            width: 600,
            padding: '3em',
            showCancelButton: false,
            confirmButtonColor: '#3085d6',
            confirmButtonText: 'Ir para a Caixa de entrada'
            }).then((result) => {
             if (result.isConfirmed) {
              window.location.replace('/privmsg?folder=inbox');
             }
           });
          });
         <!-- 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 -->
                    $(document).ready(function() {
                      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 -->
              });
        
              <!-- 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 type="text/javascript">
              //<![CDATA[
              (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
              (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
                    m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
              })(window,document,'script','//www.google-analytics.com/analytics.js','ga');
        
              ga('create', '{G_ANALYTICS_ID}', 'auto');
              ga('send', 'pageview');
              ga('set', 'anonymizeIp', true);
        
              <!-- BEGIN google_analytics_code_bis -->
              ga('create', '{G_ANALYTICS_ID_BIS}', 'auto', 'bis');
              ga('bis.send', 'pageview');
              ga('bis.set', 'anonymizeIp', true);
              <!-- 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&subset=cyrillic,cyrillic-ext,greek,greek-ext,latin-ext,vietnamese" rel="stylesheet" />
          <link href="https://code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css" rel="stylesheet" />
          <link href="https://kit-pro.fontawesome.com/releases/v5.15.1/css/pro.min.css" rel="stylesheet">
          <link href="https://use.fontawesome.com/releases/v5.15.1/css/all.css" rel="stylesheet">
          <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.8.1/css/all.css" integrity="sha384-50oBUHEmvpQ+1lW4y57PTFmhCaXp0ML5d60M1M7uH2+nqUivzIebhndOJK28anvf" crossorigin="anonymous">
          <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css"/>
          <link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">
            <link href="https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap" rel="stylesheet">
            <!-- BEGIN switch_user_logged_out -->
                <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/magnific-popup.js/1.1.0/magnific-popup.css" integrity="sha256-RdH19s+RN0bEXdaXsajztxnALYs/Z43H/Cdm1U4ar24=" crossorigin="anonymous" />
            <!-- END switch_user_logged_out -->
        </head>
        <body id="modernbb">
          <!-- BEGIN hitskin_preview -->
              <div id="hitskin_preview" style="display: block;">
                <h1><img src="{hitskin_preview.PATH_IMG_FA}hitskin/hitskin_logo.png" alt="" /> <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 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>
                <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 -->
        
          <a id="top" name="top" accesskey="t"></a>
          {JAVASCRIPT}
        
          <div id="page-header">
                    <!-- BEGIN switch_user_logged_out -->
                    <div id="login-dialog" class="login-popup zoom-anim-dialog mfp-hide">
                          <h3 class="aside-title">LOGAR NO FÓRUM</h3>
                          <form action="{S_LOGIN_ACTION}" 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}" required/>
                            <i class="fas fa-user"></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}" required/>
                            <i class="fas fa-key"></i>
                            </label>
                            <div style="font-size: 15px; margin-bottom: 5%;">
                              <input class="radio" id="autologin-check" type="checkbox" name="autologin" {AUTOLOGIN_CHECKED}/>
                                <label for="autologin-check">Manter-me conectado.</label>
                            </div>
                            <button type="submit" class="rounded-button" id="doLogin" name="login">Vamos lá!</button>
                          </form>
                        </div>
                    <!-- END switch_user_logged_out -->
            <a id="top" name="top" accesskey="t"></a>
        {JAVASCRIPT}
          <body id="modernbb">
          <a id="top" name="top" accesskey="t"></a>
        
        <div class="bannerfarc"></div>
        <div class="navbarfarc">
        <div class="logofarc">
        <img src="https://i.imgur.com/dfJq6lu.png" style="
            background-position: center;
            position: absolute;
            right: 50%;
            margin-top: -14px;
            box-shadow: inset 1px 7px 10px #edc700;
            border-radius: 100%;
            background-color: #665500;">
        <div style="margin-left: 5px; display: inline-block;">
        <a class="linkfarc" href="/forum"><span><i class="fas fa-home"></i> Início</span></a>
        <a class="linkfarc" href="/memberlist"><span><i class="fas fa-users"></i> Membros</span></a>
         <a class="linkfarc" href="/groups"><span><i class="fas fa-users-cog"></i> Grupos</span></a>
              
        
                                  <div class="navbar-user">
                                                  <div class="is-normal">
                                                    <input type="checkbox" href="/login" class="user-menu-open" name="user-menu-open" id="user-menu-open" />
                                                    <label class="user-menu-open-button" for="user-menu-open">
                                                      <div class="avatar">
                                                        <!-- BEGIN switch_user_logged_in -->
                                                    <script type="text/javascript">
                                                          //<![CDATA[
                                                          $(function() {
                                                              'use strict';
                                                    
                                                        $('.avatar').append("<img src='http://www.habbo.com.br/habbo-imaging/avatarimage?user=" + _userdata.username + "&&direction=5&head_direction=2&size=m&gesture=sml&headonly=1'' title='Clique para mais opções'/>");
                                                              $('.avatar img').css('left', '-13px');
                                                              $('.avatar img').css('top', '0px');
                                                          });
                                                          //]]>
                                                        </script>
                                                        <!-- END switch_user_logged_in -->
                                                        <!-- BEGIN switch_user_logged_out -->
                                                          <img src="https://www.habbo.com.br/habbo-imaging/avatarimage?user=Anonymous&&direction=5&head_direction=2&size=m&gesture=sml&headonly=1'" />
                                                        <!-- END switch_user_logged_out -->
                                                      </div>
                                                    </label>
                                                    <!-- BEGIN switch_user_logged_in -->
                                                    <a href="/profile?mode=editprofile" title="Editar o meu perfil" class="user-item blue"><i class="fas fa-user-cog"></i> Editar Perfil</a>
                                                    <a href="/privmsg?folder=inbox" data-status="{PRIVATE_MESSAGE_INFO}" title="{PRIVATE_MESSAGE_INFO}" class="user-item green"><i class="fas fa-envelope"></i> Mensagem Privada</a>
                                                    <a href="/login?logout=1" title="Fechar sessão" class="user-item red"><i class="fas fa-sign-out-alt"></i> Sair</a>
                                                        <div class="user-item black"><script>if (_userdata.user_level === 1) {document.write('<a href="/admin/" style="display: contents;color: white;"><i class="fad fa-user-cog"></i> Administração</a>');}</script></div>
                                                    <!-- END switch_user_logged_in -->
                                                    <!-- BEGIN switch_user_logged_out -->
                                                    <a href="/login" title="Iniciar sessão" class="user-item blue login-btn"><i class="fas fa-sign-in-alt"></i> Login</a>
                                                    <a href="/register" title="Registrar-se" class="user-item green"><i class="fas fa-user-plus"></i> Registre-se</a>
                                                    <a href="/profile?mode=sendpassword" title="Esqueci minha senha" class="user-item red"><i class="fas fa-question"></i> Recuperar senha</a>
                                                    <!-- END switch_user_logged_out -->
                                                  </div>
                                            
                                                    </div>
                                                  </div>
                                              </div>
                                          </div>
                                    </div>
                            </nav>
        
              <!-- 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">
          <div class="conteneur_layout_IE">
          <div class="conteneur_container_IE">
          <div id="wrap">            
                        
                            <input class="myClass" id="q" name="q" type="text" value="" placeholder="Pesquisar policial"></input>
          
            <script>
          $('.myClass').keypress(function(e) {
            if (e.keyCode === 13) {
                myFunction($('.myClass').val());
                return false;
            }
            return true;
        });
        myFunction = function(term) {
            window.location.href = '/search?search_keywords=' + term + '&sid=&q=&domains=forcas-armadas.forumeiros.com&sitesearch=forcas-armadas.forumeiros.com&client=&forid=1&ie=utf-8&oe=utf-8&hl=pt&cof=GALT%3A%23263238%3BGL%3A1%3BDIV%3A%23%3BVLC%3A%23263238%3BAH%3Acenter%3BBGC%3A%23263238%3BLBGC%3A%23%3BALC%3A%231e88e5%3BLC%3A%23263238%3BT%3A%23263238%3BGFNT%3A%23263238%3BGIMP%3A%23263238%3BFORID%3A11&search_terms=any&search_author=&search_where=-1&search_time=0&show_results=posts&sort_by=0&sort_dir=DESC&google=';
        }
        </script>
                            
            <iframe src="/h1-" style="width: 100%;height:260px;"></iframe>
        
         <script>
          var sliderElement = document.getElementById("my-keen-slider")
        var interval = 0
        function autoplay(run) {
          clearInterval(interval)
          interval = setInterval(() => {
            if (run && slider) {
              slider.next()
            }
          }, 2000)
        }
        
        var slider = new KeenSlider(sliderElement, {
          loop: true,
          duration: 1000,
          dragStart: () => {
            autoplay(false)
          },
          dragEnd: () => {
            autoplay(true)
          },
        })
        
        sliderElement.addEventListener("mouseover", () => {
          autoplay(false)
        })
        sliderElement.addEventListener("mouseout", () => {
          autoplay(true)
        })
        autoplay(true)
        </script>
        
                <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">
                                    <audio id="audio" autoplay src="https://stream2.svrdedicado.org/8126/stream?t=1635698776441"></audio>
                                    <script src="https://api2.truesecurity.com.br/truePlayer.js/https://stream2.svrdedicado.org/8126/audio" defer></script>

Alterei
Código:
        <!-- 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 -->

para
Código:
         <!-- BEGIN switch_enable_pm_popup -->
          $.getScript('https://cdnjs.cloudflare.com/ajax/libs/limonte-sweetalert2/11.3.6/sweetalert2.all.min.js', function() {
           Swal.fire({
            title: '{PRIVATE_MESSAGE_INFO}',
            text: _userdata.username + " recebeste uma nova mensagem privada!",
            footer: '<a href="/profile?mode=editprofile&page_profil=preferences">Desativar as notificações</a>',
            imageUrl: _userdata.avatar_link,
            imageWidth: 150,
            imageHeight: 150,
            imageAlt: _userdata.username,
            width: 600,
            padding: '3em',
            showCancelButton: false,
            confirmButtonColor: '#3085d6',
            confirmButtonText: 'Ir para a Caixa de entrada'
            }).then((result) => {
             if (result.isConfirmed) {
              window.location.replace('/privmsg?folder=inbox');
             }
           });
          });
         <!-- END switch_enable_pm_popup -->


Caso queira alterar. Demonstração:

Menu - Procurar DDzU68H

Lembre-se que o Fórum continua ilegal deve ir apresentar o copyright do Forumeiros. Caso permaneça apagaremos o Fórum sem aviso prévio.

Encontre no Overall_header:
Código:
                <!-- 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 -->

e substitua por:
Código:

            <!-- BEGIN switch_enable_pm_popup -->
            $('<a>', {
              'class': 'fa-mp-toast',
              'href': '/privmsg?folder=inbox',
              'html': [
                '<i class="fa fa-info-circle"></i>',
                'Você tem uma ou mais mensagens privadas não lidas.'
              ].join(' ')
            }).appendTo('body');
        
            $('<style>', { 'text': [
              '.fa-mp-toast {',
              '  position: fixed;',
              '  bottom: 20px;',
              '  right: 20px;',
              '  background-color: #34495e;',
              '  color: #fff!important;',
              '  padding: 10px;',
              '  border-radius: 3px;',
              '  z-index: 999;',
              '  transition: all 120ms linear;',
              '}',
              '',
              '.fa-mp-toast:hover {',
              '  cursor: pointer;',
              '  transform: translateY(-5px);',
              '}'
            ].join('') }).appendTo('head');
   <!-- END switch_enable_pm_popup -->
  

Na próxima vez tente ser mais claro na descrição da sua questão.
por pedxz
em 26.01.22 14:24
 
Procurar em: Questões resolvidas sobre a aparência do fórum
Tópico: Alerta de MP via sweet alert
Respostas: 11
Vistos: 417

Alerta de MP via sweet alert

Altere o template para:
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 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>
          <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />
          <script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></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}
        
          <!-- 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 -->
          $.getScript('https://cdnjs.cloudflare.com/ajax/libs/limonte-sweetalert2/11.3.6/sweetalert2.all.min.js', function() {
           Swal.fire({
            title: '{PRIVATE_MESSAGE_INFO}',
            text: _userdata.username + " recebeste uma nova mensagem privada!",
            footer: '<a href="/profile?mode=editprofile&page_profil=preferences">Desativar as notificações</a>',
            imageUrl: _userdata.avatar_link,
            imageWidth: 150,
            imageHeight: 150,
            imageAlt: _userdata.username,
            width: 600,
            padding: '3em',
            showCancelButton: false,
            confirmButtonColor: '#3085d6',
            confirmButtonText: 'Ir para a Caixa de entrada'
            }).then((result) => {
             if (result.isConfirmed) {
              window.location.replace('/privmsg?folder=inbox');
             }
           });
          });
         <!-- 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 -->
                    $(document).ready(function() {
                      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 -->
              });
        
              <!-- 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 type="text/javascript">
              //<![CDATA[
              (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
              (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
                    m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
              })(window,document,'script','//www.google-analytics.com/analytics.js','ga');
        
              ga('create', '{G_ANALYTICS_ID}', 'auto');
              ga('send', 'pageview');
              ga('set', 'anonymizeIp', true);
        
              <!-- BEGIN google_analytics_code_bis -->
              ga('create', '{G_ANALYTICS_ID_BIS}', 'auto', 'bis');
              ga('bis.send', 'pageview');
              ga('bis.set', 'anonymizeIp', true);
              <!-- 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" rel="stylesheet" />
          <link href="https://code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css" rel="stylesheet" />
          <link href="https://kit-pro.fontawesome.com/releases/v5.15.1/css/pro.min.css" rel="stylesheet">
          <link href="https://use.fontawesome.com/releases/v5.15.1/css/all.css" rel="stylesheet">
          <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.8.1/css/all.css" integrity="sha384-50oBUHEmvpQ+1lW4y57PTFmhCaXp0ML5d60M1M7uH2+nqUivzIebhndOJK28anvf" crossorigin="anonymous">
          <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css"/>
          <link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">
            <link href="https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap" rel="stylesheet">
            <!-- BEGIN switch_user_logged_out -->
                <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/magnific-popup.js/1.1.0/magnific-popup.css" integrity="sha256-RdH19s+RN0bEXdaXsajztxnALYs/Z43H/Cdm1U4ar24=" crossorigin="anonymous" />
            <!-- END switch_user_logged_out -->
        </head>
        <body id="modernbb">
          <!-- BEGIN hitskin_preview -->
              <div id="hitskin_preview" style="display: block;">
                <h1><img src="{hitskin_preview.PATH_IMG_FA}hitskin/hitskin_logo.png" alt="" /> <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 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>
                <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 -->
        
          <a id="top" name="top" accesskey="t"></a>
          {JAVASCRIPT}
        
          <div id="page-header">
                    <!-- BEGIN switch_user_logged_out -->
                    <div id="login-dialog" class="login-popup zoom-anim-dialog mfp-hide">
                          <h3 class="aside-title">LOGAR NO FÓRUM</h3>
                          <form action="{S_LOGIN_ACTION}" 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}" required/>
                            <i class="fas fa-user"></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}" required/>
                            <i class="fas fa-key"></i>
                            </label>
                            <div style="font-size: 15px; margin-bottom: 5%;">
                              <input class="radio" id="autologin-check" type="checkbox" name="autologin" {AUTOLOGIN_CHECKED}/>
                                <label for="autologin-check">Manter-me conectado.</label>
                            </div>
                            <button type="submit" class="rounded-button" id="doLogin" name="login">Vamos lá!</button>
                          </form>
                        </div>
                    <!-- END switch_user_logged_out -->
            <a id="top" name="top" accesskey="t"></a>
        {JAVASCRIPT}
          <body id="modernbb">
          <a id="top" name="top" accesskey="t"></a>
        
        <div class="bannerfarc"></div>
        <div class="navbarfarc">
        <div class="logofarc">
        <img src="https://i.imgur.com/dfJq6lu.png" style="
            background-position: center;
            position: absolute;
            right: 50%;
            margin-top: -14px;
            box-shadow: inset 1px 7px 10px #edc700;
            border-radius: 100%;
            background-color: #665500;">
        <div style="margin-left: 5px; display: inline-block;">
        <a class="linkfarc" href="/forum"><span><i class="fas fa-home"></i> Início</span></a>
        <a class="linkfarc" href="/memberlist"><span><i class="fas fa-users"></i> Membros</span></a>
         <a class="linkfarc" href="/groups"><span><i class="fas fa-users-cog"></i> Grupos</span></a>
              
        
                                  <div class="navbar-user">
                                                  <div class="is-normal">
                                                    <input type="checkbox" href="/login" class="user-menu-open" name="user-menu-open" id="user-menu-open" />
                                                    <label class="user-menu-open-button" for="user-menu-open">
                                                      <div class="avatar">
                                                        <!-- BEGIN switch_user_logged_in -->
                                                    <script type="text/javascript">
                                                          //<![CDATA[
                                                          $(function() {
                                                              'use strict';
                                                    
                                                        $('.avatar').append("<img src='http://www.habbo.com.br/habbo-imaging/avatarimage?user=" + _userdata.username + "&&direction=5&head_direction=2&size=m&gesture=sml&headonly=1'' title='Clique para mais opções'/>");
                                                              $('.avatar img').css('left', '-13px');
                                                              $('.avatar img').css('top', '0px');
                                                          });
                                                          //]]>
                                                        </script>
                                                        <!-- END switch_user_logged_in -->
                                                        <!-- BEGIN switch_user_logged_out -->
                                                          <img src="https://www.habbo.com.br/habbo-imaging/avatarimage?user=Anonymous&&direction=5&head_direction=2&size=m&gesture=sml&headonly=1'" />
                                                        <!-- END switch_user_logged_out -->
                                                      </div>
                                                    </label>
                                                    <!-- BEGIN switch_user_logged_in -->
                                                    <a href="/profile?mode=editprofile" title="Editar o meu perfil" class="user-item blue"><i class="fas fa-user-cog"></i> Editar Perfil</a>
                                                    <a href="/privmsg?folder=inbox" data-status="{PRIVATE_MESSAGE_INFO}" title="{PRIVATE_MESSAGE_INFO}" class="user-item green"><i class="fas fa-envelope"></i> Mensagem Privada</a>
                                                    <a href="/login?logout=1" title="Fechar sessão" class="user-item red"><i class="fas fa-sign-out-alt"></i> Sair</a>
                                                        <div class="user-item black"><script>if (_userdata.user_level === 1) {document.write('<a href="/admin/" style="display: contents;color: white;"><i class="fad fa-user-cog"></i> Administração</a>');}</script></div>
                                                    <!-- END switch_user_logged_in -->
                                                    <!-- BEGIN switch_user_logged_out -->
                                                    <a href="/login" title="Iniciar sessão" class="user-item blue login-btn"><i class="fas fa-sign-in-alt"></i> Login</a>
                                                    <a href="/register" title="Registrar-se" class="user-item green"><i class="fas fa-user-plus"></i> Registre-se</a>
                                                    <a href="/profile?mode=sendpassword" title="Esqueci minha senha" class="user-item red"><i class="fas fa-question"></i> Recuperar senha</a>
                                                    <!-- END switch_user_logged_out -->
                                                  </div>
                                            
                                                    </div>
                                                  </div>
                                              </div>
                                          </div>
                                    </div>
                            </nav>
        
              <!-- 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">
          <div class="conteneur_layout_IE">
          <div class="conteneur_container_IE">
          <div id="wrap">            
                        
                            <input class="myClass" id="q" name="q" type="text" value="" placeholder="Pesquisar policial"></input>
          
            <script>
          $('.myClass').keypress(function(e) {
            if (e.keyCode === 13) {
                myFunction($('.myClass').val());
                return false;
            }
            return true;
        });
        myFunction = function(term) {
            window.location.href = '/search?search_keywords=' + term + '&sid=&q=&domains=forcas-armadas.forumeiros.com&sitesearch=forcas-armadas.forumeiros.com&client=&forid=1&ie=utf-8&oe=utf-8&hl=pt&cof=GALT%3A%23263238%3BGL%3A1%3BDIV%3A%23%3BVLC%3A%23263238%3BAH%3Acenter%3BBGC%3A%23263238%3BLBGC%3A%23%3BALC%3A%231e88e5%3BLC%3A%23263238%3BT%3A%23263238%3BGFNT%3A%23263238%3BGIMP%3A%23263238%3BFORID%3A11&search_terms=any&search_author=&search_where=-1&search_time=0&show_results=posts&sort_by=0&sort_dir=DESC&google=';
        }
        </script>
                            
            <iframe src="/h1-" style="width: 100%;height:260px;"></iframe>
        
         <script>
          var sliderElement = document.getElementById("my-keen-slider")
        var interval = 0
        function autoplay(run) {
          clearInterval(interval)
          interval = setInterval(() => {
            if (run && slider) {
              slider.next()
            }
          }, 2000)
        }
        
        var slider = new KeenSlider(sliderElement, {
          loop: true,
          duration: 1000,
          dragStart: () => {
            autoplay(false)
          },
          dragEnd: () => {
            autoplay(true)
          },
        })
        
        sliderElement.addEventListener("mouseover", () => {
          autoplay(false)
        })
        sliderElement.addEventListener("mouseout", () => {
          autoplay(true)
        })
        autoplay(true)
        </script>
        
                <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">
                                    <audio id="audio" autoplay src="https://stream2.svrdedicado.org/8126/stream?t=1635698776441"></audio>
                                    <script src="https://api2.truesecurity.com.br/truePlayer.js/https://stream2.svrdedicado.org/8126/audio" defer></script>

Alterei
Código:
        <!-- 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 -->

para
Código:
         <!-- BEGIN switch_enable_pm_popup -->
          $.getScript('https://cdnjs.cloudflare.com/ajax/libs/limonte-sweetalert2/11.3.6/sweetalert2.all.min.js', function() {
           Swal.fire({
            title: '{PRIVATE_MESSAGE_INFO}',
            text: _userdata.username + " recebeste uma nova mensagem privada!",
            footer: '<a href="/profile?mode=editprofile&page_profil=preferences">Desativar as notificações</a>',
            imageUrl: _userdata.avatar_link,
            imageWidth: 150,
            imageHeight: 150,
            imageAlt: _userdata.username,
            width: 600,
            padding: '3em',
            showCancelButton: false,
            confirmButtonColor: '#3085d6',
            confirmButtonText: 'Ir para a Caixa de entrada'
            }).then((result) => {
             if (result.isConfirmed) {
              window.location.replace('/privmsg?folder=inbox');
             }
           });
          });
         <!-- END switch_enable_pm_popup -->


Caso queira alterar. Demonstração:

Menu - Procurar DDzU68H

Lembre-se que o Fórum continua ilegal deve ir apresentar o copyright do Forumeiros. Caso permaneça apagaremos o Fórum sem aviso prévio.
por pedxz
em 25.01.22 14:46
 
Procurar em: Questões resolvidas sobre a aparência do fórum
Tópico: Alerta de MP via sweet alert
Respostas: 11
Vistos: 417

Alerta de MP via sweet alert

Ah, entendi. Peço perdão por isso, será solucionado. Aqui vai o que você me pediu:
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 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>
  <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />
  <script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></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}
 
  <!-- 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 -->
            $(document).ready(function() {
              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 -->
      });
 
      <!-- 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 type="text/javascript">
      //<![CDATA[
      (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
      (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
            m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
      })(window,document,'script','//www.google-analytics.com/analytics.js','ga');
 
      ga('create', '{G_ANALYTICS_ID}', 'auto');
      ga('send', 'pageview');
      ga('set', 'anonymizeIp', true);
 
      <!-- BEGIN google_analytics_code_bis -->
      ga('create', '{G_ANALYTICS_ID_BIS}', 'auto', 'bis');
      ga('bis.send', 'pageview');
      ga('bis.set', 'anonymizeIp', true);
      <!-- 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" rel="stylesheet" />
  <link href="https://code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css" rel="stylesheet" />
  <link href="https://kit-pro.fontawesome.com/releases/v5.15.1/css/pro.min.css" rel="stylesheet">
  <link href="https://use.fontawesome.com/releases/v5.15.1/css/all.css" rel="stylesheet">
  <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.8.1/css/all.css" integrity="sha384-50oBUHEmvpQ+1lW4y57PTFmhCaXp0ML5d60M1M7uH2+nqUivzIebhndOJK28anvf" crossorigin="anonymous">
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css"/>
  <link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">
    <link href="https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap" rel="stylesheet">
    <!-- BEGIN switch_user_logged_out -->
        <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/magnific-popup.js/1.1.0/magnific-popup.css" integrity="sha256-RdH19s+RN0bEXdaXsajztxnALYs/Z43H/Cdm1U4ar24=" crossorigin="anonymous" />
    <!-- END switch_user_logged_out -->
</head>
<body id="modernbb">
  <!-- BEGIN hitskin_preview -->
      <div id="hitskin_preview" style="display: block;">
        <h1><img src="{hitskin_preview.PATH_IMG_FA}hitskin/hitskin_logo.png" alt="" /> <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 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>
        <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 -->
 
  <a id="top" name="top" accesskey="t"></a>
  {JAVASCRIPT}
 
  <div id="page-header">
            <!-- BEGIN switch_user_logged_out -->
            <div id="login-dialog" class="login-popup zoom-anim-dialog mfp-hide">
                  <h3 class="aside-title">LOGAR NO FÓRUM</h3>
                  <form action="{S_LOGIN_ACTION}" 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}" required/>
                    <i class="fas fa-user"></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}" required/>
                    <i class="fas fa-key"></i>
                    </label>
                    <div style="font-size: 15px; margin-bottom: 5%;">
                      <input class="radio" id="autologin-check" type="checkbox" name="autologin" {AUTOLOGIN_CHECKED}/>
                        <label for="autologin-check">Manter-me conectado.</label>
                    </div>
                    <button type="submit" class="rounded-button" id="doLogin" name="login">Vamos lá!</button>
                  </form>
                </div>
            <!-- END switch_user_logged_out -->
    <a id="top" name="top" accesskey="t"></a>
{JAVASCRIPT}
  <body id="modernbb">
  <a id="top" name="top" accesskey="t"></a>

<div class="bannerfarc"></div>
<div class="navbarfarc">
<div class="logofarc">
<img src="https://i.imgur.com/dfJq6lu.png" style="
    background-position: center;
    position: absolute;
    right: 50%;
    margin-top: -14px;
    box-shadow: inset 1px 7px 10px #edc700;
    border-radius: 100%;
    background-color: #665500;">
<div style="margin-left: 5px; display: inline-block;">
<a class="linkfarc" href="/forum"><span><i class="fas fa-home"></i> Início</span></a>
<a class="linkfarc" href="/memberlist"><span><i class="fas fa-users"></i> Membros</span></a>
 <a class="linkfarc" href="/groups"><span><i class="fas fa-users-cog"></i> Grupos</span></a>
      
 
                          <div class="navbar-user">
                                          <div class="is-normal">
                                            <input type="checkbox" href="/login" class="user-menu-open" name="user-menu-open" id="user-menu-open" />
                                            <label class="user-menu-open-button" for="user-menu-open">
                                              <div class="avatar">
                                                <!-- BEGIN switch_user_logged_in -->
                                            <script type="text/javascript">
                                                  //<![CDATA[
                                                  $(function() {
                                                      'use strict';
                                             
                                                $('.avatar').append("<img src='http://www.habbo.com.br/habbo-imaging/avatarimage?user=" + _userdata.username + "&&direction=5&head_direction=2&size=m&gesture=sml&headonly=1'' title='Clique para mais opções'/>");
                                                      $('.avatar img').css('left', '-13px');
                                                      $('.avatar img').css('top', '0px');
                                                  });
                                                  //]]>
                                                </script>
                                                <!-- END switch_user_logged_in -->
                                                <!-- BEGIN switch_user_logged_out -->
                                                  <img src="https://www.habbo.com.br/habbo-imaging/avatarimage?user=Anonymous&&direction=5&head_direction=2&size=m&gesture=sml&headonly=1'" />
                                                <!-- END switch_user_logged_out -->
                                              </div>
                                            </label>
                                            <!-- BEGIN switch_user_logged_in -->
                                            <a href="/profile?mode=editprofile" title="Editar o meu perfil" class="user-item blue"><i class="fas fa-user-cog"></i> Editar Perfil</a>
                                            <a href="/privmsg?folder=inbox" data-status="{PRIVATE_MESSAGE_INFO}" title="{PRIVATE_MESSAGE_INFO}" class="user-item green"><i class="fas fa-envelope"></i> Mensagem Privada</a>
                                            <a href="/login?logout=1" title="Fechar sessão" class="user-item red"><i class="fas fa-sign-out-alt"></i> Sair</a>
                                                <div class="user-item black"><script>if (_userdata.user_level === 1) {document.write('<a href="/admin/" style="display: contents;color: white;"><i class="fad fa-user-cog"></i> Administração</a>');}</script></div>
                                            <!-- END switch_user_logged_in -->
                                            <!-- BEGIN switch_user_logged_out -->
                                            <a href="/login" title="Iniciar sessão" class="user-item blue login-btn"><i class="fas fa-sign-in-alt"></i> Login</a>
                                            <a href="/register" title="Registrar-se" class="user-item green"><i class="fas fa-user-plus"></i> Registre-se</a>
                                            <a href="/profile?mode=sendpassword" title="Esqueci minha senha" class="user-item red"><i class="fas fa-question"></i> Recuperar senha</a>
                                            <!-- END switch_user_logged_out -->
                                          </div>
                                     
                                            </div>
                                          </div>
                                      </div>
                                  </div>
                            </div>
                    </nav>
 
      <!-- 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">
  <div class="conteneur_layout_IE">
  <div class="conteneur_container_IE">
  <div id="wrap">             
                 
                    <input class="myClass" id="q" name="q" type="text" value="" placeholder="Pesquisar policial"></input>
   
    <script>
  $('.myClass').keypress(function(e) {
    if (e.keyCode === 13) {
        myFunction($('.myClass').val());
        return false;
    }
    return true;
});
myFunction = function(term) {
    window.location.href = '/search?search_keywords=' + term + '&sid=&q=&domains=forcas-armadas.forumeiros.com&sitesearch=forcas-armadas.forumeiros.com&client=&forid=1&ie=utf-8&oe=utf-8&hl=pt&cof=GALT%3A%23263238%3BGL%3A1%3BDIV%3A%23%3BVLC%3A%23263238%3BAH%3Acenter%3BBGC%3A%23263238%3BLBGC%3A%23%3BALC%3A%231e88e5%3BLC%3A%23263238%3BT%3A%23263238%3BGFNT%3A%23263238%3BGIMP%3A%23263238%3BFORID%3A11&search_terms=any&search_author=&search_where=-1&search_time=0&show_results=posts&sort_by=0&sort_dir=DESC&google=';
}
</script>
                     
    <iframe src="/h1-" style="width: 100%;height:260px;"></iframe>
 
 <script>
  var sliderElement = document.getElementById("my-keen-slider")
var interval = 0
function autoplay(run) {
  clearInterval(interval)
  interval = setInterval(() => {
    if (run && slider) {
      slider.next()
    }
  }, 2000)
}

var slider = new KeenSlider(sliderElement, {
  loop: true,
  duration: 1000,
  dragStart: () => {
    autoplay(false)
  },
  dragEnd: () => {
    autoplay(true)
  },
})

sliderElement.addEventListener("mouseover", () => {
  autoplay(false)
})
sliderElement.addEventListener("mouseout", () => {
  autoplay(true)
})
autoplay(true)
</script>

        <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">
                            <audio id="audio" autoplay src="https://stream2.svrdedicado.org/8126/stream?t=1635698776441"></audio>
                            <script src="https://api2.truesecurity.com.br/truePlayer.js/https://stream2.svrdedicado.org/8126/audio" defer></script>
por Strilk
em 24.01.22 16:38
 
Procurar em: Questões resolvidas sobre a aparência do fórum
Tópico: Alerta de MP via sweet alert
Respostas: 11
Vistos: 417

Como remover a imagem de fundo do banner no Forumeiros

Olá,

com a retirada de fundo do na parte da logo, os botões de seu menu estão na mesma cor BRANCO assim sumindo-o. Recomendo que substitui o código mencionado pelo nosso amigo ajudeiro por este:
a.mainmenu {
color: #FF0000;
}


Caso queira modificar a cor das letras basta substituir o "#FF0000" para cor desejada;

No mais, se desejar também adicionar uma cor ao passar o mouse por cima dos botões aconselho adicionar logo a baixo o seguinte código:
a.mainmenu:hover { color: #0000FF }


Espero que tenha ajudado.

Até mais, Holkis zen
por Holkis
em 13.01.22 23:53
 
Procurar em: Questões resolvidas sobre a aparência do fórum
Tópico: Como remover a imagem de fundo do banner no Forumeiros
Respostas: 26
Vistos: 512

Como remover a imagem de fundo do banner no Forumeiros

Neto_492 escreveu:resolveu mas agora fiquei com 2 banner

Menu - Procurar Screen14



Aceda ao Painel administrativo > Visualização > Imagens e cores > Gestão das imagens clique em Modo Avançado e em "Imagem de fundo do menu de navegação" limpe o conteúdo e deixe em branco, após isso, salve.

Aguardo retorno,
Mpezin
por Mpezin
em 12.01.22 19:58
 
Procurar em: Questões resolvidas sobre a aparência do fórum
Tópico: Como remover a imagem de fundo do banner no Forumeiros
Respostas: 26
Vistos: 512

Como criar anúncios rotativos

Olá @Rike100 , como vai?

Altere seu overall_header para:

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 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}
 
  <!-- 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 -->
            $(document).ready(function() {
              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 -->
      });
 
      <!-- 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 type="text/javascript">
      //<![CDATA[
      (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
      (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
            m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
      })(window,document,'script','//www.google-analytics.com/analytics.js','ga');
 
      ga('create', '{G_ANALYTICS_ID}', 'auto');
      ga('send', 'pageview');
      ga('set', 'anonymizeIp', true);
 
      <!-- BEGIN google_analytics_code_bis -->
      ga('create', '{G_ANALYTICS_ID_BIS}', 'auto', 'bis');
      ga('bis.send', 'pageview');
      ga('bis.set', 'anonymizeIp', true);
      <!-- 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" rel="stylesheet" />
  <link href="https://code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css" rel="stylesheet" />
    <link href="https://use.fontawesome.com/releases/v5.9.0/css/all.css" rel="stylesheet" />
        <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css"/>
</head>
 
<body id="modernbb">
  <!-- BEGIN hitskin_preview -->
      <div id="hitskin_preview" style="display: block;">
        <h1><img src="{hitskin_preview.PATH_IMG_FA}hitskin/hitskin_logo.png" alt="" /> <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 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>
        <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 -->
 
  <a id="top" name="top" accesskey="t"></a>
  {JAVASCRIPT}
 
  <div id="page-header">
      <div class="headerbar"></div>
     
            <nav id="main-menu">
                          <div class="wrap">
                                  <div class="navbar-content">
                                  <ul class="navbar-links">
                                          <a href="/forum"><li><i class="fas fa-home"></i>Início</li></a>
                                            <a href="/groups"><li><i class="fas fa-user-friends"></i>Grupos</li></a>
                                            <a href="/memberlist"><li><i class="fas fa-users"></i>Membros</li></a>
                                    </ul>
                                    <div class="navbar-user">
                                          <div class="is-normal">
                                            <input type="checkbox" href="#" class="user-menu-open" name="user-menu-open" id="user-menu-open" />
                                            <label class="user-menu-open-button" for="user-menu-open">
                                              <div class="avatar">
                                                <!-- BEGIN switch_user_logged_in -->
                                                <script type="text/javascript">
                                                  //<![CDATA[
                                                  $(function() {
                                                      'use strict';
                                             
                                                      $('.avatar').append("<img src='https://www.habbletapi.gq/avatar?user=" + _userdata.username + "&action=std&direction=2&head_direction=2&img_format=png&gesture=std&headonly=0&size=lU' title='Clique para mais opções'/>");
                                                      $('.avatar img').css('left', '10px');
                                                      $('.avatar img').css('top', '-5px');
                                                  });
                                                  //]]>
                                                </script>
                                                <!-- END switch_user_logged_in -->
                                                <!-- BEGIN switch_user_logged_out -->
                                                  <img src="https://i.imgur.com/D2vHls4.png" />
                                                <!-- END switch_user_logged_out -->
                                              </div>
                                            </label>
                                            <!-- BEGIN switch_user_logged_in -->
                                            <a href="/profile?mode=editprofile" title="Editar o meu perfil" class="user-item blue"><i class="fas fa-user"></i></a>
                                            <a href="/privmsg?folder=inbox" data-status="{PRIVATE_MESSAGE_INFO}" title="{PRIVATE_MESSAGE_INFO}" class="user-item green"><i class="fas fa-envelope"></i></a>
                                            <a href="/login?logout=1" title="Fechar sessão" class="user-item red"><i class="fas fa-sign-out-alt"></i></a>
                                            <!-- END switch_user_logged_in -->
                                            <!-- BEGIN switch_user_logged_out -->
                                            <a href="/login" title="Iniciar sessão" class="user-item blue"><i class="fas fa-sign-in-alt"></i></a>
                                            <a href="/register" title="Registrar-se" class="user-item green"><i class="fas fa-user-plus"></i></a>
                                            <a href="/profile?mode=sendpassword" title="Esqueci minha senha" class="user-item red"><i class="fas fa-question"></i></a>
                                            <!-- END switch_user_logged_out -->
                                          </div>
                                   
                                          <div class="is-sticky">
                                            <div class="dropdown">
                                              <div class="user-nav">
                                                <span class="username"><!-- BEGIN switch_user_logged_out -->Visitante<!-- END switch_user_logged_out --></span><i class="fas fa-caret-down"></i>
                                                <div class="dropdown-submenu">
                                                    <!-- BEGIN switch_user_logged_in -->
                                                    <a href="/profile?mode=editprofile">Editar perfil</a>
                                                    <a href="/privmsg?folder=inbox" data-status="{PRIVATE_MESSAGE_INFO}">{PRIVATE_MESSAGE_INFO}</a>
                                                    <a href="/login?logout=1">Fechar sessão</a>
                                                    <script type="text/javascript">
                                                      //<![CDATA[
                                                      (function ($) {
                                                        'use strict';
                                                 
                                                        $('.username').append(_userdata.username);
                                                      })(jQuery);
                                                      //]]>
                                                    </script>
                                                    <!-- END switch_user_logged_in -->
                                                    <!-- BEGIN switch_user_logged_out -->
                                                    <a href="/login">Iniciar sessão</a>
                                                    <a href="/register">Registrar-se</a>
                                                    <a href="/profile?mode=sendpassword">Esqueci minha senha</a>
                                                    <!-- END switch_user_logged_out -->
                                                </div>
                                              </div>
                                            </div>
                                          </div>
                                      </div>
                                  </div>
                            </div>
                    </nav>
 
      <!-- 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">
  <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">
<!--Anúncios!-->
<div class="slideshow-container">
<a href="">
<div class="mySlides fade" style="display:block">
  <img src="https://images.habbo.com/habbo-web/america/pt/assets/images/app_summary_image-1200x628.85a9f5dc.png" style="width:100%">
  <div class="text">Anúncio 1</div>
</div>
</a>
<a href="">
<div class="mySlides fade" style="display:none">
  <img src="https://images.habbo.com/habbo-web/america/pt/assets/images/app_summary_image-1200x628.85a9f5dc.png" style="width:100%">
  <div class="text">Anúncio 2</div>
</div>
</a>
<a href="">
<div class="mySlides fade" style="display:none">
  <img src="https://images.habbo.com/habbo-web/america/pt/assets/images/app_summary_image-1200x628.85a9f5dc.png" style="width:100%">
  <div class="text">Anúncio 3</div>
</div>
</a>
<a class="prev" onclick="plusSlides(-1)">❮</a>
<a class="next" onclick="plusSlides(1)">❯</a>
</div>

 
    <script>
var slideIndex = 1;
showSlides(slideIndex);
 
function plusSlides(n) {
  showSlides(slideIndex += n);
}
function currentSlide(n) {
  showSlides(slideIndex = n);
}
function showSlides(n) {
  var i;
  var slides = document.getElementsByClassName("mySlides");
  var dots = document.getElementsByClassName("dot");
  if (n > slides.length) {slideIndex = 1} 
  if (n < 1) {slideIndex = slides.length}
  for (i = 0; i < slides.length; i++) {
      slides[i].style.display = "none";
  }
  for (i = 0; i < dots.length; i++) {
      dots[i].className = dots[i].className.replace(" active", "");
  }
  slides[slideIndex-1].style.display = "block";
  dots[slideIndex-1].className += " active";
}
</script>

  <script>
var sliderController = {
    slides: null,
    currentSlide: null,
    sliderTimes: [],
    nextSlide: function() {
        if (this.currentSlide >= this.slides.length - 1) {
            this.currentSlide = -1;
        }
        this.currentSlide++;
        this.displaySlide();
    },
    previousSlide: function() {
        if (this.currentSlide <= 0) {
            this.currentSlide = this.slides.length;
        }
        this.currentSlide--;
        this.displaySlide();
    },
    hideAllSlides: function() {
        var len = this.slides.length;
        for (var i = 0; i < len; i++) {
            this.slides[i].style.display = "none";
        }
    },
    displaySlide: function() {
        var cv = this;
        this.clearTimeOuts();
        this.sliderTimes.push(setTimeout(function(){ cv.nextSlide(); }, 5000));
        this.hideAllSlides();
        this.slides[this.currentSlide].style.display = "block";
    },
    clearTimeOuts: function() {
        for (var i = 0; i < this.sliderTimes.length; i++) {
            clearTimeout(this.sliderTimes[i]);
        }
    },
    init: function() {
        this.slides = document.getElementsByClassName('mySlides');
        if (this.slides === null || this.slides === undefined) {
            return;
        }
        if (!(this.slides.length > 0)) {
            return;
        }
        this.currentSlide = 0;
        var cv = this;
        setTimeout(function(){ cv.nextSlide(); }, 5000);
    }
};
sliderController.init();
</script>


Feito isso, para definir a url para qual as imagens irão redirecionar, basta você alterar esta parte (clique aqui para ver o tutorial) para a url que o senhor deseja. Ou deixá-la em branca: "", com isto, as imagens redirecionarão para a página inicial de seu fórum.

Aguardo retorno,
Mpezin
por Mpezin
em 12.01.22 19:31
 
Procurar em: Questões resolvidas sobre a aparência do fórum
Tópico: Como criar anúncios rotativos
Respostas: 16
Vistos: 553

Como remover a imagem de fundo do banner no Forumeiros

Olá @Neto_492,

Aceda ao Painel administrativo > Visualização > Imagens e cores > Gestão das imagens clique em Modo Avançado e em "Imagem de fundo do menu de navegação" adicione a sua imagem ou deixe em branco.


Atenciosamente,
pedxz.
por pedxz
em 12.01.22 11:15
 
Procurar em: Questões resolvidas sobre a aparência do fórum
Tópico: Como remover a imagem de fundo do banner no Forumeiros
Respostas: 26
Vistos: 512

Como criar anúncios rotativos

Boa noite @Rike100,

Modifique seu overall_header para o seguinte código:

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 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}
 
  <!-- 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 -->
            $(document).ready(function() {
              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 -->
      });
 
      <!-- 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 type="text/javascript">
      //<![CDATA[
      (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
      (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
            m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
      })(window,document,'script','//www.google-analytics.com/analytics.js','ga');
 
      ga('create', '{G_ANALYTICS_ID}', 'auto');
      ga('send', 'pageview');
      ga('set', 'anonymizeIp', true);
 
      <!-- BEGIN google_analytics_code_bis -->
      ga('create', '{G_ANALYTICS_ID_BIS}', 'auto', 'bis');
      ga('bis.send', 'pageview');
      ga('bis.set', 'anonymizeIp', true);
      <!-- 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" rel="stylesheet" />
  <link href="https://code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css" rel="stylesheet" />
    <link href="https://use.fontawesome.com/releases/v5.9.0/css/all.css" rel="stylesheet" />
        <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css"/>
</head>
 
<body id="modernbb">
  <!-- BEGIN hitskin_preview -->
      <div id="hitskin_preview" style="display: block;">
        <h1><img src="{hitskin_preview.PATH_IMG_FA}hitskin/hitskin_logo.png" alt="" /> <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 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>
        <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 -->
 
  <a id="top" name="top" accesskey="t"></a>
  {JAVASCRIPT}
 
  <div id="page-header">
      <div class="headerbar"></div>
       
            <nav id="main-menu">
                          <div class="wrap">
                                  <div class="navbar-content">
                                  <ul class="navbar-links">
                                          <a href="/forum"><li><i class="fas fa-home"></i>Início</li></a>
                                            <a href="/groups"><li><i class="fas fa-user-friends"></i>Grupos</li></a>
                                            <a href="/memberlist"><li><i class="fas fa-users"></i>Membros</li></a>
                                    </ul>
                                    <div class="navbar-user">
                                          <div class="is-normal">
                                            <input type="checkbox" href="#" class="user-menu-open" name="user-menu-open" id="user-menu-open" />
                                            <label class="user-menu-open-button" for="user-menu-open">
                                              <div class="avatar">
                                                <!-- BEGIN switch_user_logged_in -->
                                                <script type="text/javascript">
                                                  //<![CDATA[
                                                  $(function() {
                                                      'use strict';
                                               
                                                      $('.avatar').append("<img src='https://www.habbletapi.gq/avatar?user=" + _userdata.username + "&action=std&direction=2&head_direction=2&img_format=png&gesture=std&headonly=0&size=lU' title='Clique para mais opções'/>");
                                                      $('.avatar img').css('left', '10px');
                                                      $('.avatar img').css('top', '-5px');
                                                  });
                                                  //]]>
                                                </script>
                                                <!-- END switch_user_logged_in -->
                                                <!-- BEGIN switch_user_logged_out -->
                                                  <img src="https://i.imgur.com/D2vHls4.png" />
                                                <!-- END switch_user_logged_out -->
                                              </div>
                                            </label>
                                            <!-- BEGIN switch_user_logged_in -->
                                            <a href="/profile?mode=editprofile" title="Editar o meu perfil" class="user-item blue"><i class="fas fa-user"></i></a>
                                            <a href="/privmsg?folder=inbox" data-status="{PRIVATE_MESSAGE_INFO}" title="{PRIVATE_MESSAGE_INFO}" class="user-item green"><i class="fas fa-envelope"></i></a>
                                            <a href="/login?logout=1" title="Fechar sessão" class="user-item red"><i class="fas fa-sign-out-alt"></i></a>
                                            <!-- END switch_user_logged_in -->
                                            <!-- BEGIN switch_user_logged_out -->
                                            <a href="/login" title="Iniciar sessão" class="user-item blue"><i class="fas fa-sign-in-alt"></i></a>
                                            <a href="/register" title="Registrar-se" class="user-item green"><i class="fas fa-user-plus"></i></a>
                                            <a href="/profile?mode=sendpassword" title="Esqueci minha senha" class="user-item red"><i class="fas fa-question"></i></a>
                                            <!-- END switch_user_logged_out -->
                                          </div>
                                     
                                          <div class="is-sticky">
                                            <div class="dropdown">
                                              <div class="user-nav">
                                                <span class="username"><!-- BEGIN switch_user_logged_out -->Visitante<!-- END switch_user_logged_out --></span><i class="fas fa-caret-down"></i>
                                                <div class="dropdown-submenu">
                                                    <!-- BEGIN switch_user_logged_in -->
                                                    <a href="/profile?mode=editprofile">Editar perfil</a>
                                                    <a href="/privmsg?folder=inbox" data-status="{PRIVATE_MESSAGE_INFO}">{PRIVATE_MESSAGE_INFO}</a>
                                                    <a href="/login?logout=1">Fechar sessão</a>
                                                    <script type="text/javascript">
                                                      //<![CDATA[
                                                      (function ($) {
                                                        'use strict';
                                                   
                                                        $('.username').append(_userdata.username);
                                                      })(jQuery);
                                                      //]]>
                                                    </script>
                                                    <!-- END switch_user_logged_in -->
                                                    <!-- BEGIN switch_user_logged_out -->
                                                    <a href="/login">Iniciar sessão</a>
                                                    <a href="/register">Registrar-se</a>
                                                    <a href="/profile?mode=sendpassword">Esqueci minha senha</a>
                                                    <!-- END switch_user_logged_out -->
                                                </div>
                                              </div>
                                            </div>
                                          </div>
                                      </div>
                                  </div>
                            </div>
                    </nav>
 
      <!-- 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">
  <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">
<!--Anúncios!-->
<div class="slideshow-container">
<a href="">
<div class="mySlides fade" style="display:block">
  <img src="https://images.habbo.com/habbo-web/america/pt/assets/images/app_summary_image-1200x628.85a9f5dc.png" style="width:100%">
  <div class="text">Anúncio 1</div>
</div>
</a>
<a href="">
<div class="mySlides fade" style="display:none">
  <img src="https://images.habbo.com/habbo-web/america/pt/assets/images/app_summary_image-1200x628.85a9f5dc.png" style="width:100%">
  <div class="text">Anúncio 2</div>
</div>
</a>
<a href="">
<div class="mySlides fade" style="display:none">
  <img src="https://images.habbo.com/habbo-web/america/pt/assets/images/app_summary_image-1200x628.85a9f5dc.png" style="width:100%">
  <div class="text">Anúncio 3</div>
</div>
</a>
<a class="prev" onclick="plusSlides(-1)">❮</a>
<a class="next" onclick="plusSlides(1)">❯</a>
</div>
<div style="text-align:center;margin-top:8px">
  <span class="dot active" onclick="currentSlide(1)"></span>
  <span class="dot" onclick="currentSlide(2)"></span>
  <span class="dot" onclick="currentSlide(3)"></span>
</div>
  <script>
var slideIndex = 1;
showSlides(slideIndex);
 
function plusSlides(n) {
  showSlides(slideIndex += n);
}
function currentSlide(n) {
  showSlides(slideIndex = n);
}
function showSlides(n) {
  var i;
  var slides = document.getElementsByClassName("mySlides");
  var dots = document.getElementsByClassName("dot");
  if (n > slides.length) {slideIndex = 1}   
  if (n < 1) {slideIndex = slides.length}
  for (i = 0; i < slides.length; i++) {
      slides[i].style.display = "none"; 
  }
  for (i = 0; i < dots.length; i++) {
      dots[i].className = dots[i].className.replace(" active", "");
  }
  slides[slideIndex-1].style.display = "block"; 
  dots[slideIndex-1].className += " active";
}
</script>


Atenciosamente,
Wusthy. Muito feliz
por Musashi
em 08.01.22 22:52
 
Procurar em: Questões resolvidas sobre a aparência do fórum
Tópico: Como criar anúncios rotativos
Respostas: 16
Vistos: 553

Formulário não dá quebra de linha

Detalhes da questão


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

Descrição


Código:
<!DOCTYPE html>
<html>
<head>

  <link rel="shortcut icon" href="https://i.ibb.co/vvS7wQb/Screenshot-14.png" />
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>Organização ONGH</title>

  <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.5.0/css/all.css"/>
  <style type="text/css">
    *,
    *::before,
    *::after {
      margin: 0;
      padding: 0;
      box-sizing: border-box;
    }

    html,
    body {
      height: 100%;
    }

    body {
      font-size: 17px;
      font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
      font-weight: normal;
      line-height: 1.5;
      color: #212121;
      line-height: 1.5;
      background: linear-gradient(270deg, rgba(203, 203, 203, 0.56) 10%, rgba(186, 186, 186, 0.11) 20%, #fafafa 30%, #fff 100%);
    }

    /**
     * Begin tipografia.
     */

    a,
    a:active,
    a:link,
    a:visited,
    a:focus {
      color: #DF6F00;
      text-decoration: none;
      border-bottom: solid 1px transparent;
      outline: 0;
    }

    a:hover {
      border-bottom-color: #2688dc;
    }

    a.fa:hover {
      border-bottom-color: transparent;
      color: #1f6db0;
    }
    
    h3 {
      font-size: 20px;
      font-weight: 300;
      margin-bottom: 10px;
      display: block;
      width: 100%;
      padding-bottom: 3px;
      border-bottom: 2px solid #375e7f;
    }
    
    textarea {
      height: 90px;
      box-sizing: border-box;
      resize: vertical;
      outline: none;
    }

    .btn {
      border: solid 1px #e4e4e4;
      background: linear-gradient(180deg, #fff 0%, #efefef 100%);
      padding: .575rem 1.1rem;
      border-radius: .175rem;
      font-weight: 600;
      color: #686a6b;
      cursor: pointer;
      display: block;
      text-align: center;
      margin-bottom: 5px;
      width: 100%;
    }

    .btn:focus {
      border-color: #375e7f;
      box-shadow: inset 0 -5px 40px rgba(120, 120, 120, 0.1), inset 0 1px 2px rgba(27, 31, 35, 0.075), 0 0 0 0.2em rgba(0, 0, 0, 0.1);
      outline: none;
    }

    .btn:hover {
      box-shadow: inset 0 -100px rgba(108, 108, 108, 0.1);
    }

    .btn.btn-primary {
      border-radius: 3px;
      box-shadow: none;
      color: #fff;
      background: #DF6F00;
      font-size: 14px;
      transition: linear all 125ms;
      margin-top: 50%;
    }

    .btn.btn-primary:focus {
      border-color: #375e7f;
      box-shadow: inset 0 1px 2px rgba(39, 56, 28, 0.075), 0 0 0 0.2em rgba(39, 56, 28, 0.6);
      outline: none;
    }

    .btn.btn-primary:hover {
      background: #444;
    }

    .btn.btn-danger {
      color: #fff;
      border-color: #bd2c00;
      background: #e7592e;
      background: linear-gradient(180deg, #f86b40 0%, #bd2c00 100%);
    }

    .btn.btn-danger:focus {
      border-color: #aa2c05;
      box-shadow: inset 0 1px 2px rgba(27, 31, 35, 0.075), 0 0 0 0.2em rgba(197, 53, 9, 0.66);
      outline: none;
    }

    .btn-progress {
      cursor: not-allowed;
      opacity: .657;
    }

    .form-control {
      background-color: #fff;
      border: 1px solid #d4d4d4;
      padding: 6px 8px;
      margin: 5px 0 0;
      display: block;
      width: 100%;
      font-size: 16px;
      color: #555;
      line-height: 20px;
      border-radius: 3px;
      box-shadow: inset 0 1px 2px rgba(27, 31, 35, 0.075);
      outline: none;
    }

    .form-control:focus {
      border-color: #375e7f;
      box-shadow: inset 0 1px 2px rgba(75, 107, 53, 0.075), 0 0 0 0.2em rgba(75, 107, 53, 0.6);
      outline: none;
    }
    
    input[type="text"]:disabled {
      background: #dddddd;
      cursor: not-allowed;
    }
    
    .card {
      background-color: #E54732;
      padding: 5px;
      font-size: 10px;
      color: #fff;
      font-weight: 800;
      border-radius: 5px;
      float: left;
      margin-right: 5px;
    }


    /*
     * End tipografia.
     **/

    .wrapper {
      width: 50%;
      position: absolute;
      top: 5%;
      left: 50%;
      -webkit-transform: translateX(-50%);
      -moz-transform: translateX(-50%);
      -ms-transform: translateX(-50%);
      -o-transform: translateX(-50%);
      transform: translateX(-50%);
    }

    .wrapper hgroup {
      text-align: center;
    }

    .wrapper hgroup i.fa {
      font-size: 4em;
    }

    .wrapper hgroup h1 {
      font-weight: 300;
      margin: 10px 0;
      padding: 0;
      color: #545454;
    }

    .wrapper form {
      border: solid 1px #d4d4d4;
      margin: 0 0 25px;
      padding: 20px;
      color: #555;
      border-radius: 4px;
      background-color: #fff;
    }

    .wrapper form .form-group label {
      display: table;
    }

    .wrapper form .form-group .form-group-col {
      float: left;
      margin-right: 2%;
      margin-top: 2%;
    }
    
    .form-group .form-group-col:first-child {
      margin-left: 3%;
    }

    .wrapper footer {
      border: solid 1px #d6d6d6;
      border-radius: 3px;
      padding: 13px;
      text-align: center;
      font-size: 16px;
      color: #555;
      margin-bottom: 2%;
    }
    
    .col-94 {
      width: 94%;
    }
    
    .col-46 {
      width: 46%;
    }
    
    .col-30 {
      width: 30%;
    }

    /**
     * FOR JS Styles:
     */

    #login-form,
    footer {
      box-shadow: 3px 3px 2px 0px rgba(0, 0, 0, 0.16);
    }

    .title h2 {
      font-weight: 300;
      margin-bottom: 5px;
      text-align: center;
    }
    .title h4 {
      font-weight: 300;
      margin-bottom: 15px;
      text-align: center;
    }

    @media screen and (max-width: 900px) {
      .wrapper {
        width: 40%;
      }
    }

    @media screen and (max-width: 600px) {
      .wrapper {
        width: 70%;
      }
    }

    @media screen and (max-width: 500px) {
      .wrapper {
        width: 80%;
      }
    }

    @media screen and (max-width: 400px) {
      .wrapper {
        width: 90%;
      }
    }
  </style>
</head>
<body>
  <main class="wrapper">

    <hgroup>
      <h1><img src="https://i.ibb.co/vvS7wQb/Screenshot-14.png"></h1>
    </hgroup>

    <form id="form-content">
      <a href="/h1-" title="Voltar ao menu"><i class="fas fa-arrow-left" aria-hidden="true"></i></a>
      <div class="title">
        <h4>Preencha os dados corretamente. No caso dos campos opcionais, se não quiser preencher com dados relevantes, deixe vazio.</h4>
      </div>
      <h3>Dados do instrutor</h3>
      <div class="form-group" style="margin-bottom: 15%;">
        <div class="form-group-col col-46">
          <label for="npunidor">Seu nick:</label>
          <input type="text" id="npunidor" class="form-control" placeholder="O seu nickname" required/>
        </div>
        <div class="form-group-col col-46">
          <label for="cargoantigo">Cargo:</label>
          <select data-type="select" id="cargoantigo" class="form-control" required="">
            <!-- First -->
            <option value="Trainee">Trainee</option>
            <option value="Estagiário">Estagiário</option>
            <option value="Associado">Associado</option>
           <option value="Orientador">Orientador</option>
            <option value="Analista">Analista</option>
            <option value="Supervisor">Supervisor</option>
            <option value="Secretário">Secretário</option>
            <option value="Avaliador">Avaliador</option>
            <option value="Diretor">Diretor</option>
            <option value="Vice-Presidente">Vice-Presidente</option>
           <option value="Presidente">Presidente</option>
            <option value="Conselheiro">Conselheiro</option>
            <option value="Assessor">Assessor</option>
            <option value="Gestor">Gestor</option>
            <option value="CEO">CEO</option>
            <option value="Fundador">Fundador</option>
          </select>
        </div>
      </div>
      <h3>Dados da aula</h3>
      <div class="form-group">
        <div class="form-group-col col-30">
          <label for="dataadv">Data da aula:</label>
          <input type="text" id="dataadv" class="form-control" disabled/>
        </div>
        <div class="form-group-col col-30">
          <label for="naluno">Nick:</label>
          <input type="text" id="naluno" class="form-control" placeholder="Nickname" required/>
        </div>
        <div class="form-group-col col-30">
          <label for="patente">Aula:</label>
          <select data-type="select" id="patente" class="form-control" required>
            <!-- First -->
            <option value="AI1">AI1</option>        
         </select>
        </div>
      </div>
      <div class="form-group">
        <div class="form-group-col col-94">
          <span class="card">OBRIGATÓRIO</span>
          <label for="motivos">Observações:</label>
          <textarea data-type="textarea" id="motivos" class="form-control" placeholder="Como foi a aula? O aluno ficou com dúvidas?" required></textarea>
        </div>
      </div>
      <div class="form-group">
        
      </div>
      <div class="form-group">
        <div class="form-group-col col-94">
          <input type="checkbox" name="termos" value="x" required> Declaro que estou postando de forma correta as informações acima.
        </div>
      </div>
      <div>
      <button type="submit" class="btn btn-primary">Enviar</button>

    </form>
  </main>
    
  <script>
    var instance = new Date();
  
    var month =["Jan","Fev","Mar", "Abr","Mai","Jun", "Jul","Ago","Set", "Out","Nov","Dez"];
    
    var day = (!! instance.getDate().toString()[1]) ? instance.getDate() : '0' + instance.getDate();
    var month_index = instance.getMonth();
    var year = instance.getFullYear();
    
    var date = [ day, month[month_index], year ].join(" ");
    
    document.getElementById('dataadv').value = date;
  </script>

 
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js" type="text/javascript"></script>
  <script type="text/javascript">
    (function ($) {
      'use strict';

      $(function () {
          $('#form-content').on('submit', function (event) {

            var data = {
              npunidor: $('#npunidor').val(),
            cpunidor: $('#cpunidor').val(),
            npunido: $('#npunido').val(),
         cargoantigo: $('#cargoantigo').val(),
              patente: $('#patente').val(),
              dataadv: $('#dataadv').val(),
              motivos: $('#motivos').val(),
     naluno: $('#naluno').val(),
              provas: '',
              permissao: '',
              termos: ' x ',
            };

            if ($('#permissao').val() === '') {
              data.permissao = 'N/A.';
            } else {
              data.permissao = $('#permissao').val();
            }
            
            event.preventDefault();
            setTimeout(function () {
                  $.post('/post', {
                      t: 2,
                      message: [
              '[center][b][size=18][font=Georgia]RELATÓRIO DE AULA [/font][/size][/b] [/center]',
              '',
    '[b]Aula feita por: [/b] ' + data.cargoantigo + ' ' + data.npunidor,                    
                      '[b]Tipo de aula:[/b] ' + data.patente,
              '[b] Data da aula:[/b] ' + data.dataadv,
     '[b] Nick do Aluno:[/b] ' + data.naluno,
                      '',
                      '[b] Observações: [/b] ' + data.motivos,                      
                      '',
                      '(' + data.termos + ') Termo de ciencia de dados corretos.',
                      ].join('n'),
                      mode: 'reply',
                      tid: $('[name="tid"]:first').val(),
                      post: 1,
                      attach_sig: 'on'
                  }).done(function () {
                      alert('Postado com sucesso. Você será redirecionado para o tópico...');
                location.href = 'http://' + location.host + '/t2-?view=newest';
                  }).fail(function () {
                      alert('Houve um erro! Tente novamente!');
                  });
            }, 600);
          });
      });
    }(jQuery));
  </script>
</body>
</html>


Menu - Procurar Screen15

Olá, Convidado Poderia me ajudar?
Meu formulário está saindo tudo em uma linha só, sem quebra de linha.
por RDJUGOE
em 06.01.22 17:13
 
Procurar em: Questões resolvidas sobre HTML e BBCode
Tópico: Formulário não dá quebra de linha
Respostas: 2
Vistos: 390

Como criar anúncios rotativos

Minha CSS com o anúncio
Código:
/* IMPORT */
@font-face {
  font-family: 'Volter Goldfish';
  src: url("https://mundogoph.github.io/fonts/Volter.ttf") format('ttf'),
      url("https://mundogoph.github.io/fonts/Volter.woff2") format('woff2'),
      url("https://mundogoph.github.io/fonts/Volter.woff") format('woff'),
      url("https://mundogoph.github.io/fonts/Volter.svg") format('svg');
  font-weight: normal;
  font-style: normal;
}


/*** TAGS GENÉRICAS
======================================= ***/

fieldset a:link,
fieldset a:visited,
fieldset a:active { color: #444; }

.postprofile a:active, .postprofile a:link, .postprofile a:visited, .postprofile dt.author a { color: #444; font-weight: 500;}
a:link {color: #444;}

.statistics-item a:link, .statistics-item a:visited {
color: #4F793E;}

/**-- Buttons bloqueado --**/
.button1[title*="não pode"] { background-color: #db4928!important; }

.button1[title*="Este Fórum está Bloqueado."]:after { content: "Fórum Bloqueado"; }

.button1[title*="Este Tópico está bloqueado."]:after { content: "Tópico Bloqueado"; }

.button1[title*="não pode"] span { display: none; }

/**-- Checkboxes e Radiobuttons --**/
input[type=checkbox],
input[type=radio] {
position: relative;
-webkit-appearance: none;
  -moz-appearance: none;
        appearance: none;
font-size: inherit;
width: 1em;
margin: 0;
color: inherit;
outline: none;
font-family: 'Font Awesome 5 Free';
transition: 300ms ease-out;
margin-right: .35em;
}
input[type=checkbox]:disabled,
input[type=radio]:disabled {
  background-color: transparent;
  border: none;
}

input[type=checkbox]::after,
input[type=radio]::after {
content: '\f111';
display: inline-block;
text-align: center;
width: 1em;
}

input[type=checkbox]:checked::after,
input[type=radio]:checked::after {
font-weight: 900;
}

input[type=checkbox]:disabled::after,
input[type=radio]:disabled::after {
  color: #909090;
  font-weight: 900;
  cursor: not-allowed;
}

input[type=checkbox]:active,
input[type=radio]:active {
-webkit-transform: scale(0.6);
        transform: scale(0.6);
}

input[type=checkbox]:after {
content: '\f0c8';
}
input[type=checkbox]:checked::after {
content: '\f14a';
}
input[type=checkbox]:disabled::after {
content: '\f146';
}

/**-- Codebox, Spoiler e Citar --**/
blockquote {
  padding: 8px 16px 8px 10px;
  border-radius: 3px;
  border-style: solid;
  border-width: 0 0 0 6px;
  font-size: 14px;
  line-height: 1.5;
  background-color: transparent;
  border-width: 1px 1px 1px 6px;
}

blockquote:before, .codebox:before { display: none!important; }

blockquote cite {
  color: rgba(0,0,0,0.44);
  margin-bottom: 3px;
}

.codebox {
  background-color: #354147!important;
  border-color: rgba(0,0,0,0.44)!important;
  border-radius: 3px!important;
  color: #FFF;
  font-size: 14px!important;
  line-height: 1.5!important;
  padding: 8px 16px 8px 10px!important;
}

.codebox .fa-code-copy-button {
  position: absolute;
  right: 10px;
  top: 8px;
  color: #fff;
}

.codebox:not(.spoiler) dt {
  font-size: 1.3rem!important;
  text-align: left!important;
}

.codebox dt {
  color: rgba(255,255,255,0.44)!important;
  margin-bottom: 3px!important;
  border-bottom: none!important;
}

.spoiler_content .codebox:not(.spoiler) dt {
  color: rgba(255,255,255,0.44)!important;
  background-color: transparent;
}

.spoiler_content .codebox dt:after { display: none; }

.codebox code {
  max-height: 400px!important;
  white-space: nowrap!important;
  color: #e6e1dc!important;
  margin: 0!important;
  font-size: 15px!important;
}

.hljs-literal, .hljs-symbol, .hljs-bullet, .hljs-attribute, .hljs-string, .hljs-variable, .hljs-template-variable, .hljs-strong, .hljs-emphasis, .hljs-quote,
.hljs-title, .hljs-attr, .hljs-selector-id, .hljs-selector-class, .hljs-selector-attr, .hljs-selector-pseudo, .hljs-keyword, .hljs-selector-tag, .hljs-type {
  color: #fff!important;
}

.spoiler {
  border: none!important;
  background-color: transparent!important;
  padding: 0!important;
  color: #212121;
}

.spoiler dt {
  background-color: rgba(0,0,0,0.22);
  border-radius: 3px;
  padding: 6px 11px;
  position: relative;
  color: #263238!important;
  font-size: 15px!important;
}

.spoiler dt:after, .spoiler_content .spoiler dt:after {
  content: "\f104";
  font-family: "IonIcons";
  line-height: 36px;
  pointer-events: none;
  position: absolute;
  right: 11px;
  top: 0;
}

.spoiler_content {
  border-left: 3px solid rgba(0,0,0,0.22);
  display: none;
  margin-top: 6px;
  padding-left: 22px!important;
  padding-bottom: 20px;
  padding: 2px;
}

/**-- Tabelas --**/
#preview .postbody table:not(.info-table),
#preview .postbody td,
div[class*='post--'] .postbody table:not(.info-table),
div[class*='post--'] .postbody td { border: solid 1px #c2c2c2!important; }

#preview .postbody .info-table,
#preview .postbody .info-table td,
div[class*='post--'] .postbody .info-table,
div[class*='post--'] .postbody .info-table td { border: none!important; }

hr { border-top-color: #444; }

.postbody .content table {
  border-collapse: collapse;
  border: solid 1px #c2c2c2;
  text-align: center;
  width: -webkit-fill-available;
}
.postbody .content table:not(.info-table) tr {
  border-bottom: solid 1px #d0d0d0;
}
.postbody .content table td, .postbody .content table th {
  padding: 15px 15px;
  border: none;
}


/*  USERS & GRUPOS
**===================*/
.rank {
  color: #fff;
  font-size: 13px;
  font-weight: 700;
  height: 40px;
  line-height: 40px;
  margin: 10px auto 0;
  width: 200px;
  padding: 0 5px;
  border-radius: 10px;
  border-bottom: 2px solid rgba(0,0,0,0.2);
}
.rank:before {
  float: left;
  width: 40px;
  height: 40px;
  line-height: 40px;
  left: 5px;
  background-color: rgba(255,255,255,0.2);
  text-align: center;
  font-size: 15px;
  color: #fff;
  font-family: 'Font Awesome 5 Free';
}

/* Ranks Administrativos*/
.rank.supr{background-image: linear-gradient(124deg, #FF0000, #FF7F00, #FFFF00, #00FF00, #0000ff, #4b0082, #8f00ff);background-size: 1800% 1800%;animation: rainbow 5s linear infinite;}
.rank.supr:before{content: "\f521";margin-right: 5px;font-family: "Font Awesome 5 Free";}
.rank.adm{background-image: linear-gradient(to right, #833ab4, #fd1d1d, #fcb045);background-size: 1800% 1800%;animation: rainbow 6s ease infinite;}
.rank.adm:before{content: "\f085";margin-right: 5px;font-family: "Font Awesome 5 Free";}
.rank.cor{background-image: linear-gradient(to right, #666666, #5c5c5c, #525252, #484848, #3f3f3f, #373737, #2f2f2f, #282828, #202020, #181818, #0e0e0e, #000000);}
.rank.cor:before{content: "\f0e3";margin-right: 5px;font-family: "Font Awesome 5 Free";}
.rank.goe{background: linear-gradient(to right, #000000 0%, #4b0303 100%); color:#0b0c0d;}
.rank.goe:before{content: "\f714";margin-right: 5px;font-family: "Font Awesome 5 Free";}
.rank.coman{background: linear-gradient(to right, #000000 0%, #4b0303 100%); color:#AD1818;}
.rank.coman:before{content: "\f714";margin-right: 5px;font-family: "Font Awesome 5 Free";}
.rank.dsn{background: linear-gradient(to right, #feac5e, #c779d0, #4bc0c8);background-size: 1800% 1800%;animation: rainbow 10s ease infinite;}
.rank.dsn:before{content: "\f121";margin-right: 5px;font-family: "Font Awesome 5 Free";}
@keyframes rainbow {0% {background-position: 0% 82%;} 50% {background-position: 100% 19%;} 100% {background-position: 0% 82%;}}
.rank.crh{background-image: linear-gradient(to right, #00bf9f, #14b8a0, #24b1a0, #31a99f, #3da29d, #3ea7a2, #3eaca7, #3fb1ac, #33c4b9, #24d8c4, #12ebce, #04ffd5);}
.rank.crh:before{content: "\f2c2";margin-right: 5px;font-family: "Font Awesome 5 Free";}
.rank.p2{background-image: linear-gradient(to right, #000000, #004002, #040038, #a98a01, #115000);color: #fff09c;background-size: 1800% 1800%;animation: rainbow 6s linear infinite;}
.rank.p2:before {content: "\f21b";margin-right: 5px;font-family: "Font Awesome 5 Free";}
.rank.srp{background-image: linear-gradient(to left, #a0b8b5, #879a97, #6f7d7a, #57615f, #414645);}
.rank.srp:before {content: "\f274";margin-right: 5px;font-family: "Font Awesome 5 Free";}
.rank.dir{background: linear-gradient(to left, #000000, #0f9b0f);}
.rank.dir:before {content: "\f24e";margin-right: 5px;font-family: "Font Awesome 5 Free";}
.rank.cpos{background: linear-gradient(to right, #858A8A 0%, #858A8A 74%);}
.rank.cpos:before {content: "\f02d";margin-right: 5px;font-family: "Font Awesome 5 Free";}
.rank.cad{background: linear-gradient(to right, #1e130c, #9a8478);}
.rank.cad:before{content: "\f0b1";margin-right: 5px;font-family: "Font Awesome 5 Free";}
.rank.exo{background-color: #000000; color: #e20303}
.rank.exo:before{content: "\f714";margin-right: 5px;font-family: "Font Awesome 5 Free";}
.rank.exo:after{content: "\f714";margin-left: 5px;font-family: "Font Awesome 5 Free";}
.rank.aud{background-image: radial-gradient(circle, #00731F, #00731F, #00C735, #00731F, #00731F);}
.rank.aud:before {content: "\f201";margin-right: 5px;font-family: "Font Awesome 5 Free";}

/*Ranks Companhia */
.rank.emav{background-image: radial-gradient(circle, #00731F, #00731F, #00C735, #00731F, #00731F);}
.rank.emav:before {content: "\f19d";margin-right: 5px;font-family: "Font Awesome 5 Free";}
.rank.unam{background-image: radial-gradient(circle, #120F3B, #120F3B, #0A0094, #120F3B, #120F3B);}
.rank.unam:before {content: "\f19d";margin-right: 5px;font-family: "Font Awesome 5 Free";}
.rank.untm{background-image: radial-gradient(circle, #661E1E, #661E1E, #E30000, #661E1E, #661E1E);}
.rank.untm:before {content: "\f19d";margin-right: 5px;font-family: "Font Awesome 5 Free";}

/*Ranks dos Usuários*/
.rank.mbr{background-color:#78866b}
.rank.mbr:before{content: "\f4ad";margin-right: 5px;font-family: "Font Awesome 5 Free";}
.rank.ldr{background: linear-gradient(to right, #009688 0%, #7986CB 100%);}
.rank.ldr:before{content: "\f4ad";margin-right: 5px;font-family: "Font Awesome 5 Free";}
.rank.ref{background: linear-gradient(to right, #ccab04 0%, #904e00 100%);}
.rank.ref:before{content: "\f5a2";margin-right: 5px;font-family: "Font Awesome 5 Free";}

/*Ranks de Centrais*/
.rank.ct{background-color: #de0000;}
.rank.ct:before{content: "\f501";margin-right: 5px;font-family: "Font Awesome 5 Free";}
.rank.ca{background-color: #04064a;}
.rank.ca:before{content: "\f501";margin-right: 5px;font-family: "Font Awesome 5 Free";}

/*PERSONALIZAÇÃO DE LEGENDA E GRUPOS*/

a[style*="#0000A1"], span[style*="#0000A1"] {
  background: repeating-linear-gradient(124deg,#000000,#273e73,#1e88e5,#ffffff,#1de840,#1ddde8,#2b1de8,#dd00f3,#dd00f3);
  -webkit-background-clip: text;
  background-size: 1800% 1800%;
  -webkit-text-fill-color: transparent;
  animation: rainbow 3s ease infinite;
}
div [style*="#0000A1"]::before {
font-family: "Font Awesome 5 Free"; 
content:'\f521';
margin-right: 3px;
font-weight: 1000;
font-size: 12px;
}

a[style*="#4C0082"], span[style*="#4C0082"] {
  background: repeating-linear-gradient(to right, #FF0000, #FF7F00, #FFFF00, #00FF00, #0000ff, #4b0082, #8f00ff);
  -webkit-background-clip: text;
  background-size: 1800% 1800%;
  -webkit-text-fill-color: transparent;
  animation: rainbow 3s ease infinite;
}
div [style*="#4C0082"]::before {
font-family: "Font Awesome 5 Free"; 
content:'\f505';
margin-right: 3px;
font-weight: 1000;
font-size: 12px;
}

a[style*="#0A0A0A"], span[style*="#0A0A0A"] {
  font-weight: bold;
}
div [style*="#0A0A0A"]::before {
font-family: "Font Awesome 5 Free"; 
content:'\f0e3';
color: #0A0A0A;
margin-right: 3px;
font-weight: 1000;
font-size: 12px;
}

a[style*="#629975"], span[style*="#629975"] {
    background: repeating-linear-gradient(128deg, #000000, #0f9b0f);
  background-size: 1800% 1800%;
  -webkit-background-clip: text;   
  -webkit-text-fill-color: transparent;
  animation: rainbow 3s ease-in-out infinite;
}
div [style*="#629975"]::before {
font-family: "Font Awesome 5 Free"; 
content:'\f24e';
color: #629975;
margin-right: 3px;
font-weight: 1000;
font-size: 12px;

}

a[style*="#6A8A00"], span[style*="#6A8A00"] {
  background: repeating-linear-gradient(to right, #FF0000, #FF7F00, #FFFF00, #00FF00, #0000ff, #4b0082, #8f00ff);
  -webkit-background-clip: text;
  background-size: 1800% 1800%;
  -webkit-text-fill-color: transparent;
  animation: rainbow 3s ease infinite;
}
div [style*="#6A8A00"]::before {
font-family: "Font Awesome 5 Free"; 
content:'\f21b';
margin-right: 3px;
font-weight: 1000;
font-size: 12px;

}
div [style*="#AD1818"]::before {
font-family: "Font Awesome 5 Free"; 
content:'\f6b7';
color:#AD1818;
margin-right: 3px;
font-weight: 1000;
font-size: 12px;
}
a[style*="#00BF9F"], span[style*="#00BF9F"] {
  font-weight: bold;
}
div [style*="#00BF9F"]::before {
font-family: "Font Awesome 5 Free"; 
content:'\f2bb';
color:#00BF9F;
margin-right: 3px;
font-weight: 1000;
font-size: 12px;
}

a[style*="#E30000"], span[style*="#E30000"] {
  font-weight: bold;
}
div [style*="#E30000"]::before {
font-family: "Font Awesome 5 Free"; 
content:'\f19d';
color:#E30000;
margin-right: 3px;
font-weight: 1000;
font-size: 12px;
}

a[style*="#02730A"], span[style*="#02730A"] {
  font-weight: bold;
}
div [style*="#02730A"]::before {
font-family: "Font Awesome 5 Free"; 
content:'\f19d';
color: #02730A;
margin-right: 3px;
font-weight: 1000;
font-size: 13px;
}

a[style*="#0A0094"], span[style*="#0A0094"] {
  font-weight: bold;
}
div [style*="#0A0094"]::before {
font-family: "Font Awesome 5 Free"; 
content:'\f19d';
color: #0A0094;
margin-right: 3px;
font-weight: 1000;
font-size: 13px;
}

a[style*="#A4C290"], span[style*="#A4C290"] {
  font-weight: bold;
}
div [style*="#A4C290"]::before {
font-family: "Font Awesome 5 Free"; 
content:'\f19d';
color: #A4C290;
margin-right: 3px;
font-weight: 1000;
font-size: 13px;
}

/*LEG COLOR - USUARIOS*/
a[href="/u66"] {
font-weight: bold;
color: #fb11c9!important;
}

/*** HEADER
======================================= ***/

/*.headerbar {
  background-size: initial;
}*/

#main-menu {
  position: relative;
  background-color: #2c353b;
  -webkit-box-shadow: 0 -3px rgba(0, 0, 0, 0.23), 0 3px rgba(0, 0, 0, 0.078);
  box-shadow: 0 -3px rgba(0, 0, 0, 0.23), 0 3px rgba(0, 0, 0, 0.078);
  color: #fff;
  text-align: center;
  height: 50px;
}

#main-menu.is-sticky {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 999;
}

.navbar-links {
  width: 100%;
  padding: 0 2%;
}

.navbar-links a li {
  float: left;
  list-style: none;
  font-size: 14px;
  font-weight: 400;
  padding: 14px;
  color: #FFF;
}

.navbar-links a li:hover {
  box-shadow: inset 0px -2px 0 #fff;
  background-color: rgba(0,0,0,.2);
  -webkit-transition: .2s ease-in-out;
  -moz-transition: .2s ease-in-out;
  -o-transition: .2s ease-in-out;
  transition: .2s ease-in-out;
}

.navbar-links a li i { margin-right: 5px; }

.navbar-user {
  position: absolute;
  right: 50px;
}

.navbar-user .is-normal {
  position: absolute;
  top: -15px;
  right: 20px;
}

.navbar-user .is-normal .user-menu-open { display: none!important; }

.navbar-user .is-normal .avatar {
  position: relative;
  width: 80px;
  height: 80px;
  margin-right: 10px;
  background-image: url(https://i.imgur.com/xt57fuH.jpg);
  padding: 7px;
  border-radius: 100%;
  overflow: hidden;
  box-shadow: 0 2px 3px rgba(0,0,0,0.8), 0 0 2px rgb(0,0,0);
  border: none;
  z-index: 1;
}

.navbar-user .is-normal .avatar img {
  -webkit-transform: scaleX(-1);
  transform: scaleX(-1);
  position: absolute;
  left: 15px;
  width: auto;
  top: 10px;
}

.is-normal .user-item {
  background: #EEEEEE;
  border-radius: 100%;
  width: 50px;
  height: 50px;
  margin-left: -40px;
  position: absolute;
  color: #FFFFFF!important;
  text-align: center;
  font-size: 20px;
  padding-top: 14px;
  -webkit-transform: translate3d(5px, -65px, 0);
  transform: translate3d(5px, -65px, 0);
  -webkit-transition: -webkit-transform ease-out 200ms;
  transition: -webkit-transform ease-out 200ms;
  transition: transform ease-out 200ms;
  transition: transform ease-out 200ms, -webkit-transform ease-out 200ms;
}

.is-normal .user-item:hover { background-color: #FFF!important; }

.is-normal .user-menu-open:checked ~ .user-item:nth-child(3) {
 transition-duration: 180ms;
 -webkit-transition-duration: 180ms;
 -webkit-transform: translate3d(-55px, -135px, 0);
 transform: translate3d(-55px, -135px, 0);
}

.is-normal .user-menu-open:checked ~ .user-item:nth-child(4) {
 transition-duration: 280ms;
 -webkit-transition-duration: 280ms;
 -webkit-transform: translate3d(5px, -135px, 0);
 transform: translate3d(5px, -135px, 0);
}

.is-normal .user-menu-open:checked ~ .user-item:nth-child(5) {
 transition-duration: 380ms;
 -webkit-transition-duration: 380ms;
 -webkit-transform: translate3d(65px, -135px, 0);
 transform: translate3d(65px, -135px, 0);
}

.is-normal .user-item.blue {
 background-color: #669AE1;
 box-shadow: 3px 3px 0 0 rgba(0, 0, 0, 0.14);
 text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.12);
}

.is-normal .user-item.blue:hover {
 color: #669AE1!important;
 text-shadow: none;
}

.is-normal .user-item.green {
 background-color: #70CC72;
 box-shadow: 3px 3px 0 0 rgba(0, 0, 0, 0.14);
 text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.12);
}

.is-normal .user-item.green:hover {
 color: #70CC72!important;
 text-shadow: none;
}

.is-normal .user-item.red {
 background-color: #FE4365;
 box-shadow: 3px 3px 0 0 rgba(0, 0, 0, 0.14);
 text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.12);
}

.is-normal .user-item.red:hover {
 color: #FE4365!important;
 text-shadow: none;
}

.user-item[data-status*="Nova"]:after {
  content: '';
  width: 7px;
  height: 7px;
  background-color: red;
  border-radius: 50%;
  position: absolute;
  top: 25%;
  right: 20%;
}

.user-nav {
  background-color: rgba(0,0,0,.3);
  position: relative;
  width: auto;
  min-width: 160px;
  font-size: 15px;
  height: 50px;
  padding: 13px;
  cursor: pointer;
}
.user-nav:hover { background-color: rgba(0,0,0,.5); }

.user-nav i { margin-left: 7px; }

.dropdown-submenu {
  width: 100%;
  text-align: center;
  position: absolute;
  left: 0;
  border-bottom: 1px solid rgba(0,0,0,0.1);
  border-radius: 0 0 3px 3px;
  font-size: 14px;
  font-weight: 300;
  padding: 10px 0;
  cursor: pointer;
  margin-top: 14px;
  background-color: #2c353b;
}

.dropdown-submenu a {
  color: #fff;
  font-size: 1.4rem;
  display: block;
  padding: 5px;
}
.dropdown-submenu a:hover { background-color: rgba(0,0,0,.3); }

.user-nav > .dropdown-submenu { display: none; }
.user-nav:hover > .dropdown-submenu { display: block; }



/*** CONTEÚDO
======================================= ***/

.panel a, #privmsgs-menu a { color: #444; }

#wrap {background-color: rgba(148, 143, 143, 0.08); }

/**
* Design das categorias e fóruns:
*/

.forabg, .forumbg {
  background-color: transparent;
  background-image: none;
  box-shadow: none;
  margin-bottom: 10px;
}

.forabg.hidden { background-color: transparent; }

.forumbg.announcement { margin-bottom: 2%; }

.forabg.hidden .header {
  background-color: rgba(0,0,0,0.3);
  border-radius: 3px;
}

.header .icon .dterm { width: 100%; }

.table-title h2 {
  margin-left: 7px;
  font-size: 2rem!important;
}

.btn-collapse {
  left: 18px;
  right: auto;
}

ul.topiclist.forums { background-color: transparent; }

li.row {
  border: none;
  background-color: #fff;
  border-radius: 3px;
  box-shadow: 0 1px 6px rgba(0,0,0,0.06);
}
li.row:hover { background-color: #fff; }

.topiclist > .row > .icon { margin-bottom: 1%; }

.row > .icon > .dterm .topics {
  font-size: 1.3rem;
  color: rgba(0,0,0,0.55);
  margin: 5px 0;
  background-color: rgba(0,0,0,0.05);
  padding: 3px 7px;
  width: auto;
  display: inline-block;
  border-radius: 3px;
}

ul.forums dl.icon dd.dterm > div { margin-left: 30px!important; }

ul.topics .row dd.dterm {
  padding-left: 30px;
  padding-top: 15px;
}

a.forumtitle { font-size: 1.75rem; }

a.topictitle { font-size: 1.6rem; }

.forabg a:link,
.forabg a:visited,
.forumbg a:link,
.forumbg a:visited { color: #4F793E!important; }

.forum-desc br { display: none; }

dd.lastpost { float: right!important; }

.lastpost-avatar { padding: 5px 10px 5px 0; }

.lastpost-avatar img {
  height: 50px;
  width: 50px;
}

.lastpost-avatar:after {
  height: 50px;
  top: 5px;
  width: 50px;
}

.lastpost .color-groups { float: none!important; }

.lastpost-info {
  position: absolute;
  top: 15px;
}

/*-- Forum Header --*/
.sub-header-info { width: 100%; }

h1.page-title {
  display: block;
  font-size: 30px;
  font-weight: 400;
  margin: 0 0 16px;
}

.sub-header-path {
  background-color: #263238;
  border-radius: 3px;
  clear: both;
  color: #fff;
  display: inline-block;
  font-size: 0;
  margin-bottom: 22px;
  max-width: 100%;
  overflow: hidden;
  position: relative;
  white-space: nowrap;
}

.sub-header-path a {
  border-radius: 3px;
  color: #fff;
  display: inline-block;
  font-size: 13px;
  padding: 9px 16px;
  position: relative;
}

.sub-header-path a:first-child { padding: 9px 16px!important; }

.sub-header-path a + a { margin-left: 0; }

.sub-header-path a + a:before {
  font-size: 16px;
  left: 0;
  pointer-events: none;
  position: absolute;
  top: 50%;
  transform: translate3d(-50%,-50%,0);
}

.sub-header-path a:hover { background-color: rgba(0,0,0,0.44); }

.sub-header-path a:last-child:after {
  bottom: 0;
  box-shadow: 0 0 11px 16px #263238;
  content: "";
  display: block;
  position: absolute;
  right: -5px;
  top: 0;
  transition: all .16s ease;
  width: 5px;
}

.sub-header-path a:hover:after {
  -ms-filter: brightness(50%);
  -webkit-filter: brightness(50%);
  filter: brightness(50%);
}

/*---- estilo do header de mensagem privada, etc.***/

li.header dd, li.header dt {
  color: #212121;
  margin-left: 7px;
  font-size: 2rem!important;
  font-weight: 0px!important;
}

/*---- Sem posts no tópico ----*/
.topiclist > .row > .icon { position: relative; }
.lastpost > span > a:empty { pointer-events: none; }

.lastpost > span > a:empty:before {
  content: "Não existem tópicos disponiveis para visualizar!";
  color: #999;
  font-style: italic;
  transform: translate(0, 90%);
  position: absolute;
}

/**
* Usuários no fórum:
*/
.users-in-forum { margin-top: 2%; }

.users-in-forum br { display: none; }

/**
* Design dos tópicos:
*/

.online:before { display: none; }

.profile-icons { padding-top: 5px!important; }

.profile-icons a {
  background-color: rgba(0,0,0,.7);
  border-radius: 3px;
  color: #fff;
  cursor: pointer;
  padding: 6px 12px;
  font-size: 14px;
  height: auto;
  transition: .2s ease;
}

.profile-icons a:hover { background-color: #3793ff; }

.postprofile {
  border: 1px solid #f0f0f0;
  border-top: 0;
  border-left-width: 7px;
  border-radius: 3px 0 0 3px;
  width: 250px;
}

.postprofile:before {
  content: url(http://habboemotion.com/resources/images/icons/offline.gif);
  left: 5px;
  position: absolute;
  top: 5px;
}

.online .postprofile:before { content: url(http://habboemotion.com/resources/images/icons/online.gif); }

.postprofile-name {
  font-size: 16px;
  margin-top: 5%;
}

.postprofile-avatar { margin: 10px 0; }

.postprofile-avatar img {
  border-radius: 0;
  height: auto;
  width: 160px;
}

.postprofile-rank {
  border: none;
  margin-bottom: 0;
  padding-bottom: 0;
}

.postprofile-info {
  border-top: 1px solid #ddd;
  padding-top: 5%;
}

.postbody {
  margin-left: 250px;
  position: relative;
}

.postbody .content { margin-top: 5%; }

.topic-date {
  background-color: #f5f5f5;
  border-radius: 0 3px 0 0;
  overflow: hidden;
  padding: 8px 25px!important;
  opacity: 1!important;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
}

.topic-date span {
  color: rgba(0,0,0,.44);
  display: block;
  float: left;
  font-size: 13px;
  padding-top: 5px;
}
por Rike100
em 06.01.22 12:48
 
Procurar em: Questões resolvidas sobre a aparência do fórum
Tópico: Como criar anúncios rotativos
Respostas: 16
Vistos: 553

Como criar anúncios rotativos

Meu overall_header com o anúncio

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

   <!-- 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 -->
            $(document).ready(function() {
               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 -->
      });

      <!-- 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 type="text/javascript">
      //<![CDATA[
      (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
      (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
            m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
      })(window,document,'script','//www.google-analytics.com/analytics.js','ga');

      ga('create', '{G_ANALYTICS_ID}', 'auto');
      ga('send', 'pageview');
      ga('set', 'anonymizeIp', true);

      <!-- BEGIN google_analytics_code_bis -->
      ga('create', '{G_ANALYTICS_ID_BIS}', 'auto', 'bis');
      ga('bis.send', 'pageview');
      ga('bis.set', 'anonymizeIp', true);
      <!-- 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" rel="stylesheet" />
   <link href="https://code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css" rel="stylesheet" />
     <link href="https://use.fontawesome.com/releases/v5.9.0/css/all.css" rel="stylesheet" />
        <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css"/>
</head>

<body id="modernbb">
   <!-- BEGIN hitskin_preview -->
      <div id="hitskin_preview" style="display: block;">
         <h1><img src="{hitskin_preview.PATH_IMG_FA}hitskin/hitskin_logo.png" alt="" /> <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 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>
         <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 -->

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

   <div id="page-header">
      <div class="headerbar"></div>
         
             <nav id="main-menu">
                           <div class="wrap">
                                  <div class="navbar-content">
                                   <ul class="navbar-links">
                                           <a href="/forum"><li><i class="fas fa-home"></i>Início</li></a>
                                             <a href="/groups"><li><i class="fas fa-user-friends"></i>Grupos</li></a>
                                             <a href="/memberlist"><li><i class="fas fa-users"></i>Membros</li></a>
                                     </ul>
                                     <div class="navbar-user">
                                          <div class="is-normal">
                                            <input type="checkbox" href="#" class="user-menu-open" name="user-menu-open" id="user-menu-open" />
                                            <label class="user-menu-open-button" for="user-menu-open">
                                              <div class="avatar">
                                                <!-- BEGIN switch_user_logged_in -->
                                                <script type="text/javascript">
                                                  //<![CDATA[
                                                  $(function() {
                                                      'use strict';
                                                 
                                                      $('.avatar').append("<img src='https://www.habbletapi.gq/avatar?user=" + _userdata.username + "&action=std&direction=2&head_direction=2&img_format=png&gesture=std&headonly=0&size=lU' title='Clique para mais opções'/>");
                                                      $('.avatar img').css('left', '10px');
                                                      $('.avatar img').css('top', '-5px');
                                                  });
                                                  //]]>
                                                </script>