School Assignment? Project Due Tomorrow? Chat LIVE With A Programming Expert!

Programming Help

Web Development



What's Here?

  • Members: 300,419
  • Replies: 826,023
  • Topics: 137,455
  • Snippets: 4,419
  • Tutorials: 1,148
  • Total Online: 1,502
  • Members: 89
  • Guests: 1,413

Welcome to Dream.In.Code
Become an Expert!

Join 300,419 Programmers for FREE! Get instant access to thousands of experts, tutorials, code snippets, and more! There are 1,502 people online right now. Registration is fast and FREE... Join Now!




So I made my three .html files, now how do I make a menu?

 

So I made my three .html files, now how do I make a menu?
papuccino1

2 Jul, 2009 - 02:39 PM
Post #1

C# Programmer
Group Icon

Joined: 2 Mar, 2008
Posts: 943



Thanked: 33 times
Dream Kudos: 50
My Contributions
You can see the sites here:

EDIT: There is an index.html but I didn't include it because it'll be dramatically changed once I learn how to make a menu. tongue.gif

http://papuccino1.exofire.net/aboutme.html

http://papuccino1.exofire.net/contactme.html

http://papuccino1.exofire.net/currentprojects.html


Can someone actually do this for me? I've had so many people try to help me out but I can't find a working example that doesn't use frames. I would be eternally grateful because this working example with my files would help me a lot through the learning process.

People have suggested using PHP (Don't have a clue how to use it), but I should be proficient in HTML before charging with PHP, right?

I know you pro's could do this in 2 minutes flat. tongue.gif

This post has been edited by papuccino1: 2 Jul, 2009 - 02:44 PM

User is offlineProfile CardPM
+Quote Post


neit

RE: So I Made My Three .html Files, Now How Do I Make A Menu?

2 Jul, 2009 - 02:57 PM
Post #2

D.I.C Head
**

Joined: 13 Feb, 2009
Posts: 137



Thanked: 12 times
My Contributions
What are you actually looking for :

Option 1)
1 menu on each page which you have to update each page

Option 2)
only one menu included into each page so if you needed
to added a new link you only need to do it in one place.

You could do this in a number of ways but perhaps the easiest would be use php does your host support this?

Would the menu be going above the current banner headers?
User is offlineProfile CardPM
+Quote Post

papuccino1

RE: So I Made My Three .html Files, Now How Do I Make A Menu?

2 Jul, 2009 - 03:08 PM
Post #3

C# Programmer
Group Icon

Joined: 2 Mar, 2008
Posts: 943



Thanked: 33 times
Dream Kudos: 50
My Contributions
Yep. I want the menu to go above the <h1> headers I made. My host supports PHP but like I said, I know diddly-squat about PHP. Could you guide me a bit?
User is offlineProfile CardPM
+Quote Post

neit

RE: So I Made My Three .html Files, Now How Do I Make A Menu?

2 Jul, 2009 - 03:20 PM
Post #4

D.I.C Head
**

Joined: 13 Feb, 2009
Posts: 137



Thanked: 12 times
My Contributions
1) First you will need to change your file types to php.
So either rename the file extensions from html to php or just save new ones
as php files.

2) create a new file.

CODE


<div id="menu">

<a href="name of link">Link 1</a>
<a href="name of link">Link 2</a>
<a href="name of link">Link 3</a>

</div>



Save this file as menu.html

Then in each page you want the menu to appear type the following above the header.

<?php require ("menu.html"); ?>

Some people will use include instead of require.

So any time you want to add a new link to them just open menu.html and add the new link.

Remember to style the menu div to fit with your site.

This post has been edited by neit: 2 Jul, 2009 - 03:21 PM
User is offlineProfile CardPM
+Quote Post

papuccino1

RE: So I Made My Three .html Files, Now How Do I Make A Menu?

2 Jul, 2009 - 04:29 PM
Post #5

C# Programmer
Group Icon

Joined: 2 Mar, 2008
Posts: 943



Thanked: 33 times
Dream Kudos: 50
My Contributions
I'll test this and see if it works. biggrin.gif Thank you so much for the help.

One question though...

Why if PHP is like an upgrade of HTML, should anyone use HTML at all? :S (Probably a dumb question to you but I really am new to this)
User is offlineProfile CardPM
+Quote Post

neit

RE: So I Made My Three .html Files, Now How Do I Make A Menu?

2 Jul, 2009 - 04:40 PM
Post #6

D.I.C Head
**

Joined: 13 Feb, 2009
Posts: 137



