HTML/CSS How can I implement a website using HTML and CSS without functionality?

Click For Summary
To implement a website using HTML and CSS without functionality, one can either use a web design editor or write directly in text files. Key components include using the <style> tag in the <head> section for CSS and structuring content within the <body> section using HTML elements. Issues discussed include the proper use of attributes like rowspan in tables and the importance of setting image dimensions to control layout. The conversation also highlights the use of padding for spacing and the necessity of linking to valid image sources. Overall, the thread emphasizes foundational HTML and CSS techniques for creating a static website layout.
  • #91
Klaas van Aarsen said:
I think we cannot test php on w3schools. :unsure:
We may need our own server that executes our php code. 🤔
Then again, there may be online php test locations.

Do I have to download something? Or how does this work? 🧐
 
Technology news on Phys.org
  • #92
evinda said:
Do I have to download something? Or how does this work?

I've found a php compiler on w3schools now.
However, it doesn't seem to give us the option to create an html form and submit from there. :unsure:

If we want our own local web server, we can install apache. 🤔
 
  • #93
I have Apache installed on my system and I was able to create a search box so that the submit button runs a php script in cgi-bin:

1617404564347.png


1617404598199.png

:cool:
 
  • #94
Klaas van Aarsen said:
I have Apache installed on my system and I was able to create a search box so that the submit button runs a php script in cgi-bin:

View attachment 11045

https://www.physicsforums.com/attachments/11046
:cool:
Downloading Apache we get a file Apache -> httpd-2.4.35 -> httpd-2.4.35-o102p-x64-vc14 (and one httpd-2.4.35-o102p-x86-vc14 ) -> Apache24. In the last one there are several files. Do we save the php file that we write in the file "cgi-bin"? And where do we save the html file? Also there? 🧐
 
  • #95
evinda said:
Downloading Apache we get a file Apache -> httpd-2.4.35 -> httpd-2.4.35-o102p-x64-vc14 (and one httpd-2.4.35-o102p-x86-vc14 ) -> Apache24. In the last one there are several files. Do we save the php file that we write in the file "cgi-bin"? And where do we save the html file? Also there?
The html file should go to something like a /www/html/ directory, where there should already be an index.html file. 🤔
 
  • #96
Klaas van Aarsen said:
The html file should go to something like a /www/html/ directory, where there should already be an index.html file. 🤔

In the Apache24 file there is "htdocs" which includes an index.html file. Do you mean to save my html file there? :unsure:
 
  • #97
evinda said:
In the Apache24 file there is "htdocs" which includes an index.html file. Do you mean to save my html file there?
Yep. (Nod)
 
  • #98
Klaas van Aarsen said:
Yep. (Nod)

It doesn't work (Sweating)

I get:
1617441949100.png
I saved the two files like this:

1617442073968.png


1617442103685.png


Is this wrong? 🧐
 
  • #99
evinda said:
It doesn't work
I saved the two files like this:

Is this wrong?
That is correct. (Nod)

What do you get if you open http://localhost or http://localhost/index.html in your browser? 🤔
If Apache is working you should get a standard apache html page that shows 'It works!'
If that works, what do you get if you open http://localhost/example.html? 🤔
 
  • #100
Klaas van Aarsen said:
What do you get if you open http://localhost or http://localhost/index.html in your browser? 🤔
If Apache is working you should get a standard apache html page that shows 'It works!'
If that works, what do you get if you open http://localhost/example.html? 🤔

It doesn't work... I get:

1617449557426.png
 
Last edited:
  • #101
evinda said:
It doesn't wotk. I get:
Then you're not running apache yet.
Can you open the apache application?

Apparently one way to do it on Windows, is to open a command prompt, and type:
Code: 
cd ...\Apache24\bin
httpd.exe
where ... should be replaced by the location where you have Apache.
It's explained in the readme_first.html file that is in the top directory. 🤔
 
Last edited:
  • #102
Klaas van Aarsen said:
Then you're not running apache yet.
Can you open the apache application?

Apparently one way to do it on Windows, is to open a command prompt, and type:
Code: 
cd ...\Apache24\bin
httpd.exe
where ... should be replaced by the location where you have Apache.
It's explained in the readme_first.html file that is in the top directory. 🤔

Which of the following files do we use? 🤔

1617473678548.png
 
  • #103
