HTML - We-based Email Code

Hello
I've searched the web for a simple form code that has a "submit" button, so that when a user clicks it I will receive an email with the submitted data - but - I want the user to click "submit" without being transferred to his default email program.
I want him only to enter the data and when he presses the button, the data will be sent to my email.

I want to put this code in a blog that supports HTML.
What code can I use for it?

I hope I made my question clear.
I will really be happy to receive your help.
Thank you very much.

Hi there,

I'm completely new to HTML and have no idea, coming from using Serif WebPlus, a pumped up Publisher some may say! Now, i downloaded a booking form (http://css-tricks.com/downloads/ scroll down till you see 'Step-by-Step Seminar Registration') It really is great, but i want to be able to get it to send the info collected to an email, how is this done?

Can a newb achieve this??

Hi All--

I wanted to code HTML email newsletter.

Can any1 help me out?

Thnx in advance...

YAY SOLVED THANKS TO COOTHEAD

This thing is driving me nuts... over the last 36 hours i, along with a helpfull member of this community have been trying to fix some SIMPLE code that wasnt broken in the first place.

It displays fine, when tested in Dreamweaver, tests fine in IE, FF.
The several adjusted codes even display fine inside the test previewer of the mail program on www.yourmailinglistprovider.com !

The trouble starts when the email HTML code gets sent to the Gmail & Hotmail inbox.
Both my inbox' are stuffed with test mails.. and it isnt going to end any time soon

I have CODE 2 that wont load up the CSS image tags.

And CODE 1 that wont display the text in its right position, not on top of the image, instead it shows it way down, like so:

http://img196.imageshack.us/img196/2625/frustration.jpg

So finally... i discovered, why.. the Gods have put me in this misfortune.
Google Mail is in BETA, and that means the following:

Quote:
Google Mail, LotusNotes, and Outlook 2007 present special coding problems. The good news? If you code to account for their oddities, your html email code is more likely to display well in most if not all email software.

Because Google cannot control how senders will code CSS and HTML, they have to take steps to ensure their application displays properly regardless of the code quality of the html email that is displayed.

As a result, Google Mail acts like an artifact of the mid 1990s when web standards were primitive. It takes some work, but it is possible to crack open a Google Mail page and see just how convoluted their approach is to rendering html email.

For one thing, Google Mail deletes any CSS style reference to a set of styles, no matter where it appears in the email. And fonts displayed in html tables have the odd habit of appearing larger than intended no matter how the html email is coded.
&#^&%$@3(*(2@#*&y#!!............................. Why

Now all my work ive put into this could be all for nothing,..
since I believe the solution given by the website is too far fetched for this amateur. The solution:


Quote:
Here are coding techniques that appear to work well in Google Mail and older email softwa

* Define the background color in a TD cell with bgcolor=, not the CSS style.
* Use the background= attribute in the TD cell for background images, not the CSS. A corollary is that the background image can be made as tall as needed. If the content of an email template might be short or tall depending on the email content, using an extra-tall background image this way lets the email layout height shrink or expand based on the height of the copy from one email to the next. Note, however, that Outlook 2007 ignores background images.
* If it works better, use the padding style to control margins within a TD cell. The margin style does not work in these cells. Padding does work.
* If a border around a TD cell is needed, Google Mail displays a border when defined in a DIV but not when defined as a border style in a TD tag.
* If a light colored link against a dark background color is needed, put the font definition in the TD cell (so it applies to P and A tags equally) then add a color= style to the A tag.
* If the P and A fonts appear to be different sizes, wrap the A tag in a P tag.
* Google Mail aggressively uses the right column of their interface which squeezes the html email into the center panel. Be sure the padding style in the content TDs is set at 10 pixels all round so text does not smash against the left and right edges.
* When testing an html email with a Google Mail account, it is likely one or more missing font styles in the TD, H1, H2, P, A, and other tags will be found. Inspect every font carefully to make sure Google Mail displays the fonts correctly.
SOURCE