Thanked: 12 times
My Contributions
php is a server side scripting language and executes on the server.
html runs on the browser and is more the structure.

Usually php is used with mysql database to create dynamic database websites.

so with a php file you cannot browse to c:\\mydocuments\website\test.php and display it in the browser all you will see is code.

If its running on server that supports php the code will execute and produce your desired results.

so to include the menu file you can use php.
It serves the same function as asp.
You could also do this with asp server side includes if your host supports
them if your more comfortable with that.

This post has been edited by neit: 2 Jul, 2009 - 04:44 PM
User is offlineProfile CardPM
+Quote Post

papuccino1

RE: So I Made My Three .html Files, Now How Do I Make A Menu?

2 Jul, 2009 - 04:47 PM
Post #7

C# Programmer
Group Icon

Joined: 2 Mar, 2008
Posts: 943



Thanked: 33 times
Dream Kudos: 50
My Contributions
Thanks for the answer biggrin.gif

I must be doing something wrong though.

Here is my contactme.php file (I changed the extension from html to php):

CODE
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html>
    <head>
        <title>Sergio Tapia Gutierrez - Contact Information</title>
        <link rel="stylesheet" type="text/css" href="web.css" />
        <meta name="description" content="Sergio Tapia Gutierrez - Contact Information" />
    </head>
    
    <body>
        <?php require ("menu.html"); ?>

        <h1>Contact Information</h1>
        
        <p>Please send any questions/comments/feedback to any of the emails provided below.<br />
        I would appreciate it if you used my GMail adress, but the choice is ultimately yours.</p>
        
        <p>I usually respond to emails in 1 business day.</p>
        
        <h2>GMail</h2>
        <p><a href="mailto:papuccino1@gmail.com">papuccino1@gmail.com</a></p>
        
        <h2>Skype</h2>
        <p>sergio.tapia.gutierrez</p>
        
        <h2>MSN</h2>
        <p><a href="mailto:kineticshampoo@hotmail.com">kineticshampoo@hotmail.com</a></p>
        
        <h2>Yahoo</h2>
        <p><a href="mailto:sergiospics@yahoo.com">sergiospics@yahoo.com</a></p>
    </body>
</html>



And here is my menu.html file:

CODE
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html>

    <head>
        <title>Sergio Tapia's Home Page</title>
        <link rel="stylesheet" type="text/css" href="web.css" />
        
        <meta name="description" content="Sergio Tapia - Porfolio, Projects, Resources and Contact Information." />
    </head>

    <body>
    <div id="menu">

    <a href="contactme.php">Contact</a>
    <a href="aboutme.php">About Me</a>
    <a href="currentprojects.php">Current Projects</a>

    </div>
    </body>

</html>


However nothing is added when I refresh the site. Is it because I'm testing this on my local machine without using the internet? sad.gif

Please help! biggrin.gif
User is offlineProfile CardPM
+Quote Post

neit

RE: So I Made My Three .html Files, Now How Do I Make A Menu?

3 Jul, 2009 - 07:05 AM
Post #8

D.I.C Head
**

Joined: 13 Feb, 2009
Posts: 137



Thanked: 12 times
My Contributions
your menu.html file should only have the following and nothing else.

CODE

<div id="menu">

    <a href="contactme.php">Contact</a>
    <a href="aboutme.php">About Me</a>
    <a href="currentprojects.php">Current Projects</a>

    </div>


So not html body tags etc in the menu.html file.

Once done could you upload to your site and provide a link so I can view

This post has been edited by neit: 3 Jul, 2009 - 07:08 AM
User is offlineProfile CardPM
+Quote Post

ghqwerty

RE: So I Made My Three .html Files, Now How Do I Make A Menu?

3 Jul, 2009 - 07:21 AM
Post #9

if($spareTime > 0){ $this->writeCode(); }
Group Icon

Joined: 8 Aug, 2008
Posts: 748



Thanked: 24 times
Dream Kudos: 25
My Contributions
and to give you an answer about inclued vs require (i might get this the wrong way round but here goes)

if the require can-not find the required page it will stop executing the script whereas include will continue to run the script which isnt advised as this could damage your db if it doesnt have the correct info from the required page.
User is offlineProfile CardPM
+Quote Post

papuccino1

RE: So I Made My Three .html Files, Now How Do I Make A Menu?

3 Jul, 2009 - 03:20 PM
Post #10

C# Programmer
Group Icon

Joined: 2 Mar, 2008
Posts: 943



Thanked: 33 times
Dream Kudos: 50
My Contributions
Thank you for helping me out. biggrin.gif