evinda said:
Which of the following files do we use?
Those look the same. :unsure:
Perhaps one of them is a .zip file and the other is the unzipped version.
In that case we need the one that is unzipped.
Either way, we'll find out if we open a command prompt. 🤔

If I do it on my Windows I get:
1617474085303.png
 
  • #104
evinda said:
Which of the following files do we use?
Oh wait. (Wait)
I see now that one is for x64 and the other is for x86.
The first would be a 64-bit version and the other is a 32-bit version.
Either should work. 🤔
 
  • #105
Klaas van Aarsen said:
Those look the same. :unsure:
Perhaps one of them is a .zip file and the other is the unzipped version.
In that case we need the one that is unzipped.
Either way, we'll find out if we open a command prompt. 🤔

If I do it on my Windows I get:
View attachment 11052

I get:

httpd: Syntax error on line 39 of C:/Users/evinda/Desktop/Apache/httpd-2.4.35/httpd-2.4.35-o102p-x86-vc14/Apache24/conf/httpd.conf: ServerRoot must be a valid directory

🧐
 
  • #106
evinda said:
I get:

httpd: Syntax error on line 39 of C:/Users/evinda/Desktop/Apache/httpd-2.4.35/httpd-2.4.35-o102p-x86-vc14/Apache24/conf/httpd.conf: ServerRoot must be a valid directory
We have to edit that httpd.conf file.
It contains
Code: 
Define SRVROOT "/Apache24"

I've changed mine to:
Code: 
Define SRVROOT "C:\Users\vanaarse\Downloads\httpd-2.4.46-o111k-x86-vc15\Apache24"
and it works now. 🤔
 
  • #107
Klaas van Aarsen said:
I've changed mine to:
Code: 
Define SRVROOT "C:\Users\vanaarse\Downloads\httpd-2.4.46-o111k-x86-vc15\Apache24"
and it works now. 🤔

So we just write "C:\Users\evinda\Desktop\Apache\httpd-2.4.35\httpd-2.4.35-o102p-x86-vc14\Apache24>"... We don't have to edit something else, do we? 🧐

When we get no error, it means that it works, right? 🤔

What do we do next? 🧐
 
  • #108
evinda said:
So we just write "C:\Users\evinda\Desktop\Apache\httpd-2.4.35\httpd-2.4.35-o102p-x86-vc14\Apache24>"... We don't have to edit something else, do we?

When we get no error, it means that it works, right?

What do we do next?
Open http://localhost in your browser and see if an apache web page shows up.
And if you have your example.html in the correct htdocs directory, we can also try http://localhost/example.html. 🤔

Btw, there should not be a '>' at the end of the path. :eek:
 
  • #109
Klaas van Aarsen said:
Open http://localhost in your browser and see if an apache web page shows up.
And if you have your example.html in the correct htdocs directory, we can also try http://localhost/example.html. 🤔

I open http://localhost and I get:

1617478889051.png


So it still doesn't work, right? (Sweating)

Klaas van Aarsen said:
Btw, there should not be a '>' at the end of the path. :eek:
I wrote:

cd C:\Users\evinda\Desktop\Apache\httpd-2.4.35\httpd-2.4.35-o102p-x86-vc14\Apache24

and I got:

C:\Users\evinda\Desktop\Apache\httpd-2.4.35\httpd-2.4.35-o102p-x86-vc14\Apache24> 🧐
 
  • #110
evinda said:
I open http://localhost and I get:

So it still doesn't work, right?

I wrote:
cd C:\Users\evinda\Desktop\Apache\httpd-2.4.35\httpd-2.4.35-o102p-x86-vc14\Apache24
and I got:
C:\Users\evinda\Desktop\Apache\httpd-2.4.35\httpd-2.4.35-o102p-x86-vc14\Apache24>
Yes, but the '>' is not part of the path and must not be in the httpd.conf file.
It seems likely that is the reason that it does not work yet. 🤔

Furthermore, in the Apache24 directory there is a 'logs' directory that contains the file 'error.log'.
It will contain a line at the end that clarifies why apache does not work yet. 🤔
 
  • #111
Klaas van Aarsen said:
Yes, but the '>' is not part of the path and must not be in the httpd.conf file.
It seems likely that is the reason that it does not work yet. 🤔

Furthermore, in the Apache24 directory there is a 'logs' directory that contains the file 'error.log'.
It will contain a line at the end that clarifies why apache does not work yet. 🤔

In Apache directory I have:

1617480634957.png


In the log directory I have:

1617480665035.png


There is also a error directory which contains:

