Página inicial customizada

Detalhes da questão

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

Descrição

Olá alguém pode me ajudar eu queria uma página inicial para meu fórum
Igual desse forum
https://www.brasildreamlife.com.br/
Se alguém puder me ajudar agradeço muito

Olá @Igor_Maicon,

O senhor deve ter em mente que o nosso fórum de suporte não é um fórum que permite o plágio/cópia parcial, pois, sendo, poderia descrever o que deseja da sua página, com o conteúdo semelhante ao fórum de cima?



Aguardo uma resposta sua,
pedxz.

Bem-vindo ao Fórum dos Fóruns! Seja bem-vindo ao Fórum dos Fóruns! Como acabou de se inscrever, veja aqui alguns links importantes a saber: Regras do Fórum, e o que você não deve fazer neste fórum; Lista de tutoriais e perguntas frequentes; A Equipe de Suporte; A função de busca.

Bom dia sim eu sei eu gostaria de uma baseado nessa com vídeo, informações do servidor, equipe, loja, plataforma Android, rede sociais e se possível adicionar uma área de eventos para mostrar os eventos programados

Olá Igor,

Uma sugestão de exemplo:

Código:

<!--  -------------- Todos os créditos Reservados ---------------  -->
<!--  -------------- Feito por iPrompt - FDF ---------------------  -->
<!--  -------------- Não retirar os créditos por favor -----------  --> 
<meta charset="UTF-8" /><title>Brasil Nova Games</title> 
<div class="barra">
  <span>
  </span>
  <p style="">
      <a href="”register”">Cadastre-se</a>. Já é registrado? <a href="login">Faça seu login</a>
  </p><span></span>
</div>
 
<div style="" class="main-header__logo">
                   
  <center>
        <img class="header-logo" alt="Nova Games" src="https://i.imgur.com/yJ0DYEe.png" style="width: 300px;margin-left: 0px;" />
  </center>
</div>
         
<div id="ultassunto">
             
  <div class="boxult">
                <img src="imagem" alt="" />          <span>Último assuntos</span>           
  </div>
             
  <div class="container">
                     
      <div id="id4">
                           
        <div class="box">
                      <a href="https://brasilinovagames.forumeiros.com/" target="_blank"><img src="https://i.imgur.com/1P9imjr.png" style="width: 139px;height: 109px;margin-top: -16px;border-radius: 10px 10px 0px 0px;margin-left: -16px;
" alt="" /></a>         
            <center>
                  <span>Fórum</span>
            </center>
                               
        </div>
                                     
        <div class="box">
            <a href="https://brasilinovagames.forumeiros.com/" target="_blank"><img src="https://i.imgur.com/1P9imjr.png" style="width: 139px;height: 109px;margin-top: -16px;border-radius: 10px 10px 0px 0px;margin-left: -16px;
" alt="" /></a>          <img src="imagem" alt="" />     
            <center>
              <span>Informações do servidor</span>
            </center>
                       
        </div>
                                     
        <div class="box">
            <a href="https://brasilinovagames.forumeiros.com/" target="_blank"><img src="https://i.imgur.com/1P9imjr.png" style="width: 139px;height: 109px;margin-top: -16px;border-radius: 10px 10px 0px 0px;margin-left: -16px;
" alt="" /></a>          <img src="imagem" alt="" />     
            <center>
              <span>Loja</span>
            </center>
                         
        </div>
                       
      </div>
                     
      <div id="id2">
                           
        <div class="box">
            <a href="https://brasilinovagames.forumeiros.com/" target="_blank"><img src="https://i.imgur.com/1P9imjr.png" style="width: 139px;height: 109px;margin-top: -16px;border-radius: 10px 10px 0px 0px;margin-left: -16px;
" alt="" /></a>          <img src="imagem" alt="" />     
            <center>
              <span>Regras</span>
            </center>
                     
        </div>
                                     
        <div class="box">
            <a href="https://brasilinovagames.forumeiros.com/" target="_blank"><img src="https://i.imgur.com/1P9imjr.png" style="width: 139px;height: 109px;margin-top: -16px;border-radius: 10px 10px 0px 0px;margin-left: -16px;