I need either of these two amateuristic codes (they are basically the same) re-coded with the rules up above.
Could anyone who can do this fluently without breaking a sweat help me out?
I am near desperation and willing to transfer a fee to whatever paypal account.
I just need this mail template sent out asap. Thank you for reading.



CODE 1:

HTML Code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
   "http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
<head>
<base href="http://xx.com/">
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<meta name="language" content="english"> 
<meta http-equiv="Content-Style-Type" content="text/css">

<title></title>

<style type="text/css">
#container{ 
    width:711px;
    margin:auto;
    font-family:verdana,sans serif;
    font-size:16px;
	
    background-image:url(blokje.png); 
 } 
#pic {
    display:block;
 }
#content {
    padding:0 0 60px 50px;
    background-image:url(onderkantcurve.png);
    background-repeat:no-repeat;
    background-position:0 bottom;
 }
#p-one {
    font-weight:bold;
    color:#410d3e;
 }
#pic-one {
    text-align:center;
 }
#pic-one img {
    width:170px;
    height:190px;
 }
#link {
    font-size:12px;
 }
</style>

</head>
<body>
<p align="center"><font face="Verdana, Geneva, sans-serif" size="2"><a href="http://xx.com/template3.html">Klik hier voor de web-versie mocht de nieuwsbrief niet goed worden weergegeven.</a></font></p>
<div id="container">



<img id="pic" src="top.png" alt="">

<div id="content">

<p id="p-one">
 Nieuwsbrief februari 2010
</p><p><br>

Beste Lezer van mijn eerste nieuwsbrief,
</p><p>
Graag wil ik je opmerkzaam maken op de nieuwste activiteiten van <br>
Sessio Communications.
</p><br>

<p id="pic-one">
 <img src="koord.jpg" alt=""><br>

<a href="http://www.xx.com">www.xx.com</a>
</p><p>
<br>

 Ik nodig je van harte uit om <a href="http://www.xx.com">mijn website</a> te bezoeken.<br> 
 Reacties zijn welkom. Doorsturen naar andere belangstellenden mag. <br>
 <a href="[FORWARDTOFRIEND]">Stuur deze email door naar een vriend of vriendin.</a></p>

</p><p>
 Mocht je geen belangstelling hebben om op de hoogte te blijven van<br> 
 mijn verschillende workshops en trainingen dan kun je dat via de <br>
link onderaan de pagina aangeven. Je e-mail adres wordt dan verwijderd.
</p><p><br>

 Met vriendelijke groet,
</p>

</p>
</div>
</div>
<p align="center"><font face="Verdana, Geneva, sans-serif" size="2"><a href="http://ymlp154.com/u.php?YMLPID=gejseubgsguejeg"> Uitschrijven / Gegevens wijzigen </a></font></p>

</body>
</html>

CODE 2:

HTML Code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
   "http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
<head>
<base href="http://xx.com/">
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<meta name="language" content="english"> 
<meta http-equiv="Content-Style-Type" content="text/css">

<title></title>

<style type="text/css">
#container{ 
    position:relative;
    width:711px;
    height:910px;
    margin:auto;
    font-family:verdana,sans serif;
    font-size:16px;
 } 
#pic {
    position:absolute;
    top:0;
    left:0;
 }
#content {
    position:absolute;
    top:170px;
    left:50px;
    width:651px;
    height:680px;
 }
#p-one {
    font-weight:bold;
    color:#410d3e;
 }
#pic-one {
    text-align:center;
 }
#pic-one img {
    width:170px;
    height:190px;
 }
#link {
    font-size:12px;
 }
</style>

</head>
<body>

<p align="center"><font face="Verdana, Geneva, sans-serif" size="2"><a href="http://xx.com/template3.html">Klik hier voor de web-versie mocht de nieuwsbrief niet goed worden weergegeven.</a></font></p>

<div id="container">

<img id="pic" src="big.png" alt="">
<div id="content">
<p id="p-one">
 Nieuwsbrief Februari 2010
</p><p><br>
 Beste Lezer van mijn eerste nieuwsbrief,
</p><p>
Graag wil ik je opmerkzaam maken op de nieuwste activiteiten van <br>
Sessio Communications.
</p>
<p id="pic-one">
 <img src="koord.jpg" alt=""><br>

