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

Itens faltantes nas páginas html

2 participantes

Fórum dos Fóruns :: Ajuda e atendimento ao utilizador :: Questões sobre códigos :: Questões resolvidas sobre HTML e BBCode

Ver o tópico anterior Ver o tópico seguinte Ir para baixo

Tópico resolvido Itens faltantes nas páginas html

Mensagem por ZombieW 29.03.14 18:42

Qual é minha questão:
Me deparo com 2 problemas em minhas páginas HTML, vou definir as 2 abaixo, caso não possa ser "pedido" 2 correções em um único tópico, peço que me avisem que abro outra dúvida.


  1. Em uma página HTML criada no meu fórum, não me aparece minha barra superior personalizada. Como inseri-la na página HTML?
  2. Em uma página HTML criada em um site exterior (hostinger), não me aparece nem a minha barra superior personalizada e nem minha "página em gaveta". Como inserir ambos nessa página externa?


Imagem da Barra Supeior:

Itens faltantes nas páginas html 00110

Imagem da "Página em Gaveta":

Itens faltantes nas páginas html 00210

Itens faltantes nas páginas html 00310

Fino no aguardo e obrigado.

Endereço do meu fórum:
http://www.tutorialdoca.com

Versão do fórum:
PHPBB3


Última edição por ZombieW em 05.04.14 19:12, editado 1 vez(es)
ZombieW

ZombieW
Super Membro

Membro desde : 02/08/2010
Mensagens : 1452
Pontos : 2020

http://www.perfectteam.org

Ir para o topo Ir para baixo

Principal Contribuidor

Tópico resolvido Re: Itens faltantes nas páginas html

Mensagem por Shek 29.03.14 22:31

Boa noite!

Antes de fazer as modificações, queira salvar o código da sua página externa em um bloco de notas para não perder os dados. Muito feliz

Na sua página HTML externa, você pode procurar por:
Código:
<body>
Em seguida, basta abaixo do body adicionar o seguinte código:
Código:
<div style="top:-20px; left:0px;position:absolute;width:100%"><div id="pt_bar"><a id="pt_logo" href="//www.perfectteam.org/" original-title="">Perfect Team</a><div id="cssmenu">
<ul>
  <li class="has-sub"><a href="#" original-title=""><span>Sites</span></a>
      <ul>
        <li class="hover"><a href="//www.tutorialdoca.com" original-title=""><span>Tutorial do CA</span></a></li>
        <li class="hover"><a href="//www.tutorialdopw.com" original-title=""><span>Tutorial do PW</span></a></li>
        <li class="hover"><a href="//www.pwbrchannel.com" original-title=""><span>PWBRChannel</span></a></li>
      </ul>
  </li>
  <li class="has-sub"><a href="#" original-title=""><span>Em breve</span></a>
      <ul>
        <li class="hover"><a href="//www.tutorialdolol.com" original-title=""><span>Tutorial do LoL</span></a></li>
        <li class="hover"><a href="//www.tutorialdowf.com" original-title=""><span>Tutorial do WF</span></a></li>
      </ul>
  </li>
  <li class="has-sub"><a href="#" original-title=""><span>Parceiros</span></a>
      <ul>
        <li class="hover"><a href="http://levelupgames.uol.com.br/levelup/" target="_blank" original-title=""><span>Level UP! Games</span></a></li>
        <li class="hover"><a href="http://www.radiogamesbrasil.com.br/" target="_blank" original-title=""><span>Rádio Games Brasil</span></a></li>
      </ul>
  </li>
    <li class="has-sub"><a href="#" original-title=""><span>Staff</span></a>
    <ul>
        <li class="hover"><a href="#" original-title=""><span>-KageBoy-</span></a></li>
        <li class="hover"><a href="#" original-title=""><span>BanguelaGamer</span></a></li>
        <li class="hover"><a href="#" original-title=""><span>Guilhermeo9</span></a></li>
        <li class="hover"><a href="#" original-title=""><span>Impostor</span></a></li>
        <li class="hover"><a href="#" original-title=""><span>Master_Ace</span></a></li>
        <li class="hover"><a href="#" original-title=""><span>MrBadS2</span></a></li>
        <li class="hover"><a href="#" original-title=""><span>MrFoxnine</span></a></li>
        <li class="hover"><a href="#" original-title=""><span>SS105</span></a></li>
        <li class="hover"><a href="#" original-title=""><span>TERMINATOR98</span></a></li>
        <li class="hover"><a href="#" original-title=""><span>Zambatou</span></a></li>
        <li class="hover"><a href="#" original-title=""><span>ZombieW</span></a></li>
        <li class="hover"><a href="#" original-title=""><span>ZyyGamer</span></a></li>
    </ul>
    </li>
  <li class="has-sub"><a href="#" original-title=""><span>TeamSpeak 3</span></a>
  <ul>
        <li class="hover"><a href="#" original-title=""><span>perfectteam.ts3dns.com</span></a></li>
        <li class="hover"><a href="#" original-title=""><span>ou</span></a></li>
        <li class="hover"><a href="#" original-title=""><span>162.248.213.54:9988</span></a></li>
    </ul>
    </li>
  <li class="has-sub"><a href="#" original-title=""><span>Webmail</span></a>
  <ul>
        <li class="hover"><a href="//webmail.perfectteam.org" original-title=""><span>Perfect Team Org</span></a></li>
        <li class="hover"><a href="//webmail.tutorialdopw.com" original-title=""><span>Tutorial do PW</span></a></li>
        <li class="hover"><a href="//webmail.tutorialdoca.com" original-title=""><span>Tutorial do CA</span></a></li>
    </ul>
    </li>