" alt="" /></a>          <img src="imagem" alt="" />     
            <center>
              <span>Plataforma Android</span>
            </center>
                         
        </div>
                                     
        <div class="box">
            <a href="https://brasilinovagames.forumeiros.com/" target="_blank"><img src="https://i.imgur.com/1P9imjr.png" style="width: 139px;height: 109px;margin-top: -16px;border-radius: 10px 10px 0px 0px;margin-left: -16px;
" alt="" /></a>          <img src="imagem" alt="" />     
            <center>
              <span>Redes Sociais</span>
            </center>
                     
        </div>
                       
      </div>
                     
      <div id="id3">
                       
        <div class="box">
            <a href="https://brasilinovagames.forumeiros.com/" target="_blank"><img src="https://i.imgur.com/1P9imjr.png" style="width: 139px;height: 109px;margin-top: -16px;border-radius: 10px 10px 0px 0px;margin-left: -16px;
" alt="" /></a>          <img src="imagem" alt="" />     
            <center>
              <span>Eventos</span>
            </center>
                       
        </div>
                                     
        <div class="box">
            <a href="https://brasilinovagames.forumeiros.com/" target="_blank"><img src="https://i.imgur.com/1P9imjr.png" style="width: 139px;height: 109px;margin-top: -16px;border-radius: 10px 10px 0px 0px;margin-left: -16px;
" alt="" /></a>          <img src="imagem" alt="" />     
            <center>
              <span>Postagens</span>
            </center>
                     
        </div>
                                     
        <div class="box">
            <a href="https://brasilinovagames.forumeiros.com/" target="_blank"><img src="https://i.imgur.com/1P9imjr.png" style="width: 139px;height: 109px;margin-top: -16px;border-radius: 10px 10px 0px 0px;margin-left: -16px;
" alt="" /></a>          <img src="imagem" alt="" />   
            <center>
              <span>Parceiros</span> 
            </center>
                   
        </div>
                       
      </div>
       
  </div>
                  <footer>  </footer>
  <p style="display: block;
  position: absolute;
  bottom: -30;
  width: 65%;
  opacity: 0.6;">
      Todos direitos reservados / Brasil Nova Games / 2020 - 2020
  </p><footer></footer>            <style>
footer {
  display: block;
  position: absolute;
  bottom: -30;
  width: 65%;
  opacity: 0.6;
}
 
#ultassunto {
  width: 36%;
  margin: 1rem auto;
  background: transparent;
  background-size: cover;
  display: flex;
}
.boxult {
 width: 240px;
    margin-left: 490px!important;
    height: 420px;
    box-sizing: border-box;
    padding: 1rem;
    margin: 1rem;
    text-align: center;
    position: absolute;
    border-radius: 10px;
    color: white;
    z-index: 2;
    background-color: #1b1f2f;
    margin-top: 30px!important;
}
 
 
#id4
{
  float:left;
}
#id3
{
  float:left;
}
body {
background: url('https://i.imgur.com/R4cLpwx.jpg') no-repeat;
overflow: hidden;
width: 100vw;
height: 100vh;
padding: 0;
-webkit-background-size: cover;
-moz-background-size: cover;
background-size: cover;
-o-background-size: cover;
display: block;
}
 
#container img {float:left}
.container {
    width: 30%;
    margin-left: -140px!important;
    margin: 1rem auto;
    background: transparent;
    display: flex;
    justify-content: space-around;
    align-items: center;
    position: fixed;
    background-size: cover;
}
.box {
  width: 140px;
  height: 130px;
  box-sizing: border-box;
  padding: 1rem;
  margin: 1rem;
  position: relative;
  border-radius: 10px;
  color: white;
  z-index: 2;
  background-color: #1b1f2f;
}
#id3
{
  float:right;
}
 
.barra {
background-color: black;
  position: relative;
  left: 0;
  float: right!important;
  right: 0;
  height: 45px;
  margin-top: -9px;
  width: 390px;
  border-bottom-left-radius: 16px;
color: white!important;
}
 