<a href="http://www.xx.com">www.xx.com</a>
</p><p>
<br>

 Ik nodig je van harte uit om <a href="http://www.xx.com">mijn website</a> te bezoeken.<br> 
 Reacties zijn welkom. Doorsturen naar andere belangstellenden mag. <br>
 <a href="[FORWARDTOFRIEND]">Stuur deze email door naar een vriend of vriendin.</a></p>

</p><p>
 Mocht je geen belangstelling hebben om op de hoogte te blijven van<br> 
 mijn verschillende workshops en trainingen dan kun je dat via de <br>
link onderaan de pagina aangeven. Je e-mail adres wordt dan verwijderd.
</p><p><br>

 Met vriendelijke groet,
</p>
</div>

</div>
<p align="center"><font face="Verdana, Geneva, sans-serif" size="2"><a href="http://ymlp154.com/u.php?YMLPID=gejseubgsguejeg"> Uitschrijven / Gegevens wijzigen </a></font></p>
</body>
</html>

Thanks for reading..

Hi,
I want to put in a form to get queries from the user, like so:

Name:
Email:
Comments:
'Send' button

and that it will send the information to my email address which is gmail?

Thanks

I need to know how to make an html/javascript based script to make a VERY simple address bar that acts exactly like the address bar on all web browsers. When you type in where you want to go.. well.. It takes you to the url you just typed in! No restrictions are needed (anti-porn for example) and I'm hoping it can be in the shape of a regular old form script that is easily editable.

Please don't ask why the hell I would need one but I just do.

Thanks in advance

Hello. =)

A few weeks ago, I made this thread saying that I'm (basically) still new to HTML...and now I'm forcing myself to use an HTML editor. (I decided to use KompoZer, and I've been using it for a few days.)

Right now, I'm playing around with it and trying to create different site layouts. I came up with a design (which involves using DIVs), but I'm really having some problems:

What the site is supposed to look like [GIF image]
What the site actually looks like (for now) [HTML document - CSS is embedded in the page]

...Truth be told I drew that picture first, then I went online and found a similar-looking layout (since I can't make one from scratch yet; I still don't really understand how DIVs+CSS work). So I tried modifying the layout as best I could, and I didn't do such a great job. ^^;

Anyway, I want the layout to be "liquid", so if you resize your browser everything shrinks nicely. But whenever I reduce my browser size, the header and footer start moving. How do I stop this from happening? Can anyone tell me the correct code I should be using?

Thanks in advance!!

PS:
1) You see those "white spaces" in the picture I drew? Well, I figure the best way to add those spaces is by modifying some background images, like what I did here. If I'm wrong, or you know a better way to do this, please tell me!!

2) If you scroll the HTML document, you might notice that it's hard to read the top line of text (because it's "hidden" behind the header DIV). I think the best way to solve this problem is by making the bottom of the header DIV transparent...or, by adding a second DIV at the bottom of the header, and then making that second DIV transparent. I heard you can use "filter:chroma" to do this, but for some reason I can't get it to work with hex colors OR pictures. =(

3) Do you think it's easier/makes more sense to try and edit this other layout instead? It scrolls the same way, and it already has a header and footer...plus the bottom of the header is already a different color, so I should be able to make it transparent.

This layout doesn't have a side column, but I can make one using code like this, right?:
HTML Code:

body {
color: white;
background-color: #000000;
background-image: url(stars_bg3.gif);
background-image: url(foot-head.gif) bottom 300px right;
background-repeat: no-repeat;
background-attachment: fixed;
border-top: 6px solid white;
border-right: 0;
border-bottom: 6px solid #FFFFFF;
border-left: 6px solid #FFFFFF;
padding-left: 184px;
overflow: hidden;
margin: 0px;
}

Okay, I am completely lost on this one. I need to create a string of code that will allow a user to submit a certain value into a form field. Then, when they click the submit button, they are taken to a specific page based on the value that they entered??? This has to be HTML only, hence my problem.