1617480693347.png


🧐 🧐 🧐
 
  • #112
evinda said:
In Apache directory I have:

In the log directory I have:

There is also a error directory which contains:
Ah, the error.log is not there yet because the path is wrong, so Apache can't write error.log to its proper location yet.
If we fix the path and run httpd.exe again, then the error.log file will appear in the 'logs' directory. 🤔
 
  • #113
Klaas van Aarsen said:
Ah, the error.log is not there yet because the path is wrong, so Apache can't write error.log to its proper location yet.
If we fix the path and run httpd.exe again, then the error.log file will appear in the 'logs' directory. 🤔

I wrote now:

C:\Users\evinda\Desktop\Apache\httpd-2.4.35\httpd-2.4.35-o102p-x86-vc14\Apache24\conf>httpd.conf

and then I got:

1617487757120.png


1617487848920.png


1617487986114.png


1617488079344.png


1617488131411.png


1617488175157.png


1617488270947.png


1617488325072.png

1617488366149.png


1617488414039.png


1617488463597.png


So Apache is working now, or not? 🧐
 
  • #114
evinda said:
I wrote now:
C:\Users\evinda\Desktop\Apache\httpd-2.4.35\httpd-2.4.35-o102p-x86-vc14\Apache24\conf>httpd.conf
and then I got:
So Apache is working now, or not?
I'm afraid not. :oops:

Let's go through it step by step.
  1. We start with the command prompt that you have.
    It shows C:\Users\evinda\Desktop\Apache\httpd-2.4.35\httpd-2.4.35-o102p-x86-vc14\Apache24\conf>.
  2. Type C:\Users\evinda\Desktop\Apache\httpd-2.4.35\httpd-2.4.35-o102p-x86-vc14\Apache24\conf> notepad httpd.conf, which will open the configuration file in notepad.
  3. Near the top, which is also in your first screenshot, there is a line that reads Define SRVROOT "/Apache24".
    Change that line to Define SRVROOT "C:\Users\evinda\Desktop\Apache\httpd-2.4.35\httpd-2.4.35-o102p-x86-vc14\Apache24"
  4. Save the file and close notepad.
  5. Type C:\Users\evinda\Desktop\Apache\httpd-2.4.35\httpd-2.4.35-o102p-x86-vc14\Apache24\conf> cd ..\bin.
  6. Type C:\Users\evinda\Desktop\Apache\httpd-2.4.35\httpd-2.4.35-o102p-x86-vc14\Apache24\bin> httpd.exe, which should start apache.
    The prompt will not return.
    Later on, if we want to, we can stop apache by pressing Ctrl+C, after which the prompt will return.
  7. Check if we can open http://localhost in the browser.
(Sweating)
 
  • #115
Klaas van Aarsen said:
I'm afraid not. :oops:

Let's go through it step by step.
  1. We start with the command prompt that you have.
    It shows C:\Users\evinda\Desktop\Apache\httpd-2.4.35\httpd-2.4.35-o102p-x86-vc14\Apache24\conf>.
  2. Type C:\Users\evinda\Desktop\Apache\httpd-2.4.35\httpd-2.4.35-o102p-x86-vc14\Apache24\conf> notepad httpd.conf, which will open the configuration file in notepad.
  3. Near the top, which is also in your first screenshot, there is a line that reads Define SRVROOT "/Apache24".
    Change that line to Define SRVROOT "C:\Users\evinda\Desktop\Apache\httpd-2.4.35\httpd-2.4.35-o102p-x86-vc14\Apache24"
  4. Save the file and close notepad.
  5. Type C:\Users\evinda\Desktop\Apache\httpd-2.4.35\httpd-2.4.35-o102p-x86-vc14\Apache24\conf> cd ..\bin.
  6. Type C:\Users\evinda\Desktop\Apache\httpd-2.4.35\httpd-2.4.35-o102p-x86-vc14\Apache24\bin> httpd.exe, which should start apache.
    The prompt will not return.
    Later on, if we want to, we can stop apache by pressing Ctrl+C, after which the prompt will return.
  7. Check if we can open http://localhost in the browser.
(Sweating)

It works now! (Clapping)

So to run the program I save the html file in the "htdocs" directory and the php in the "cgi-bin" directory, right? 🧐

1617490693745.png
 
  • #116
evinda said:
It works now!
Nice. (Sun)