div p{
float:right;
  font-size: 20px;
  margin-top: -5px;
padding: 15px;
  display: block;
  position: absolute;
 
}
 
 
</style>
</div>

Atenciosamente,
Sleep

Bacana só que daria para fazer tipo no lugar das categorias ficar um vídeo do YouTube se possível que já inicia ao entra na página
E em baixo as categoria só que sem direcionamento igual do fórum q dei o exemplo
https://www.brasildreamlife.com.br/
Exemplo de partes: informações do servidor, equipe, loja, eventos, plataforma Android, rede sociais

Há diversas formas de incluir algo na sua página inicial customizada. Meu site é baseado só em páginas HTML e o fórum em si fica escondido atrás.

Tendo dito isso, consigo colocar elementos de diversos tipos para você, veja:

Exemplo de Página Inicial Customizada

Exemplo de Vídeos Agregados na Página

Eu gostaria de uma igual o Fórum q citei daí só mudar algumas coisas de lugar, cores.. para não ficar plágio...

Igor_Maicon escreveu:Eu gostaria de uma igual o Fórum q citei daí só mudar algumas coisas de lugar, cores.. para não ficar plágio...

Com esse tipo de pensamento, eles não vão te ajudar. Pois, só mudar um elemento ou outro ainda é plagio, a ideia da sua página tem que partir de você!

Amigos segue um exemplo que elaborei

Desde já muito obg pela ajuda

Se possível adicionar uns efeitos de fundo e umas animações quando abre a página aparecendo as coisas

Seria interessante mudar e colocar o Sistema de Abas nesse seu layout.

Índice | Sobre | Eventos | Responsáveis | Loja do Servidor | Redes Sociais

O que você acha?

Sim acho q fica bom

Alguém?

Te fiz uma página de base, para você ter uma noção de como fica.

Usei a "essência" do seu site, mas tem elementos do meu.

A parte abaixo não está mostrando as abas, porque você não as tem implementada no seu site, eu passo via mensagem privada como instalar (ainda não está em Guias Oficiais).



O código para essa página base está aqui:

Código:

