Jump to content

HTML website help

GeorgeKellow

I need to add an interactive date and time function in my website. I am using brackets to code, does anyone know what code I would need to type in to make it work.

 

 

Link to comment
Share on other sites

Link to post
Share on other sites

When you say interactive, what do you exatly mean. If it is a form input the you will likely want to use a server side programming language (*cough* php *cough*).

Link to comment
Share on other sites

Link to post
Share on other sites

14 minutes ago, hazel1919 said:

Plus why don't you show us what you have at the moment? It will give us a better idea of what you are aiming for.

[ code ] 

<!DOCTYPE html>
<html>


    <link rel="stylesheet" type="text/css" href="Heading_CSS.css"/>

<head>
<title>That's Great Home Page</title>

</head>
<body>
    <!-- Header section -->
    <a href="That's%20Great%20Home%20Page.html"><div style="position:absolute;
                top:0px;
                left:0px;
                width:100%;
                Height:170px;
                Border:2px solid black;
                Background-color: White;"><h1 style="color: limegreen;font-size: 140px;font-family:Sans-serif;"><center>That's Great!</center></h1>
        <img src="Images/LOGO.jpg" alt="That's Great! logo" style="width:240px;height:140px;position:absolute;top:10px;right:0px">  </div></a>


    <!-- Chef image and bios -->
    <div style="position:absolute;
                top:200px;
                left:70%;">
        <a href="Bios%20Page.html"><img src="Images/GR.jpg" alt="Chef Ramsey" style="width:448px;height:480px">
        </a>
        <p class="quote">Every sandwhich is hand crafted by our chef</p>
    </div>


     
    
    
<div style="position:absolute;
            top:200px;
            left:20px;
            width:10%;">
    <a href="Pre-Made%20Sandwiches%20Page.html"><p id="rcorners">Pre-Made sandwiches</p></a>

    
    </div>    
    
    
    <div style="position:absolute;
            top:200px;
            left:225px;
            width:10%;">
        <a href="Make%20your%20own.html"><p id="rcorners">Make your own</p></a>
   
    
    </div>   
    <div style="position:absolute;
            top:200px;
            left:430px;
            width:10%;">
        <a href="Check-out.html"><p id="rcorners">Check-out</p></a>
    
    
    </div>    
    <div style="position:absolute;
            top:200px;
            left:635px;
            width:10%;">
        <a href="Contact%20us.html"><p id="rcorners">Contact us</p></a>
    
    </div>    
    
    <div style="position:absolute;
                top:500px;
                left:10px;">
    <p id="demo"></p>

<script>
document.getElementById("demo").innerHTML = New Date(year, month, day, hours, minutes);
</script>
    </div>
    
    
</body>
</html>

[ /code ] 

Link to comment
Share on other sites

Link to post
Share on other sites

use code tags please.

                     ¸„»°'´¸„»°'´ Vorticalbox `'°«„¸`'°«„¸
`'°«„¸¸„»°'´¸„»°'´`'°«„¸Scientia Potentia est  ¸„»°'´`'°«„¸`'°«„¸¸„»°'´

Link to comment
Share on other sites

Link to post
Share on other sites

Just now, vorticalbox said:

use code tags please.

I have no idea what that is. I'm so shit a coding. My friend did 90% of this 

Link to comment
Share on other sites

Link to post
Share on other sites

1 minute ago, GeorgeKellow said:

I have no idea what that is. I'm so shit a coding. My friend did 90% of this 

[ code ] [ /code ]

                     ¸„»°'´¸„»°'´ Vorticalbox `'°«„¸`'°«„¸
`'°«„¸¸„»°'´¸„»°'´`'°«„¸Scientia Potentia est  ¸„»°'´`'°«„¸`'°«„¸¸„»°'´

Link to comment
Share on other sites

Link to post
Share on other sites

1 minute ago, GeorgeKellow said:

I have no idea what that is. I'm so shit a coding. My friend did 90% of this 

When you post to the forums, you have a "Code" option above.

Link to comment
Share on other sites

Link to post
Share on other sites

Just now, vorticalbox said:

[ code ] [ /code ]

Is that all I got to do? put [ code ] at the start and [ /code ] at the end? 

Link to comment
Share on other sites

Link to post
Share on other sites

First of all try to extract your styling with the HTML. Use CSS for that.

Link to comment
Share on other sites

Link to post
Share on other sites

Just now, Tristanus said:

First of all try to extract your styling with the HTML. Use CSS for that.

I've got that page 

Link to comment
Share on other sites

Link to post
Share on other sites

1 minute ago, Tristanus said:

First of all try to extract your styling with the HTML. Use CSS for that.

I think getting the link tag INSIDE THE HEAD tag would also be a good place to start.

Link to comment
Share on other sites

Link to post
Share on other sites

Just now, GeorgeKellow said:

I've got that page 

Yes I just saw you included a css file.

 

But this is still styled inline: 

 <div style="position:absolute;
            top:200px;
            left:20px;
            width:10%;">
    <a href="Pre-Made%20Sandwiches%20Page.html"><p id="rcorners">Pre-Made sandwiches</p></a> 

Try to avoid that.

Link to comment
Share on other sites

Link to post
Share on other sites

1 minute ago, hazel1919 said:

I think getting the link tag INSIDE THE HEAD tag would also be a good place to start.

OMG I didnt even see that hahaha.

Link to comment
Share on other sites

Link to post
Share on other sites

Just now, GeorgeKellow said:

Someone copy and paste it correctly so I can edit it xD 

This is what you got now:

    <link rel="stylesheet" type="text/css" href="Heading_CSS.css"/>
<head>
<title>That's Great Home Page</title>
</head>

 

Now do this:

 

    
<head>
 	<link rel="stylesheet" type="text/css" href="Heading_CSS.css"/>
	<title>That's Great Home Page</title>
</head>

To INCLUDE files or libraries, always do it inside the <head> tags ;)

Link to comment
Share on other sites

Link to post
Share on other sites

5 hours ago, GeorgeKellow said:

Is that all I got to do? put [ code ] at the start and [ /code ] at the end? 

They told you [ code ] [ /code ] with spaces so that it would show up in the forum post. You need to remove those spaces to actually make the tags work.

 

It's not entirely clear yet what sort of date/time functionality you want the site to have, but most examples I can think of require some Javascript to actually work. The HTML is just interface and structural elements, such as date and time fields for the user to type information, for example:

<form name="myForm">
	<input type="date">
	<input type="time">
</form>

But if you want them to actually do anything when submitted, that's likely to require scripting.

Link to comment
Share on other sites

Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

×