evinda said:
So to run the program I save the html file in the "htdocs" directory and the php in the "cgi-bin" directory, right?
Yep. (Nod)
 
  • #117
Klaas van Aarsen said:
Yep. (Nod)

I open http://localhost/example.html and after giving the input I get:
1617491926492.png
I saved the two files as follows in the directory we said in the previous post:
1617491994715.png


1617492023609.png


At the logs directory there is now a file with the name "error":
1617492065660.png


And in this file I get:

[Sun Apr 04 01:51:22.887386 2021] [ssl:warn] [pid 17024:tid 540] AH01909: localhost:443:0 server certificate does NOT include an ID which matches the server name
[Sun Apr 04 01:51:23.427353 2021] [ssl:warn] [pid 17024:tid 540] AH01909: localhost:443:0 server certificate does NOT include an ID which matches the server name
[Sun Apr 04 01:51:23.428355 2021] [mpm_winnt:notice] [pid 17024:tid 540] AH00455: Apache/2.4.35 (Win32) OpenSSL/1.0.2p configured -- resuming normal operations
[Sun Apr 04 01:51:23.428355 2021] [mpm_winnt:notice] [pid 17024:tid 540] AH00456: Server built: Sep 17 2018 21:34:44
[Sun Apr 04 01:51:23.428355 2021] [core:notice] [pid 17024:tid 540] AH00094: Command line: 'httpd.exe -d C:/Users/evinda/Desktop/Apache/httpd-2.4.35/httpd-2.4.35-o102p-x86-vc14/Apache24'
[Sun Apr 04 01:51:23.541351 2021] [mpm_winnt:notice] [pid 17024:tid 540] AH00418: Parent: Created child process 15708
[Sun Apr 04 01:51:26.324483 2021] [ssl:warn] [pid 15708:tid 584] AH01909: localhost:443:0 server certificate does NOT include an ID which matches the server name
[Sun Apr 04 01:51:26.496066 2021] [ssl:warn] [pid 15708:tid 584] AH01909: localhost:443:0 server certificate does NOT include an ID which matches the server name
[Sun Apr 04 01:51:26.501077 2021] [mpm_winnt:notice] [pid 15708:tid 584] AH00354: Child: Starting 64 worker threads. (Sweating)(Sweating)(Sweating)
 
  • #118
evinda said:
I open http://localhost/example.html and after giving the input I get:
I saved the two files as follows in the directory we said in the previous post:
At the logs directory there is now a file with the name "error":
And in this file I get:

It seems there is nothing relevant in the error.log file at this time. :confused:

What is the address in your browser after you submit the input?
Perhaps it does not match the location of the .php file?
It should be http://localhost/cgi-bin/action.php. 🤔
 
  • #119
Klaas van Aarsen said:
It seems there is nothing relevant in the error.log file at this time. :confused:

What is the address in your browser after you submit the input?
Perhaps it does not match the location of the .php file?
It should be http://localhost/cgi-bin/action.php. 🤔

No, it is http://localhost/action.php 🧐
 
  • #120
evinda said:
No, it is http://localhost/action.php
It is correct then that it cannot find it. 🧐

We need to modify example.html so that it says action="cgi-bin/action.php". (Sweating)
 

Similar threads

JavaScript What scripts do websites like unitednuclear.com use?
  • · Replies 3 ·
Replies
3
Views
2K
HTML/CSS Html5 <canvas> element related apps not working
  • · Replies 3 ·
Replies
3
Views
2K
HTML/CSS Where can I find free online resources to learn HTML, Javascript, and CSS?
  • · Replies 11 ·
Replies
11
Views
3K
HTML/CSS Getting Started with JavaScript and HTML for Website Development
  • · Replies 7 ·
Replies
7
Views
3K
Java Javascript reading files: how should I have asked?
  • · Replies 4 ·
Replies
4
Views
1K
HTML/CSS Is There a Way to Indent Tables in XHTML?
  • · Replies 3 ·
Replies
3
Views
3K
HTML/CSS Understanding XHTML Slide Show w/ Javascript & jQuery
  • · Replies 2 ·
Replies
2
Views
5K
HTML/CSS What HTML tag can I use to bypass category filters on my website?
  • · Replies 1 ·
Replies
1
Views
2K
Comp Sci How to Integrate XML and JavaScript in Web Development?
  • · Replies 22 ·
Replies
22
Views
2K
HTML/CSS HTML - counting the number of responses from a text file
  • · Replies 1 ·
Replies
1
Views
2K