<!doctype html>
<html lang="pt">
   <head>
      <!-- Required meta tags -->
      <meta charset="utf-8" />
      <!-- TutoCA Assets -->
      <base href="https://brasilinovagames.forumeiros.com/" />
      <link type="image/x-icon" rel="icon" href="https://illiweb.com/fa/favicon/discussion.ico" />
      <link rel="stylesheet" href="https://brasilinovagames.forumeiros.com/css.forum" />
      <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.0/jquery.min.js"></script>
      <script type="text/javascript" src="https://illiweb.com/rs4/33/frm/lang/pt.js"></script>
      <title>Brasil Inova Games</title>
   </head>
   <body>
      <div id="wrap">
         <!-- Topo -->
         <div id="page-header">
            <div class="headerbar">
               <div class="inner"><span class="corners-top"><span></span></span>
                  <span class="corners-bottom"><span></span></span>
               </div>
            </div>
         </div>
         <!-- ./Topo -->
         <!-- Conteudo -->
         <div id="page-body">
            <div id="wrapper">
               <div id="container">
                  <div id="content">
                     <div id="main">
                        <div id="main-content">
                           <!-- Zona de texto -->
                           <div class="container">
                              <ul class="tabs">
                                 <li data-tab="tab-1" class="tab-link current">Índice</li>
                                 <li data-tab="tab-2" class="tab-link">Sobre</li>
                                 <li data-tab="tab-3" class="tab-link">Eventos</li>
                                 <li data-tab="tab-4" class="tab-link">Responsáveis</li>
                                 <li data-tab="tab-5" class="tab-link">Loja do Servidor</li>
                                 <li data-tab="tab-6" class="tab-link">Redes Sociais</li>
                              </ul>
                              <div class="tab-content current" id="tab-1">
                                 <center>
                                    <strong>Índice</strong><br /><br /><br />
                                    <table style="border-collapse:collapse; line-height:20.8px" cellspacing="0" cellpadding="0" border="0">
                                       <tr>
                                          <td style="text-align:center; vertical-align:top; width:100%">
                                             <p><iframe width="800" height="600" src="https://www.youtube.com/embed/dSvM6_T9PdY"></iframe></p>
                                          </td>
                                       </tr>
                                    </table><br>---
                                 </center>
                              </div>
                              <div id="tab-2" class="tab-content">
                                 <center>
                                    <strong>Sobre</strong><br /><br /><br />
                                    
                                    Conteúdo da aba Sobre<br>---
                                 </center>                                 
                              </div>
                              <div id="tab-3" class="tab-content">
                                 <center>
                                    <strong>Eventos</strong><br /><br /><br />
                                    
                                    Conteúdo da aba Eventos<br>---
                                 </center>                                 
                              </div>
                              <div id="tab-4" class="tab-content">
                                 <center>
                                    <strong>Responsáveis</strong><br /><br /><br />
                                    
                                    Conteúdo da aba Responsáveis<br>---
                                 </center>                                 
                              </div>
                              <div id="tab-5" class="tab-content">
                                 <center>
                                    <strong>Loja do Servidor</strong><br /><br /><br />
                                    
                                    Conteúdo da aba Loja<br>---
                                 </center>                                 
                              </div>
                              <div id="tab-6" class="tab-content">
                                 <center>   
                                    <strong>Redes Sociais</strong><br /><br /><br />
                                    <table style="border-collapse:collapse; line-height:20.8px" cellspacing="0" cellpadding="0" border="0">
                                       <tr>
                                          <td><center><a href="https://www.facebook.com/TutorialDoCA"><img src="https://i.servimg.com/u/f57/17/53/75/18/facebo10.png" style="width:61;height:61px;"/><div class="TituloMedium">Página do Facebook</a></div></center></td>
                                          <td><center><span style="font-size:16px"><strong><span style="color:rgb(225, 225, 225)"><p>Separador</p></span></strong></span></center></td>
                                          <td><center><a href="https://trello.com/b/F8kljBMv/tutorial-do-ca-20"><img src="https://i78.servimg.com/u/f78/17/53/75/18/trello10.png" style="width:61;height:61px;"/><div class="TituloMedium">Tutorial do CA 2.0</a></div></center></td>
                                          <td><center><span style="font-size:16px"><strong><span style="color:rgb(225, 225, 225)"><p>Separador</p></span></strong></span></center></td>
                                          <td><center><a href="https://www.youtube.com/c/Z0mbieW"><img src="https://i.servimg.com/u/f57/17/53/75/18/youtub10.png" style="width:61;height:61px;"/><div class="TituloMedium">Canal do ZombieW</a></div></center></td>
                                          <td><center><span style="font-size:16px"><strong><span style="color:rgb(225, 225, 225)"><p>Separador</p></span></strong></span></center></td>
                                          <td><center><a href="https://discord.gg/e5KURq6"><img src="https://i.servimg.com/u/f78/17/53/75/18/discor10.png" style="width:61;height:61px;"/><div class="TituloMedium">Discord do ZombieW</a></div></center></td>
                                       </tr>
                                    </table><br>---
                                 </center>
                              </div>
                           </div><!--      container      --><br /><br />
                           <center>
                              <strong><img class="emojione" alt=":copyright:️" title=":copyright:" title=":copyright:" src="https://cdn.jsdelivr.net/emojione/assets/png/00a9.png?v=2.2.7"/>
                                 Brasil Inova Games
                              </div><br />
                              <div id="emptyidright"></div>
                           </center>
                        </div>
                     </div>
                  </div>
               </div>
            </div>
         </div>
         <!-- ./Conteudo -->
      </div>
   </body>
</html>

@Igor_Maicon

Entendeu? Você sumiu por 3 dias, não darei um "up" na próxima vez.

Bom dia amigo desculpe, os direcionamentos depois eu coloco só deixa um guia tipo "link aqui" aí eu modifico

Então na verdade o q teria direcionamento aí seria o "fórum" o restante ao clicar ele jogava lá para baixo na categoria tipo clica em responsaveis lá no menu ele rola lá para baixo aonde está os responsáveis