</ul>
   <a class="classificacao" href="http://portal.mj.gov.br/ClassificacaoIndicativa/jsps/DadosJogoForm.do?select_action=&amp;tbjogo_codigo=2780" target="_blank" original-title=""><p class="classific">
               NÃO RECOMENDADO PARA<br>MENORES DE 16 ANOS <br>
               Contém: Assassinato
   </p></a><a href="//levelup.com.br" rel="Level Up!" target="_blank" original-title=""></a>
</div></div>
</div>
Em seguida, procure por "</head>" e antes dele, aplique:
Código:
<style>
/*=========================================
Barra Perfect Team Org (CA)
by DropLeet
=========================================*/
/* Descer o banner */
#logo-desc {
margin-top:43px;
}
/* Estrutura da Barra Perfect Team */
#pt_bar {
/*min-width: 100%;*/
}
#pt_bar {
height: 43px;
padding-bottom: 6px;
background: url(http://s3.amazonaws.com/nxcache/all/img/gnt_gradients.png) 0 -128px repeat-x;
position: relative;
/*z-index: 10000;*/
font-family: 'Lucida Grande','Lucida Sans Unicode',Tahoma,sans-serif;
font-size: 13px;
line-height: 19px;
box-shadow: 0 3px 6px rgba(0, 0, 0, 0.5);
-moz-box-shadow: 0 3px 6px rgba(0,0,0,0.5);
-webkit-box-shadow: 0 3px 6px rgba(0, 0, 0, 0.5);
}
#pt_bar a {
color: #4B77D8;
outline: none;
}
#pt_bar a::selection {
background: #2662B2;
color: white;
text-shadow: none;
}
/* Logotipo Perfect Team */
#pt_logo {
text-indent: -9999px;
height: 43px;
width: 56px;
float: left;
margin-left: 20px;
background: url(http://imageshack.us/a/img221/2316/perfectteamlogo.png) no-repeat;
}
/* Menu */
#cssmenu{
height:48px;
display:block;
padding:0;
margin:20px auto; 
border:1px solid;
border-radius:5px;
}
#cssmenu > ul {
list-style:inside none;
padding:0;
margin:0;
}
#cssmenu > ul > li {
list-style:inside none;
padding:0;
margin:0;
float:left;
display:block;
position:relative;
}
#cssmenu > ul > li > a{
outline:none;
display:block;
position:relative;
padding:12px 20px;
font:bold 13px/100% Arial, Helvetica, sans-serif;
text-align:center;
text-decoration:none;
}
#cssmenu > ul > li:first-child > a{
border-radius:5px 0 0 5px;
}
#cssmenu > ul > li > a:after{
content:'';
position:absolute;
top:-1px;
bottom:-1px;
right:-2px;
z-index:99;
}
#cssmenu ul li.has-sub:hover > a:after{
top:0;
bottom:0;
}
#cssmenu > ul > li.has-sub > a:before{
content:'';
position:absolute;
top:18px;
right:6px;
border:5px solid transparent;
border-top:5px solid #fff;
}
#cssmenu > ul > li.has-sub:hover > a:before{
top:19px;
}
#cssmenu ul li.has-sub:hover > a{
background:#3f3f3f;
border-color:#3f3f3f;
padding-bottom:13px;
padding-top:13px;
top:-1px;
z-index:999;
}
#cssmenu ul li.has-sub:hover > ul, #cssmenu ul li.has-sub:hover > div{
display:block;
}
#cssmenu ul li.has-sub > a:hover{
background:#3f3f3f;
border-color:#3f3f3f;
}
#cssmenu ul li > ul, #cssmenu ul li > div{
display:none;
width:auto;
position:absolute;
top:38px;
padding:10px 0;
background:#3f3f3f;
border-radius:0 0 5px 5px;
z-index:999;
}
#cssmenu ul li > ul{
width:200px;
}
#cssmenu ul li > ul li{
display:block;
list-style:inside none;
padding:0;
margin:0;
position:relative;
}
#cssmenu ul li > ul li a{
outline:none;
display:block;
position:relative;
margin:0;
padding:8px 20px;
font:10pt Arial, Helvetica, sans-serif;
color:#fff; /* Cor dos itens do li */
text-decoration:none;
text-shadow:1px 1px 0 rgba(0,0,0, 0.5);
}
li.hover a:hover{ /* Cor de seleção da class hover em li */
background: rgb(167,199,220); /* Old browsers */
/* IE9 SVG, needs conditional override of 'filter' to 'none' */
background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2E3YzdkYyIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiM4NWIyZDMiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
background: -moz-linear-gradient(top,  rgba(167,199,220,1) 0%, rgba(133,178,211,1) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(167,199,220,1)), color-stop(100%,rgba(133,178,211,1))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  rgba(167,199,220,1) 0%,rgba(133,178,211,1) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  rgba(167,199,220,1) 0%,rgba(133,178,211,1) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  rgba(167,199,220,1) 0%,rgba(133,178,211,1) 100%); /* IE10+ */
background: linear-gradient(to bottom,  rgba(167,199,220,1) 0%,rgba(133,178,211,1) 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a7c7dc', endColorstr='#85b2d3',GradientType=0 ); /* IE6-8 */
}
#cssmenu{
border-color:transparent;
}
#cssmenu > ul > li > a{
border-right:1px solid #BEC0C2;
color:#2C53AD; /* Cor dos itens do ul */
display: block;
line-height: 23px;
padding-right: 15px;
font-size: 16px;
font-weight: 600;
font-family: Klavika,sans-serif;
}
#cssmenu > ul > li:hover {
background: #2662B2;
color: white;
text-shadow: none;
}
#cssmenu > ul > li > a:after{
background: #2662B2;
color: white;
text-shadow: none;
}
#cssmenu > ul > li > a:hover{
background: #2662B2;
color: white;
text-shadow: none;
}
/* Classificação */
a.classificacao {
text-decoration:none;
}
.classificacao {
background: url(http://levelupgames.uol.com.br/commonImages/selo16anos.gif) no-repeat transparent;
float: right;
margin-right: 0px;
margin-left: 13px;
margin-top: 3px;
display:block;
}
p.classific {
font-family: Arial, Helvetica, sans-serif;
font-size: 9px;
line-height: 12px;
padding: 0 5px 0 45px;
text-align: center;
max-height: 30px;
margin-top: 3px;
margin-right: 10px;
color:black;
}
/*=========================================
Redes Sociais Flutuantes
by DropLeet
=========================================*/
.headline-right{
   float:right;
   width:300px
}
.headline a:hover{
   color:#eace12;
   text-decoration:underline
}
ul.isocial{
   list-style:none;
   margin:0;
   padding:0px 20px 0 0
}
ul.isocial li{
   float:right;
   margin:5px 2px;
   padding:0
}
ul.isocial li a{
   float:right;
   background-image:url(http://img854.imageshack.us/img854/7936/socialletter.png);
   background-position:0 0;
   background:repeat:no-repeat;
   display:inline-block;
   text-indent:-9999px;
   overflow:hidden;
   width:24px;
   height:24px;
   position:relative;
}
ul.isocial li a.rss{
   background-position:0 0
}
ul.isocial li a.rss:hover{
   background-position:0 -25px
}
ul.isocial li a.facebook{
   background-position:-25px 0
}
ul.isocial li a.facebook:hover{
   background-position:-25px -25px
}
ul.isocial li a.twitter{
   background-position:-50px 0
}
ul.isocial li a.twitter:hover{
   background-position:-50px -25px
}
ul.isocial li a.google{
   background-position:-75px 0
}
ul.isocial li a.google:hover{
   background-position:-75px -25px
}
ul.isocial li a.youtube{
   background-position:-100px 0
}
ul.isocial li a.youtube:hover{
   background-position:-100px -25px
}
</style>
No seu caso se não me recordo, você vai adicionar essa tag <style>...</style> antes do primeiro </head>. Piscada

Salve.

Já no caso do segundo código, você pode tentar colocar ele dentro da <div id="main-content">.
Código:
<div style="overflow:visible;position:fixed;bottom:30px;height:350px;right:0px;z-index:1000"><iframe src="http://tutorialdoca.com/h11-" id="chatboxpop" scrolling="yes" style="height: 350px; float: right; overflow: visible; width: 700px; display: block;" marginwidth="0" marginheight="0" frameborder="0"></iframe><div onclick="chatoc()" style="margin-top:10px;cursor :pointer;float:left"><img src="http://i57.servimg.com/u/f57/17/53/75/18/radio110.png" id="chatboxopen" style="display: none;"><img src="http://i57.servimg.com/u/f57/17/53/75/18/radio210.png" id="chatboxclose" style="cursor: pointer; display: inline;"></div></div>
Salve e veja se funciona.

Atenciosamente,
Shek
Shek

Shek
Principal Contribuidor
Principal Contribuidor

Membro desde : 11/04/2009
Mensagens : 18896
Pontos : 22793

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

Ir para o topo Ir para baixo

Tópico resolvido Re: Itens faltantes nas páginas html

Mensagem por ZombieW 30.03.14 17:12

Vamos lá Shek:

O código da barra superior funcionou.
Já o da rádio (site em gaveta) está falho, veja:

Itens faltantes nas páginas html 00310

A função do JavaScript que "abre" e "fecha" o site, não funciona. Ele fica fixo aberto.
ZombieW

ZombieW
Super Membro

Membro desde : 02/08/2010
Mensagens : 1452
Pontos : 2020

http://www.perfectteam.org

Ir para o topo Ir para baixo

Principal Contribuidor

Tópico resolvido Re: Itens faltantes nas páginas html

Mensagem por Shek 01.04.14 23:34

Me passe a URL da página, por favor Zombie.
Shek

Shek
Principal Contribuidor
Principal Contribuidor

Membro desde : 11/04/2009
Mensagens : 18896
Pontos : 22793

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

Ir para o topo Ir para baixo

Tópico resolvido Re: Itens faltantes nas páginas html

Mensagem por ZombieW 01.04.14 23:45

ZombieW

ZombieW
Super Membro

Membro desde : 02/08/2010
Mensagens : 1452
Pontos : 2020

http://www.perfectteam.org

Ir para o topo Ir para baixo

Principal Contribuidor

Tópico resolvido Re: Itens faltantes nas páginas html

Mensagem por Shek 02.04.14 0:03

Zombie, você já tentou usar o iframe onclick?
https://ajuda.forumeiros.com/t56719-tutorial-iframe-onclick

Para este caso, seja a melhor opção é usá-lo. Muito feliz
Shek

Shek
Principal Contribuidor
Principal Contribuidor

Membro desde : 11/04/2009
Mensagens : 18896
Pontos : 22793

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

Ir para o topo Ir para baixo

Tópico resolvido Re: Itens faltantes nas páginas html

Mensagem por ZombieW 02.04.14 0:59

Li, e não entendi como isso poderá "resolver minha vida".

Poderia me dar uma "luz"?
ZombieW

ZombieW
Super Membro

Membro desde : 02/08/2010
Mensagens : 1452
Pontos : 2020

http://www.perfectteam.org

Ir para o topo Ir para baixo

Tópico resolvido Re: Itens faltantes nas páginas html

Mensagem por ZombieW 03.04.14 8:03

Shek,

Consegui fazer funcionar...quando você ler isto, vai ficar feliz e meio  Bravo  porque isso corrigiu inclusive a FooterBar que montamos juntos:

Eu abri o código-fonte da página funcional interna www.tutorialdoca.com/h10-comparativo1 e comecei a estudar o código, dentro do código fonte há uma menção ao JavaScript

Código:
<script src="/99286.js" type="text/javascript"></script>

Quando eu entrei nele, eu achei o código da rádio... Aí fui olhar o código criado na página externa e estava igual, logo, deveria funcionar e não funcionava.

Eu simplesmente troquei de
Código:
<script src="/99286.js" type="text/javascript"></script>
para
Código:
<script src="http://www.tutorialdoca.com/99286.js" type="text/javascript"></script>
e pronto, tudo funcionando bem.

Algo simples e que nos trouxe muita dor de cabeça!  Louco 

Quando eu fiz isso, a "gaveta" da rádio apareceu e funcionou, porém, a FooterBar estava duplicada, logo, removi o código que tínhamos criado.

Pelo agora, antes de fechar o tópico, que verifique se não me falta nada ou que nada está "incorreto" nessa página, para que eu possa lhe dar paz finalmente (por enquanto).

http://tutorialdoca.meximas.com/Rifles%20de%20Assalto.html

 Muito feliz
ZombieW

ZombieW
Super Membro

Membro desde : 02/08/2010
Mensagens : 1452
Pontos : 2020

http://www.perfectteam.org

Ir para o topo Ir para baixo

Ver o tópico anterior Ver o tópico seguinte Ir para o topo

Fórum dos Fóruns :: Ajuda e atendimento ao utilizador :: Questões sobre códigos :: Questões resolvidas sobre HTML e BBCode

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