It still doesn't show.

Here's my contactme.php file:

html
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html>
	<head>
		<title>Sergio Tapia Gutierrez - Contact Information</title>
		<link rel="stylesheet" type="text/css" href="web.css" />
		<meta name="description" content="Sergio Tapia Gutierrez - Contact Information" />
	</head>
	
	<body>
		<?php require ("menu.html"); ?>

		<h1>Contact Information</h1>
		
		<p>Please send any questions/comments/feedback to any of the emails provided below.<br />
		I would appreciate it if you used my GMail adress, but the choice is ultimately yours.</p>
		
		<p>I usually respond to emails in 1 business day.</p>
		
		<h2>GMail</h2>
		<p><a href="mailto:papuccino1@gmail.com">papuccino1@gmail.com</a></p>
		
		<h2>Skype</h2>
		<p>sergio.tapia.gutierrez</p>
		
		<h2>MSN</h2>
		<p><a href="mailto:kineticshampoo@hotmail.com">kineticshampoo@hotmail.com</a></p>
		
		<h2>Yahoo</h2>
		<p><a href="mailto:sergiospics@yahoo.com">sergiospics@yahoo.com</a></p>
	</body>
</html>



And here's the menu.html:

html
<div id="menu">

<a href="contactme.php">Contact</a>
<a href="aboutme.php">About Me</a>
<a href="currentprojects.php">Current Projects</a>

</div>



The only time I reference menu.html from inside my contactme.php file is the line directly after the <body> tag. Please check if I'm doing it right.

Thank you!
User is offlineProfile CardPM
+Quote Post

neit

RE: So I Made My Three .html Files, Now How Do I Make A Menu?

3 Jul, 2009 - 03:25 PM
Post #11

D.I.C Head
**

Joined: 13 Feb, 2009
Posts: 137



Thanked: 12 times
My Contributions
Can you post me a link to it online.

I have copied the code you provided above and it is fine.

You can see the outcome here

I have also copied your stylesheet.

You can see the menu top left, you can style the menu further to suit your needs.

This post has been edited by neit: 3 Jul, 2009 - 03:36 PM
User is offlineProfile CardPM
+Quote Post

papuccino1

RE: So I Made My Three .html Files, Now How Do I Make A Menu?

3 Jul, 2009 - 05:16 PM
Post #12

C# Programmer
Group Icon

Joined: 2 Mar, 2008
Posts: 943



Thanked: 33 times
Dream Kudos: 50
My Contributions
That is SO wierd! The menu shows fine on your site, but it doesn't when I test it by opening the contactme.php file in firefox. Is it because I'm testing it offline? :S

Edit: Aha! So it was because I was testing it offline! But I have a major question. Is there no way to test my websites without using the internet?!

Thanks for all your help Neit, truly wonderful work. biggrin.gif

This post has been edited by papuccino1: 3 Jul, 2009 - 05:27 PM
User is offlineProfile CardPM
+Quote Post

neit

RE: So I Made My Three .html Files, Now How Do I Make A Menu?

4 Jul, 2009 - 05:12 AM
Post #13

D.I.C Head
**

Joined: 13 Feb, 2009
Posts: 137



Thanked: 12 times
My Contributions
You won't be able to test it locally unless your running a server that supports
php locally.

If I am running php scripts locally I use xampp.

It installs apache webserver, php and mysql

html and javascript files can be tested offline as they do not require a server.
php and other server side scripting languages require a local server.

If you install xampp on a windows machine you will need to the files
you to test into the htdocs folder path: C:\xampp\htdocs I usually create another folder in here for each project I am working on.

You then start the apache server and and type the address into the address bar.
Example:
http://localhost/papuccino1/contactme.php

would display the page located at
C:\xampp\htdocs\papuccino1\contactme.php

The php scripts would run.

Hope that helps.

You can style the menu and separate the links a little further your site.

This post has been edited by neit: 4 Jul, 2009 - 05:13 AM
User is offlineProfile CardPM
+Quote Post

Fast ReplyReply to this topicStart new topic

Time is now: 11/7/09 11:49PM
Invision Power Board v2.1.7 © 2009  IPS, Inc.
Licensed to: MediaGroup1

Live Help!

Be Social

Dream.In.Code RSS Feed Dream.In.Code LinkedIn Group Follow Us On Twitter Fan Us On Facebook

Tutorials

Programming

Web Development

Reference Sheets

Code Snippets

DIC Chatroom

Bye Bye Ads

Monthly Drawing

Thumb Drive

Top Contributors

Top 10 Kudos This Month