Ir ao conteúdo
  • Cadastre-se
Glouk

HTML Puxando menu para outras paginas.

Recommended Posts

Ola,

 

Bom, estou novamente aqui. Inclusive já estou com vergonha de postar tanto. Mas eu realmente gostei de aprender sobre programação etc, e sempre me surgem dúvidas. E sei que aqui não é uma escola, mas não sei estou procurando errado, mas eu não quase nunca encontro o que estou procurando. Mas enfim, vamos la.

 

Baixei um templete online e estou editando ele para aprender mesmo, entretanto ele possui um menu de opções ao lado esquerdo, e cada pagina é um arquivo html. porém este menu esta em todas as paginas, ou seja, se eu quiser alterar alguma opções eu tenho que alterar em todas, e isso da um trabalho imenso. 

 

Então, eu queria criar uma pagina especifica com o menu, e puxar esta pagina para as outras. Então eu criei o menu.php e estava puxando para as outras paginas com o requere_once, e tentei com include também. Mas não obtive sucesso. Alguém sabe como fazer?

 

Como eliminei o menu de todas as paginas, elas estão apenas com o corpo.

Compartilhar este post


Link para o post
Compartilhar em outros sites

Queria acrescentar que após olhar em vários tópicos. Tentei de varias formas com php, mas não obtive sucesso. Tentei com o proprio html, com divs, includes, etc..

 

O único modo que consegui, vai através do object.

 

<object data="menu.html"></object>

 Entretanto, ele não esta puxando o menu inteiro, esta deixando ele minimizado.

 

Screenshot_1.png.03547bd6504f5982067fc8814a80f64a.png

 

Alguma luz?

 

Compartilhar este post


Link para o post
Compartilhar em outros sites

@Glouk Este lance, você pode resolver de várias formas.

 

Por exemplo. Se utilizar uma velha técnica de SSI em php, você pode criar o seu layout fixo, com seu menu apenas uma vez e indicar onde ele irá abrir o conteúdo.

 

Vamos ao exemplo prático:

<header>
	<nav>
		<a href="index.php?page=prices">Nossos Preços</a>
		<a href="index.php?page=about">Sobre nós</a>
	</nav>
</header>
<article>
  <?php 
  
  $pagina = isset($_GET['page']) ? $_GET['page'] : '';
    
  switch($pagina):
      case 'prices':
          include 'prices.php';
          break;
      case 'about':
          include 'about.php';
          break;
      default:
          include 'home.php';
          break;
  endswitch;

?>
</article>
<footer></footer>

Basicamente temos ali o menu com o link, onde o index.php é arquivo que vai mandar no site todo.

Repare que é passado por GET o nome da página que será aberta.

 

Mais abaixo, veja o elemento article. Este elemento retrata no HTML5 o conteúdo principal do site, então no exemplo escolhi ele para inserir o conteúdo das páginas.

 

Repare que dentro dele há um código PHP.

Primeiro é testado se existe valor na variável $pagina. 

Após isso,  é utilizado a estrutura switch-case para definir:

Se for clicado no link do price.php, o arquivo price.php será carregado dentro do elemento article.

Caso contrário o arquivo about.php  será carregado dentro do elemento article.

 

Esta maneira, você pode criar um layout fixo, onde o menu é único, supriria bem o que você quer fazer.

 

Há outras maneiras, por exemplo usar o jQuery e carregar o link em um elemento definido usando a função load().

 

Ou simplesmente passar a usar o conceito de páginas do tipo  "ONE PAGE", onde cada link do menu, leva o usuário em uma sessão do site, só puxando para baixo  ou para cima, mas permanecendo no mesmo lugar.

este conceito é um dos mais utilizados atualmente.

 

Caso tenha interesse sobre como fazer com o jQuery e o load() veja este post:

 

  • Obrigado 1

Compartilhar este post


Link para o post
Compartilhar em outros sites

@DiF Entendi... Muito legal esta forma. Eu consegui, mas a pagina esta ficando la pra baixo, devido ao menu ser ao lado esquerdo e não em cima, como é o padrão. 

 

Screenshot_3.thumb.png.a71e83f08b21056f65be0616cd39bb4e.pngScreenshot_2.thumb.png.a7132ca52a8b774bbc3bae83b044c01f.png

 

Tentei arrumar, mas não obtive sucesso!

Compartilhar este post


Link para o post
Compartilhar em outros sites

@Glouk Poxa... mas aí é só questão de regras de CSS..   Dê uma pesquisada sobre posicionamento dos elementos...

Compartilhar este post


Link para o post
Compartilhar em outros sites

@DiF Sim, eu consegui, obrigado

Compartilhar este post


Link para o post
Compartilhar em outros sites

Crie uma conta ou entre para comentar

Você precisar ser um membro para fazer um comentário

Criar uma conta

Crie uma nova conta em nossa comunidade. É fácil!

Crie uma nova conta

Entrar

Já tem uma conta? Faça o login.

Entrar agora





Sobre o Clube do Hardware

No ar desde 1996, o Clube do Hardware é uma das maiores, mais antigas e mais respeitadas publicações sobre tecnologia do Brasil. Leia mais

Direitos autorais

Não permitimos a cópia ou reprodução do conteúdo do nosso site, fórum, newsletters e redes sociais, mesmo citando-se a fonte. Leia mais

×