Basically, this is a poor-mans online account system. A customer enters their account number into the form field, hits the submit button and are taken to their account page which is password protected. I know, I know, this could be easily done with PHP or using simple htaccess but I have to use HTML only on this one.

Hello there,
I always make webpages using tables. The usual outline for me is a vertical menu bar at the left that is of STATIC width, and a window on the right that displays the conent with a DYNAMIC width. So I pretty much want the left pane to take up i.e. 200px and the right pane to take up the rest of the page.
With tables, it's easy b/c you can just set the table width to 100%, define the td width of the left pane, and the right pane will automatically resize itself to fill the page.

I'm trying to adapt a div-based layout now and I can't figure out how to do that with divs.
I've been playing with it, but keep running into problems. If I set float:left, after a certain point in making the window narrower, the right div jumps below the left div, etc..

Can someone give me some hints or point me in the right direction as to how to achieve the same effect I had using tables?

Thanks!

I completeted a layout for a website using the slice tools in Photoshop....all I have to do now, is put text, pictures, etc etc into the fields necessary. I am having a lot of trouble with this.

I am wanting to make a background image in a cell fixed so I can put text ONTOP of it so it doesn't mess up the entire table layout. I want that cell to have scrollbars.
Does that make sence?

Ive been to w3schools.com site and when I put in the code they ask me to, it doesn't work. Im probably doing something wrong.

The website isn't online, however, I can paste the code that was generated if that is needed.

Thank you for your help.

Hello,

I'm a bit stuck with how to code this so if anyone can rattle this off in seconds I'd really appreciate them doing so:

Rather than have visitors to my site click on a flag to visit a page based on their country of residence I want them to click one URL, then the code on this page work out if they are from UK, USA, or any other country and re-direct them to either page 1, page 2 or page 3. Is there a way for this to be done?

Thanks.

i have a floating div who's height is determined by content, i would like acquire that div's hight and apply it's hight to a div on the page, when the page loads...

The new iGoogle uses a time based image where the color of the sky corresponds to the time of day eg. it is bright when it is light out and dark when it is dark out. I want to make a image for a business website that displays open when it is between certain hours and closed when it is not those hours. Any guidance on where to look or how to approach this?

Hi, I'm trying to modify an HTML-based RSS ticker that I've found online. For reference, the code can be found at http://www.rsspump.com.

Currently, the code is written to display a certain number of recent posts (for my purposes, tweets from a Twitter account). The default setting displays anywhere between 1-9 of the most recent posts.

The issue is that I am using the ticker to display a list of daily announcements. The number of announcements we tweet varies from day to day, and become irrelevant once the day is over. Is there a way to rewrite this code so that the posts (tweets) displayed are based on the day they are posted rather than the number of recent posts?

For example, instead of displaying my 5 most recent tweets, I'd like to display everything I've tweeted today and only things I've tweeted today. I hope that makes sense.

Anyways, I've posted the code below. Thank you so, so much to anybody who can help.

<iframe src="http://s1.rsspump.com/rss.aspx?s=00000000-0000-0000-0000-000000000000&amp;speed=2&amp;t=0&amp;d=0&amp;u=0&amp;p=1&amp;b=0&amp;ic=9&amp;font=Verdana&amp;fonts ize=12px&amp;bgcolor=&amp;color=000000&amp;type=typewriter&amp;su=1&amp;sub=1&amp;sw=1" frameborder="0" width="100%" height="16" scrolling="no" allowtransparency="true"></iframe><noframes><div style="background-color: none transparent;"><a href="http://www.rsspump.com/?web_widget/rss_ticker/news_widget" title="News Widget">News Widget</a></div></noframes>

Not sure if I am asking the correct question in the correct case, so please advise.

Question: More and more I am seeing web pages that appear to be based more on javaScript/CSS than on conventional HTML/HTMLX. An example that comes to mind is the Dropbox web site.

Is my observation/conclusion correct or are these web pages just HTMLX/CSS?

If they are based on JavaScript/Jquery, are there environments for developing these web sites or are they all custom coded?

Thank you for your patience...

Todd