The Web Design Group

... Making the Web accessible to all.

Welcome Guest ( Log In | Register )

> How to make a comment section form (HTML CSS), HTML CSS Form
UniqueCrafts
post Mar 27 2023, 02:07 AM
Post #1





Group: Members
Posts: 2
Joined: 27-March 23
Member No.: 28,876
Hello,

I have created a simple form with HTML and CSS, but now I need to connect it somehow so it can turn the filled in data into a comment that will appear on my website.

Can someone please help me with this? (just started with HTML and CSS)
If that's not possible, can I just connect it to an email address so the filled in data will end up there?
Or if I need to change the code completely, that's fine by me as well.

This is the code I have now:


<!DOCTYPE html>
<html>
<body>

<div class="div">
<form action="/action_page.php" class="form">
<label for="fname">First Name</label>
<input type="text" id="fname" name="firstname" placeholder="Your name..">

<label for="lname">Last Name</label>
<input type="text" id="lname" name="lastname" placeholder="Your last name..">

<label for="comment">Leave a comment (Where are you from?)</label>
<input type="text" id="comment" name="comment" placeholder="Comment..">
<input type="submit" value="Submit">

</form>
</div>

</body>


</html>


CSS:


.form input[type=text], select {
width: 100%;
padding: 12px 20px;
margin: 8px 0;
display: inline-block;
border: 1px solid #ccc;
border-radius: 4px;
box-sizing: border-box;
}

.form input[type=submit] {
width: 100%;
background-color: rgb(106, 184, 252);
color: white;
padding: 14px 20px;
margin: 8px 0;
border: solid;
border-radius: 4px;
cursor: pointer;
transition: background-color 0.2s,
color 0.2s;
transition: box-shadow 0.2s;
}

.form input[type=submit]:hover {
background-color: white;
color: rgb(116, 116, 235);
color: rgb(116, 116, 235);
box-shadow: 4px 4px 10px rgba(0, 0, 0, 0.25)
}

div {
border-radius: 5px;
background-color: rgb(171, 213, 250);
padding: 20px;
width: 800px;
margin-top: 20px;
margin-bottom: 20px;
}
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
 
 Reply to this topicStart new topic
Replies
Christian J
post Mar 27 2023, 01:09 PM
Post #2


.
********

Group: WDG Moderators
Posts: 9,661
Joined: 10-August 06
Member No.: 7
QUOTE(UniqueCrafts @ Mar 27 2023, 09:07 AM) *

can I just connect it to an email address so the filled in data will end up there?

That might be the best solution, actually: there are readymade email form scripts, you don't need any kind of database and you can premoderate user submissions before they get published on your website.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
pandy
post Mar 27 2023, 01:40 PM
Post #3


🌟Computer says no🌟
********

Group: WDG Moderators
Posts: 20,733
Joined: 9-August 06
Member No.: 6
Still requires server side. Well, if mailto isn't used.

There used to be hosted services that had comments. But I have a feeling that kind of things have died?
User is online!PM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
Christian J
post Mar 27 2023, 02:11 PM
Post #4


.
********

Group: WDG Moderators
Posts: 9,661
Joined: 10-August 06
Member No.: 7
There are a few problems with email comments too:

1. If the user doesn't notice that it's an email comment he may wonder why his comment doesn't show up right away, and repost it again and again.

2. If OTOH the user sees that it's an email comment he may believe it's a private message, and become annoyed that it's later published on the website.

3. If the site contains multiple pages with comment forms, each email needs to indicate which form posted it (maybe also the time and date).

QUOTE(pandy @ Mar 27 2023, 08:40 PM) *

Still requires server side. Well, if mailto isn't used.

All paid webhosts should offer PHP though, maybe also readymade scripts in the support area.

QUOTE
There used to be hosted services that had comments. But I have a feeling that kind of things have died?

A free blog service perhaps? unsure.gif

User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post

Posts in this topic
UniqueCrafts   How to make a comment section form (HTML CSS)   Mar 27 2023, 02:07 AM
pandy   It's possible. That's how for example comm...   Mar 27 2023, 02:39 AM
UniqueCrafts   It's possible. That's how for example com...   Mar 27 2023, 02:53 AM
Christian J   At the most basic, you could write the comments to...   Mar 27 2023, 05:39 AM
pandy   Yeah, I googled. There seems to be quite a few aro...   Mar 27 2023, 10:35 AM
Christian J   can I just connect it to an email address so the ...   Mar 27 2023, 01:09 PM
pandy   Still requires server side. Well, if mailto isn...   Mar 27 2023, 01:40 PM
Christian J   There are a few problems with email comments too: ...   Mar 27 2023, 02:11 PM

« Next Oldest · Markup (HTML, XHTML, XML) · Next Newest »
 

Reply to this topicStart new topic
1 User(s) are reading this topic (1 Guests and 0 Anonymous Users)
0 Members:

 

Display Mode: Switch to: Standard · Switch to: Linear+ · Outline

Track this topic · Email this topic · Print this topic · Subscribe to this forum

- Lo-Fi Version Time is now: 27th April 2024 - 12:23 PM
Invision Power Board © 2024  IPS, Inc.
Licensed to: HTMLHelp.com, LLC