Olá @Igor_Maicon,

Agrada-lhe a página fornecida pelo @ZombieW?

Se sim, posso ajudar na edição da mesma.

Só lhe peço atenção as mensagens consecutivas.

Atenção! Você não pode postar mensagens consecutivas ou UP's antes de se completarem 24 horas desde a sua última mensagem em um tópico. Por este motivo, pedimos que leia as regras do Setor de Suporte e as regras do Fórum dos Fóruns para não cometer novos erros.

Atenciosamente,
Sleep

Ok, então teria como fazer o menu parecido com forum e os efeitos também ao entrar na pagina?
https://brasildreamlife.com/

E o vídeo do YouTube tem algum jeito de fazer ele iniciar sozinho quando entra na pagina?

@Edit ou para não ficar parecido e não der problemas de plágio... se tiver como fazer igual a foto q mandei de exemplo

Igor_Maicon escreveu:Ok, então teria como fazer o menu parecido com forum e os efeitos também ao entrar na pagina?
https://brasildreamlife.com/

Vou te passar o que precisa para fazer o sistema de abas funcionar, assim a página fica mais ajustada.

Igor_Maicon escreveu:E o vídeo do YouTube tem algum jeito de fazer ele iniciar sozinho quando entra na pagina?

Acredito que não, e é até melhor assim, para não ficar chato de acessar seu site.

Igor_Maicon escreveu:@Edit ou para não ficar parecido e não der problemas de plágio... se tiver como fazer igual a foto q mandei de exemplo

Segue o que precisa para as abas:

CSS:

Código:

/* Sistema de Abas - Início */
/*body{
    margin-top: 100px;
    font-family: Verdana,Arial,Helvetica,sans-serif;
    line-height: 1.6
}*/
.container{
    width: auto!important;
    margin: 0 auto;
    text-align: center;
}
.subcontainer{
    width: auto!important;
    margin: 0 auto;
    text-align: center;
}
ul.tabs{
    margin: 0px;
    padding: 0px;
    list-style: none;
}
ul.tabs li{
    background: #171717;
    color: #C1FA17;
    display: inline-block;
    padding: 10px 15px;
    cursor: pointer;
   font-weight: bold;
    font-style: italic;
}
ul.tabs li.current{
    background: #C1FA17;
    color: #000000;
    font-style: normal;
}
.tab-content{
    display: none;
    background: #171717;
    color: #FFFFFF;
    padding: 15px;
    border-style: solid;
    border-width: 5px;
    border-color: #C1FA17;
}
.tab-content.current{
    display: inherit;
}
ul.tabs br, ul.tabs + br, ul.tabs + br + br, .tab-content + br {display:none!important}
/* Sistema de Abas - Fim */

A parte comentada no início, é um ajuste no Banner, acho que dessa forma fica mais correta para você. Não se esqueça de mudar as cores tmb, a minha está nessa: #C1FA17

JavaScript (investimento em Todas as Páginas):

Código:

$(document).ready(function(){
 
 $('ul.tabs li').click(function(){
 var tab_id = $(this).attr('data-tab');

 $('ul.tabs li').removeClass('current');
 $('.tab-content').removeClass('current');

 $(this).addClass('current');
 $("#"+tab_id).addClass('current');
 })
})

Exemplo de Código (já mostrado na página que te liberei):

Código:

<div class="container">
 <ul class="tabs">
 <li data-tab="tab-1" class="tab-link current">Título Aba 1</li>
 <li data-tab="tab-99" class="tab-link"Título Aba 99</li>
 </ul>
 <div class="tab-content current" id="tab-1">
 Conteudo Aba 1
 </div>
 <div id="tab-99" class="tab-content">
 Conteudo Aba 99
 </div>
</div><!--      container      -->

Fazendo seu site ficar parecido com essa página: https://tutorialdoca.forumeiros.com/h94-teste2

Bom dia, amigos vcs não estão entendendo como eu queria kkk mais eu consegui uma base aqui vou tentar editar caso eu precisar de ajuda eu abro um tópico pode ser?
Pode trancar esse
E muito obg a todos pela ajuda