Home personalizada

Qual é minha questão:
Olá.
Gostaria de saber como colocar uma Home personalizada como cá na BestSkins.
Thanks

Endereço do meu fórum:
fusionpt.forumeiros.eu

Versão:
PunBB

Gostaria de saber como coloca ou como se faz?

Até mais.

Ambos amigo.

Bump

Ola,
Aqui esta :

Código:

 <title>Mundo dos Fóruns</title><link href="http://img24.imageshack.us/img24/5753/lgtedd2i.png" type="image/x-icon" rel="shortcut icon" /><meta content="text/html; charset=utf-8" http-equiv="content-type" /><meta content="text/javascript" http-equiv="content-script-type" /><meta content="text/css" http-equiv="content-style-type" /><meta content="pt" name="language" /><script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script><style media="screen" type="text/css">
  body {
  background: url('http://i.imgur.com/5bjVbVo.gif') repeat-x top left;
  font-family: "Segoe UI", "Segoe UI Web Regular", "Helvetica Neue", "BBAlpha Sans", "S60 Sans", Arial, "sans-serif";
  margin: 0 auto;
  }
ul {-webkit-padding-start: 5px;}
li {list-style-type: none;}
.tablet {
background: url('http://info.sennco.com/Portals/148705/images/tablet%20png.png') no-repeat;
height: 917px;
width: 768px;
float: right;
position: absolute;
top: 13%;
right: 20%;
z-index: 100;
}
.t-inside {
background: url(http://geekshavelanded.com/wp-content/uploads/2012/06/wallpaper_11.jpg) no-repeat center;
-moz-background-size: cover;
-o-background-size: cover;
-webkit-background-size: cover;
background-size: cover;
margin: 88px 0 0 108px;
border-radius: 4px;
height: 728px;
width: 568px;
}
.menu {
background: -moz-linear-gradient(#f9f9f9,#e0e0e0);
background-color: #e0e0e0;
background-image: -webkit-linear-gradient(#f9f9f9,#e0e0e0);
-moz-box-shadow: 0 1px 3px #232323;
-webkit-box-shadow: 0 1px 3px #232323;
box-shadow: 0 1px 3px #232323;
border-radius: 4px 4px 0 0;
font-family: 'Trebuchet MS';
text-transform: uppercase;
}
.menu li {display: inline-block;}
.menu li a {
color: rgb(52, 109, 154);
display: block;
text-decoration: none;
padding: 3px;
border-right: 1px solid #ddd;
height: 37px;
line-height: 37px;
}
    .todos {
        background: url("http://i.imgur.com/f2qZkGO.png") 0px 0px repeat-y;
        border-right: 3px solid #404F68;
        border-bottom: 3px solid #404F68;
        height: 100%;
        width: 177px;
        -moz-box-shadow: 0 1px 3px #232323;
        -webkit-box-shadow: 0 1px 3px #232323;
        box-shadow: 0 1px 3px #232323;
        padding-left: 17px;
        position: fixed;
       font-family: 'Trebuchet MS', Arial, Helvetica, sans-serif;
        font-size: 11px;
        font-weight: 700;
        padding: 4px 0px 0px;
        text-transform: uppercase;
    }
    .todos li a {
background: url(http://i78.servimg.com/u/f78/18/32/50/20/primar10.png) 0px 0px no-repeat;
color: rgb(255, 255, 255);
padding-left: 12px;
display: block;
height: 37px;
line-height: 37px;
margin-bottom: 4px;
outline: none;
text-decoration: none;
}
    .todos li a:hover {
background-position: 0px -103px;
color: rgb(52, 109, 154);
height: 43px;
line-height: 43px;
margin-bottom: 0px;
margin-top: -2px;
position: relative;
}
.todos div {padding: 8px;}
    .todos p{
       font: 2em "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;
        color: white;
    }
.topMarks {
background: url(http://i.imgur.com/inT4DLf.png) no-repeat top right;
position: absolute;
top: 8%;
right: 18%;
width: 318px;
height: 266px;
z-index: 1;
}
.topPaper {
background: url(http://i.imgur.com/fpBaCDG.png) no-repeat top right;
position: absolute;
top: 13%;
right: 18%;
width: 352px;
height: 445px;
z-index: 1;
}
.topPaperClip {
background: url(http://i.imgur.com/e3MBJTc.png) no-repeat top left;
position: absolute;
top: 8%;
left: 23%;
width: 101px;
height: 115px;
z-index: 1;
}
.content {
padding: 8px;
min-height: 230px;
width: 430px;
margin: 0 auto;
}
.content div {
background: white;
padding: 3px;
border-radius: 2px;
}
.content_inside {
display: inline-block;
width: 130px;
}
.content_inside:nth-child(2) {
border-right: 1px solid #e0e0e0;
border-left: 1px solid #e0e0e0;
}
.content h3 {
text-transform: uppercase;
color: white;
-webkit-margin-before: 0em;
border-bottom: 2px solid white;
}
.content a {
color: rgb(52, 109, 154);
text-decoration: none;
font-size: 13px;
}
#stats {
float: right;
position: absolute;
top: 8px;
right: 15px;
}
#stats h1 {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 13px;
color: white;
}
#credits {
float: right;
position: absolute;
font-weight: bold;
top: 35px;
right: 15px;
font-family: Candara;
color: rgb(71, 71, 71);
text-shadow: 1px 1px 0px rgb(0, 0, 0);
font-size: 13px;
}
#credits a {
color: rgb(162, 162, 162) !important;
}
#credits a:hover {
color: white !important;
}
</style>
<!--  Date: 2013-10-23  -->
<div class="topMarks">
</div>
 
<div class="topPaper">
</div>
 
<div class="topPaperClip">
</div>
 
<div class="tablet">
   
   <div class="t-inside">
      <div class="menu">
         
         <ul>
            
            <li>
               <a href="/forum">Fórum</a>
            </li>
            
            <li>
               <a href="/faq">FAQ</a>
            </li>
            
            <li>
               <a href="/memberlist">Membros</a>
            </li>
            
            <li>
               <a href="/groups">Grupos</a>
            </li>
            
         </ul>
         
      </div>
      <div class="content">
         <h3>
            Sobre Nós!
         </h3>
         
         <div>
            O fórum <strong>Mundo dos Fóruns</strong> está online desde 1 Agost 2013, o nosso fórum dispõe do melhor conteúdo e suporte para a plataforma forumeiros, tanto em CSS, como também HTML e jQuery. Também irão encontrar alguns serviços oferecidos pela <strong>Mundo dos Fóruns</strong>, como tutoriais para fóruns, batalhas de design e muito mais...
         </div>
      </div>
      <div class="content">
         <h3>
            Confira Também!
         </h3>
         
         <div>
            <ul>
               
               <div class="content_inside">
                  
                  <li>
                     <a href="/f1-regras-staff">Regras & Staff</a>
                  </li>
                  
                  <li>
                     <a href="/f2-anuncios-e-atualizacoes">Anúncios</a>
                  </li>
                  
                  <li>
                     <a href="/f12-perguntas-e-respostas-frequentes">FAQ</a>
                  </li>
                  
                  <li>
                     <a href="http://mundodosforuns.forum-pro.net/t64-lista-de-tutoriais-dicas-e-astucias">Toturiais</a>
                  </li>
                  
               </div>
               
               <div class="content_inside">
                  
                  <li>
                     <a href="/f4-questoes-sobre-codigos">Pedidos de Codigo</a>
                  </li>
                  
                  <li>
                     <a href="/f20-criacoes-graficas">Criações Gráficas</a>
                  </li>
                  
                  <li>
                     <a href="/f5-espaco-de-publicidade">Publicidade</a>
                  </li>
                  
                  <li>
                     <a href="/f6-analises">Análises</a>
                  </li>
                  
               </div>
               
               <div class="content_inside">
                  
                  <li>
                     <a href="#">Link aqui!</a>
                  </li>
                  
                  <li>
                     <a href="#">Link aqui!</a>
                  </li>
                  
                  <li>
                     <a href="#">Link aqui!</a>
                  </li>
                  
                  <li>
                     <a href="#">Link aqui!</a>
                  </li>
                  
               </div>
               
            </ul>
            
         </div>
      </div>
      
   </div>
   
</div>
<div class="todos">
   <div>
      <p>
         Mundo dos Fóruns
      </p>
      
      <li>
         Bem vindos ao fórum!
      </li>
      
   </div>
   <ul>
      
      <li>
         <a href="http://www.criadoresdepassaros.com/forum">Criadores de Passaros</a>
      </li>
      
      <li>
         <a href="/">Link aqui!</a>
      </li>
      
      <li>
         <a href="/">Link aqui!</a>
      </li>
      
      <li>
         <a href="/">Link aqui!</a>
      </li>
      
   </ul>
</div>
<div id="stats"><iframe src="/forum" style="display: none; width: 100%; height: 100px;" frameborder="0" scrolling="no" id="forum-stats"></iframe><script type="text/javascript">
         //<![CDATA[
         $(document).ready(function(){
             $('#forum-stats').load(function(){
                 var iframe = $('#forum-stats').contents();
                 if(iframe.length > 0) {
                        $('#stats').html(iframe.find('.statistics_head').html());
                 }
             });
         });
         //]]>
<a href="http://www.forumeiros.com"><img src="http://www.illiweb.com/fa/banner/pt/banner1.gif" alt="Fórum grátis" title="forumeiros.com" /></a>
      </script>
</div>
 

Se resultar repute.
Até Mais...

Onde coloco?

Bugou amigo, veja: [Tens de ter uma conta e sessão iniciada para poderes visualizar este link]

Qual é o protótipo da Home do BS agora, gosto do estilo, para modificar as coisas.

Diogo Ferreira escreveu:Bugou amigo, veja: [Tens de ter uma conta e sessão iniciada para poderes visualizar este link]

Qual é o protótipo da Home do BS agora, gosto do estilo, para modificar as coisas.

veja-> [Tens de ter uma conta e sessão iniciada para poderes visualizar este link]

[Tens de ter uma conta e sessão iniciada para poderes visualizar este link]

Como coloco uma imagem em retorno do azul?

Diogo Ferreira escreveu:[Tens de ter uma conta e sessão iniciada para poderes visualizar este link]

Como coloco uma imagem em retorno do azul?

procure por 

#slide
e troque por este
{ position: relative; width: 100%; height: 556px; background: url(http://www.blacktie.co/demo/munter/images/bg1.jpg); z-index: 998; }

Desapareceu o título
[Tens de ter uma conta e sessão iniciada para poderes visualizar este link]

Queria que essas zonas a azul ficassem transparentes mas um pouco escuro como fundo de modo a que se veja.

Olá,
Me passe o link da página, para que eu possa alterar.

Até +!

6Eyes escreveu:Olá,
Me passe o link da página, para que eu possa alterar.

Até +!

Aqui está premo:
[Tens de ter uma conta e sessão iniciada para poderes visualizar este link]

[Tens de ter uma conta e sessão iniciada para poderes visualizar este link]

Gostava que fosse essa a imagem de fundo.

Olá,
O código é este:

Código:



<html>
<head>
<title>Fusion Portugal</title>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<meta http-equiv="content-script-type" content="text/javascript">
<meta http-equiv="content-style-type" content="text/css">
<link rel="shortcut icon" type="image/x-icon" href="FAVICON_AQUI">
<meta name="description" content="Comunidade Multigamming Portuguesa!">
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript" src="http://illiweb.com/rs3/27/frm/jquery/cookie/jquery.cookie.js"></script>
<script type="text/javascript" src="http://tinyurl.com/var-fa"></script>

  <style>
/* GERAL */
* {margin: 0;padding: 0;}body {color: white;background: #202020;font-family: 'Open Sans', helvetica neue, sans-serif;font-weight: 400;font-size: 15px;}a {color: white;text-decoration: none;}li {list-style-type: none;}.content {width: 75%;margin: 0 auto;}.right {float: right;}.left {float: left;}none {display: none;}
/* HEADER */
#header {position: absolute;top: 0;left: 0;width: 100%;background: #163FA8;z-index: 999;}#header > #content {width: 80%;margin: 0 auto;}#header > #content ul li {display: inline-block;line-height: 54px;padding: 0 30px;cursor: pointer;-webkit-transition: all .8s;-moz-transition: all .8s;-o-transition: all .8s;transition: all .8s;}#header > #content ul li.active {background: rgba(0, 0, 0, 0.05);border-bottom: 3px solid rgba(0, 0, 0, 0.08);line-height: 48px;padding-top: 3px;}#header > #content ul li:hover {background: rgba(0, 0, 0, 0.05);}#header > #content ul li.logo {float: left;}#header > #content ul li a {text-shadow: 0 1px 2px rgba(2, 24, 116, 0.3);}
/* SLIDE */
#slide { position: relative; width: 100%; height: 556px; background: url(http://i1.ytimg.com/vi/X02UY0jqvx8/maxresdefault.jpg); z-index: 998; }
/* PAGE */
#mainbar {position: relative;width: 100%;padding: 50px 0;background: #0077AF;color: #444;}#mainbar > .container > #mainbar-columns {text-align: center;}#mainbar > .container > #mainbar-columns #column {display: inline-block;width: 312px;border-right: 1px solid rgba(0, 0, 0, 0.1);text-align: left;margin: 0;}#mainbar > .container > #mainbar-columns #column:last-child {border: 0;}#mainbar > .container > #mainbar-columns #column .icon {-webkit-filter: brightness(1);background-repeat: no-repeat;background-size: 30px;background-position: center;display: block;width: 32px;height: 32px;text-align: center;border: 2px solid #444;padding: 11px;border-radius: 500px;margin: 0 auto;cursor: pointer;}#mainbar > .container > #mainbar-columns #column .icon.skin {background-image: url(https://cdn1.iconfinder.com/data/icons/windows-8-metro-style/128/bg_color.png);}#mainbar > .container > #mainbar-columns #column .icon.staff {background-image: url(https://cdn2.iconfinder.com/data/icons/windows-8-metro-style/128/group.png);}#mainbar > .container > #mainbar-columns #column .icon.support {background-image: url(https://cdn1.iconfinder.com/data/icons/windows-8-metro-style/128/online_support.png);}
/* FOOTER */
#footer {position: relative;width: 100%;padding: 15px 0;background: #1A1D7A;color: white;font-size: 13px;}#footer > .container .copyright {text-align: left;}
/* GOOGLE FONTS */
@import url(http://fonts.googleapis.com/css?family=Lato:100,300,400,700,900,100italic,300italic,400italic,700italic,900italic);
@import url(http://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,600italic,700italic,800italic,400,300,600,700,800);
/* GERAL */
.none {display: none;}</style>
</head>
<body>
<div id="header">
  <div id="content" class="container">
    <ul>
      <li class="logo active"><a href="/">Home</a></li>
      <li class="left"><a href="/forum">Fórum</a></li>
      <li class="right"><a href="/contact">Contacte-nos</a></li>
      <li class="right"><a href="/">Área Gaming</a></li></ul>
  </div>
</div>
<div id="slide">
  <div id="slide-up"></div>
  <div id="slide-main">
    <div class="content container">
      <h1 class="logo">Fusion Portugal</h1>
      <p class="paragraph">Comunidade Multigaming Portuguesa!</p>
    </div>
  </div>
</div>
<div id="mainbar">
  <div class="content container">
    <div id="mainbar-columns">
      <div id="column"><div style="padding: 8px 20px;font-size: 14px;font-family: 'Lato', helvetica neue, sans-serif;text-align: center;"><b class="icon skin"></b><br><p>No fórum há uma área repleta de várias skins, todas disponíveis para download, basta logar-se para aproveitar.</p></div></div>
      <div id="column"><div style="padding: 8px 20px;font-size: 14px;font-family: 'Lato', helvetica neue, sans-serif;text-align: center;"><b class="icon staff"></b><br><p>O fórum contém uma ótimo equipe, todos muito bem capacitados para exercerem suas posições.</p></div></div>
      <div id="column"><div style="padding: 8px 20px;font-size: 14px;font-family: 'Lato', helvetica neue, sans-serif;text-align: center;"><b class="icon support"></b><br><p>Contacte a nossa equipa de Staff se necessitar de ajuda. Estamos online 24H por dia.</p></div></div>
    </div>
  </div>
</div>
<div id="footer">
  <div class="content container">
    <p class="copyright">
      <a href="http://bestskins.com.br/">Fusion Portugal 2014</a>
      <i class="right"><a href="http://bestskins.com.br/u24">Página desenvolvida por Nathan Borns / [F]lames</a></i>
    </p>
  </div>
</div>
<a href="http://www.forumeiros.com" target="_blank" class="none">forumeiros.com</a>
</body>
</html>


Até +!

Duas coisas, queria o titulo (Fusion Portugal) e o slogan (Comunidade Multigaming Portuguesa) do lado esquerdo, veja: [Tens de ter uma conta e sessão iniciada para poderes visualizar este link]

E queria a barra de cima e a debaixo não azul mas sim transparente, um pouco mais escuro para se notar os botões.

bump

Procurando ajuda ainda.

Para o Título Procure por:

Código:

<title>BestSkins | Bem-vindo!</title>

E Modifique BestSkins | Bem-vindo! pelo o que quiser.

As Cores e Wallpaper, preciso que diga.

Olá, aqui está o código e simples então vc mesmo pode modifica.

Código:



<html>
<head>
<title>Comunidade Multigaming Portuguesa</title>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<meta http-equiv="content-script-type" content="text/javascript">
<meta http-equiv="content-style-type" content="text/css">
<link rel="shortcut icon" type="image/x-icon" href="FAVICON_AQUI">
<meta name="description" content="Comunidade Multigamming Portuguesa!">
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript" src="http://illiweb.com/rs3/27/frm/jquery/cookie/jquery.cookie.js"></script>
<script type="text/javascript" src="http://tinyurl.com/var-fa"></script>

  <style>
/* GERAL */
* {margin: 0;padding: 0;}body {color: white;background: #202020;font-family: 'Open Sans', helvetica neue, sans-serif;font-weight: 400;font-size: 15px;}a {color: white;text-decoration: none;}li {list-style-type: none;}.content {width: 75%;margin: 0 auto;}.right {float: right;}.left {float: left;}none {display: none;}
/* HEADER */
#header {position: absolute;top: 0;left: 0;width: 100%;background: #163FA8;z-index: 999;}#header > #content {width: 80%;margin: 0 auto;}#header > #content ul li {display: inline-block;line-height: 54px;padding: 0 30px;cursor: pointer;-webkit-transition: all .8s;-moz-transition: all .8s;-o-transition: all .8s;transition: all .8s;}#header > #content ul li.active {background: rgba(0, 0, 0, 0.05);border-bottom: 3px solid rgba(0, 0, 0, 0.08);line-height: 48px;padding-top: 3px;}#header > #content ul li:hover {background: rgba(0, 0, 0, 0.05);}#header > #content ul li.logo {float: left;}#header > #content ul li a {text-shadow: 0 1px 2px rgba(2, 24, 116, 0.3);}
/* SLIDE */
#slide { position: relative; width: 100%; height: 556px; background: url(http://i1.ytimg.com/vi/X02UY0jqvx8/maxresdefault.jpg); z-index: 998; }
/* PAGE */
#mainbar {position: relative;width: 100%;padding: 50px 0;background: #0077AF;color: #444;}#mainbar > .container > #mainbar-columns {text-align: center;}#mainbar > .container > #mainbar-columns #column {display: inline-block;width: 312px;border-right: 1px solid rgba(0, 0, 0, 0.1);text-align: left;margin: 0;}#mainbar > .container > #mainbar-columns #column:last-child {border: 0;}#mainbar > .container > #mainbar-columns #column .icon {-webkit-filter: brightness(1);background-repeat: no-repeat;background-size: 30px;background-position: center;display: block;width: 32px;height: 32px;text-align: center;border: 2px solid #444;padding: 11px;border-radius: 500px;margin: 0 auto;cursor: pointer;}#mainbar > .container > #mainbar-columns #column .icon.skin {background-image: url(https://cdn1.iconfinder.com/data/icons/windows-8-metro-style/128/bg_color.png);}#mainbar > .container > #mainbar-columns #column .icon.staff {background-image: url(https://cdn2.iconfinder.com/data/icons/windows-8-metro-style/128/group.png);}#mainbar > .container > #mainbar-columns #column .icon.support {background-image: url(https://cdn1.iconfinder.com/data/icons/windows-8-metro-style/128/online_support.png);}
/* FOOTER */
#footer {position: relative;width: 100%;padding: 15px 0;background: #1A1D7A;color: white;font-size: 13px;}#footer > .container .copyright {text-align: left;}
/* GOOGLE FONTS */
@import url(http://fonts.googleapis.com/css?family=Lato:100,300,400,700,900,100italic,300italic,400italic,700italic,900italic);
@import url(http://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,600italic,700italic,800italic,400,300,600,700,800);
/* GERAL */
.none {display: none;}</style>
</head>
<body>
<div id="header">
  <div id="content" class="container">
    <ul>
      <li class="logo active"><a href="/">Home</a></li>
      <li class="left"><a href="/forum">Fórum</a></li>
      <li class="right"><a href="/contact">Contacte-nos</a></li>
      <li class="right"><a href="/">Área Gaming</a></li></ul>
  </div>
</div>
<div id="slide">
  <div id="slide-up"></div>
  <div id="slide-main">
    <div class="content container">
      <h1 class="logo">Fusion Portugal</h1>
      <p class="paragraph">Comunidade Multigaming Portuguesa!</p>
    </div>
  </div>
</div>
<div id="mainbar">
  <div class="content container">
    <div id="mainbar-columns">
      <div id="column"><div style="padding: 8px 20px;font-size: 14px;font-family: 'Lato', helvetica neue, sans-serif;text-align: center;"><b class="icon skin"></b><br><p>No fórum há uma área repleta de várias skins, todas disponíveis para download, basta logar-se para aproveitar.</p></div></div>
      <div id="column"><div style="padding: 8px 20px;font-size: 14px;font-family: 'Lato', helvetica neue, sans-serif;text-align: center;"><b class="icon staff"></b><br><p>O fórum contém uma ótimo equipe, todos muito bem capacitados para exercerem suas posições.</p></div></div>
      <div id="column"><div style="padding: 8px 20px;font-size: 14px;font-family: 'Lato', helvetica neue, sans-serif;text-align: center;"><b class="icon support"></b><br><p>Contacte a nossa equipa de Staff se necessitar de ajuda. Estamos online 24H por dia.</p></div></div>
    </div>
  </div>
</div>
<div id="footer">
  <div class="content container">
    <p class="copyright">
      <a href="http://bestskins.com.br/">Fusion Portugal © 2014</a>
      <i class="right"><a href="http://bestskins.com.br/u24">Página desenvolvida por Nathan Borns / [F]lames</a></i>
    </p>
  </div>
</div>
<a href="http://www.forumeiros.com" target="_blank" class="none">forumeiros.com</a>
</body>
</html>