Custom Multimedia Boxcode/ style sheet

gnemer1 · #1 (**permalink**) 08-16-2008, 04:23 PM

I entered a custom code which may may be a little complicated into the custom multimedia box code form. It is an opt-in form with images.
I am trying to customize the stlyesheet for the entire form to show up correctly in IE7. Actually the form displays very well in firefox.
Here is the site: Real Life, Real Purpose! — INTERNET MARKETING WITH PURPOSE

I read the thread on IE7 issues but since I am actually entering the entire html in the custom multimedia box the issue is a little different.
Here is the entire custom code:
<html>
<head>
<title>Free Report- How To Make Money on the Internet</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
.style1 {
font-size: medium;
font-weight: bold;
}
.style2 {
color: #FF0000;
background-color: #FFFFFF;
}
.style8 {
font-size: x-small;
}
.style11 {
font-size: 16px;
}
.style12 {
font-size: 18px;
font-weight: bold;
}
.style13 {
font-size: 12px;
}
.style14 {
border-style: solid;
border-color: #FF0000;
}
</style>
</head>
</center>
<body bgcolor="#FFFFFF" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
<p> </p><table width="378" border="0" cellspacing="0" cellpadding="0" align="center">
<tr>
<td valign="bottom">
<table width="378" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="378" valign="bottom"><img src="http://diythemes.com/forums/images/01blue_01.jpg" width="242" height="180"></td>
<td valign="top" align="right" width="10"><img src="http://diythemes.com/forums/images/01blue_02.gif" width="136" height="180"></td>
</tr>
</table>
</td>
</tr>
<tr>
<td background="http://diythemes.com/forums/images/01blue_03.jpg" valign="top">
<table width="378" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="15"> </td>
<td width="332">
<table border="0" cellspacing="0" cellpadding="10">
<tr>
<td width="95%" height="149" bgcolor="#F8F8F8">
<p align="center"><font face="Tahoma" class="style1">
<span class="style2">"How To Work From Home and Make Money
on the Internet"</span></font></p>
<table width="100%" border="0" cellspacing="10" cellpadding="0">
<tr>
<td width="95%" height="121">

<div align="center">
<font size="2" face="Arial, Helvetica, sans-serif">
<span class="style11"><strong>Plus
</strong>The Original
EBook <strong> "Scientific Advertising" </strong>
by Claude Hopkins  For Subscribing To This Blog
By Email.</span><span class="style8"><br>
<center>
<form method="post" action="http://www.aweber.com/scripts/addlead.pl" target="_new">
<table>
<tr><td>Name:</td><td><input type="text" name="name" value="" size="20"></td></tr>
<tr><td>Email:</td><td><input type="text" name="from" value="" size="20"></td></tr>
<tr><td colspan=2><center></center></td></tr>
<tr><td align="center" colspan="2" class="style14"><input type="submit" name="submit" value="SUBSCRIBE NOW!"></td></tr>
</table>
<input type="hidden" name="meta_web_form_id" value="996891112">
<input type="hidden" name="meta_split_id" value="">
<input type="hidden" name="unit" value="reallifepurpose">
<input type="hidden" name="redirect" value="http://www.reallifepurpose.com/thankyou.html" id="redirect_21f9b84a0d3c07fd3dcc1628114f09e9">
<input type="hidden" name="meta_redirect_onlist" value="http://www.reallifepurpose.com">
<input type="hidden" name="meta_adtracking" value="">
<input type="hidden" name="meta_message" value="1">
<input type="hidden" name="meta_required" value="from">
<input type="hidden" name="meta_forward_vars" value="0">
</form>

</center>
<div align="center"><font size="5" face="Tahoma">
<span class="style12">SECURE
& CONFIDENTIAL</span><br>
</font><font size="1" face="Tahoma" class="style13">Your email address
will NEVER be rented, traded or sold. You can
unsubscribe at any time.<br>
WE GUARANTEE YOUR CONFIDENTIALITY. <br>
We hate spam as much as you do.</font> <font face="Arial" size="3">
<img src="nospam.gif" border="0" height="24" width="29" /></font><font size="1" face="Tahoma" class="style8">.</font>  </div>
</td>
</tr>
</table>
</td>
</tr>
</table>
</td>
<td width="31"> </td>
</tr>
</table>
</td>
</tr>
<tr>
<td valign="top"><img src="http://diythemes.com/forums/images/01blue_05.jpg" width="378" height="47"></td>
</tr>
</table>
<p> </p>
<p> </p>
</body>
</html>

Could you tell me what exactly needs to be added into my custom style sheet?
I already have some custom styles for the background image.

mnichols · #2 (**permalink**) 08-16-2008, 09:21 PM

Your report box shows up in Firefox for the Mac, but not in Safari or DEVONAgent (both built on the WebKit engine).

Thought I'd let you know.

kingdomgeek · #3 (**permalink**) 08-16-2008, 11:00 PM

Well, part of the problem is that code looks like it's straight outta the nineties; another part may be because you're trying to insert a complete HTML page -- complete with HTML, HEAD, and BODY tags -- into another HTML page, which creates very invalid markup which I wouldn't expect any browser to handle gracefully. This isn't your fault by any means; aweber simply needs to get with the times. :P

Use this in the custom box; I haven't modified it at all except to remove the HTML & BODY tags as well as the HEAD section:

HTML Code:

<table width="378" border="0" cellspacing="0" cellpadding="0" align="center">
  <tr>
    <td valign="bottom">
      <table width="378" border="0" cellspacing="0" cellpadding="0">
        <tr>
<td width="378" valign="bottom"><img src="http://diythemes.com/forums/images/01blue_01.jpg" width="242" height="180"></td>
<td valign="top" align="right" width="10"><img src="http://diythemes.com/forums/images/01blue_02.gif" width="136" height="180"></td>
        </tr>
      </table>
    </td>
  </tr>
  <tr>
    <td background="http://diythemes.com/forums/images/01blue_03.jpg" valign="top"> 
      <table width="378" border="0" cellspacing="0" cellpadding="0">
        <tr> 
          <td width="15">&nbsp;</td>
          <td width="332"> 
            <table border="0" cellspacing="0" cellpadding="10">
              <tr> 
                <td width="95%" height="149" bgcolor="#F8F8F8"> 
                  <p align="center"><font face="Tahoma" class="style1">
                    <span class="style2">&quot;How To Work From Home and Make Money 
                    on the Internet&quot;</span></font></p>
                  <table width="100%" border="0" cellspacing="10" cellpadding="0">
                    <tr> 
                      <td width="95%" height="121"> 
                        
                          <div align="center">
                            <font size="2" face="Arial, Helvetica, sans-serif">
                            <span class="style11"><strong>Plus 
                            </strong>The Original 
                EBook <strong> &quot;Scientific Advertising&quot; </strong> 
                            by Claude Hopkins&nbsp; For Subscribing To This Blog 
                            By Email.</span><span class="style8"><br>
                            <center>
                            <form method="post" action="http://www.aweber.com/scripts/addlead.pl" target="_new">
<table>
<tr><td>Name:</td><td><input type="text" name="name" value="" size="20"></td></tr>
<tr><td>Email:</td><td><input type="text" name="from" value="" size="20"></td></tr>
    <tr><td colspan=2><center></center></td></tr>
<tr><td align="center" colspan="2" class="style14"><input type="submit" name="submit" value="SUBSCRIBE NOW!"></td></tr>
</table>
<input type="hidden" name="meta_web_form_id" value="996891112">
<input type="hidden" name="meta_split_id" value="">
<input type="hidden" name="unit" value="reallifepurpose">
<input type="hidden" name="redirect" value="http://www.reallifepurpose.com/thankyou.html" id="redirect_21f9b84a0d3c07fd3dcc1628114f09e9">
<input type="hidden" name="meta_redirect_onlist" value="http://www.reallifepurpose.com">
<input type="hidden" name="meta_adtracking" value="">
<input type="hidden" name="meta_message" value="1">
<input type="hidden" name="meta_required" value="from">
<input type="hidden" name="meta_forward_vars" value="0">
</form>

</center>
                        <div align="center"><font size="5" face="Tahoma">
                            <span class="style12">SECURE 
                          &amp; CONFIDENTIAL</span><br>
                          </font><font size="1" face="Tahoma" class="style13">Your email address 
                          will NEVER be rented, traded or sold. You can 
                            unsubscribe at any time.<br>
                          WE GUARANTEE YOUR CONFIDENTIALITY. <br>
                          We hate spam as much as you do.</font> <font face="Arial" size="3">
<img src="nospam.gif" border="0" height="24" width="29" /></font><font size="1" face="Tahoma" class="style8">.</font>&nbsp; </div>
                      </td>
                    </tr>
                  </table>
                </td>
              </tr>
            </table>
          </td>
          <td width="31">&nbsp;</td>
        </tr>
      </table>
    </td>
  </tr>
  <tr>
    <td valign="top"><img src="http://diythemes.com/forums/images/01blue_05.jpg" width="378" height="47"></td>
  </tr>
</table>

If you need the CSS that was included, then add it to your custom.css file:

Code:

.style1 {
    font-size: medium;
    font-weight: bold;
}
.style2 {
    color: #FF0000;
    background-color: #FFFFFF;
}
.style8 {
    font-size: x-small;
}
.style11 {
    font-size: 16px;
}
.style12 {
    font-size: 18px;
    font-weight: bold;
}
.style13 {
    font-size: 12px;
}
.style14 {
    border-style: solid;
    border-color: #FF0000;
}

This may not improve things in IE, but it's definitely an improvement over the code they gave you.

gnemer1 · #4 (**permalink**) 08-17-2008, 12:05 AM

Since I don't know much about codes I just copied the whole page in which I built the form. The good news was that it worked in Firefox, The bad news is that it doesn't work anywhere else.
Could you please give me a suggestion as to how to straighten up all my messy codes and add the correct files to the custom box and the stylesheet?

Thanks!

kingdomgeek · #5 (**permalink**) 08-17-2008, 02:33 AM

Have you replaced the code you entered into the custom box with the code from the first box in my previous post?

gnemer1 · #6 (**permalink**) 08-17-2008, 02:44 PM

Thank you for your help,
I know you may be in church this morning so there is no rush on helping me to soive this problem. (I"ll be going to)
Unfortuantely, I get errors in IE7.
Also,the images are not showing up in Firefox now. (I'll work on it after the form shows up in IE.
I am enclosing & attaching the original code for the opt-in form (No images because I sell these templates)). It doesn't include aweber but maybe we can work from there.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>HighImpactTemplates.com</title>
<meta http-equiv="Content-Type"
content="text/html; charset=iso-8859-1">
</head>
<body leftmargin="0" topmargin="0" bgcolor="#ffffff"
marginheight="0" marginwidth="0">
<p> </p>
<table align="center" border="0" cellpadding="0"
cellspacing="0" width="378">
<tbody>
<tr>
<td valign="bottom">
<table border="0" cellpadding="0" cellspacing="0"
width="378">
<tbody>
<tr>
<td valign="bottom" width="378"><img
src="images/01blue_01.jpg" height="180" width="242"></td>
<td align="right" valign="top" width="10"><img
src="images/01blue_02.gif" height="180" width="136"></td>
</tr>
</tbody>
</table>
</td>
</tr>
<tr>
<td background="images/01blue_03.jpg" valign="top">
<table border="0" cellpadding="0" cellspacing="0"
width="378">
<tbody>
<tr>
<td width="15"> </td>
<td width="332">
<table border="0" cellpadding="10"
cellspacing="0">
<tbody>
<tr>
<td bgcolor="#f8f8f8" height="149"
width="95%">
<p align="center"><font
style="font-size: 16pt;" face="Tahoma"><b><span
style="text-decoration: underline; background-color: rgb(255, 255, 0);">Insert
Opt-In Headline Here</span></b></font></p>
<table border="0" cellpadding="0"
cellspacing="10" width="100%">
<tbody>
<tr>
<td height="121" width="95%">
<form name="form1" method="post"
action="">
<div align="center"><font
face="Arial, Helvetica, sans-serif" size="2">Just
enter your email, name and phone below. I'll get in touch with you
soon. </font><br>
</div>
<div align="center">
<table border="0" cellpadding="0"
cellspacing="7" height="62" width="86%">
<tbody>
<tr>
<td height="2" width="29%">
<div align="right"><font
face="Tahoma" size="2"><b>Name:</b></font></div>
</td>
<td height="2" width="71%"><font
face="Tahoma" size="2"><b> <input
name="textfield" size="25" type="text"> </b></font></td>
</tr>
<tr>
<td height="29" width="29%">
<div align="right"><font
face="Tahoma" size="2"><b>Email:</b></font></div>
</td>
<td height="29" width="71%"><font
face="Tahoma" size="2"><b> <input
name="textfield2" size="25" type="text"> </b></font></td>
</tr>
</tbody>
</table>
<br>
<input name="Submit" value="Submit"
type="submit"> </div>
</form>
<div align="center"><font
face="Tahoma" size="5"><b><font size="2">SECURE
& CONFIDENTIAL</font></b><br>
</font><font face="Tahoma"
size="1">Your email address will NEVER be rented, traded or
sold. <br>
WE GUARANTEE YOUR CONFIDENTIALITY. <br>
We hate spam as much as you do.</font> </div>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
</td>
<td width="31"> </td>
</tr>
</tbody>
</table>
</td>
</tr>
<tr>
<td valign="top"><img src="images/01blue_05.jpg"
height="47" width="378"></td>
</tr>
</tbody>
</table>
<p> </p>
<p> </p>
</body>
</html>

Thank you

kingdomgeek · #7 (**permalink**) 08-17-2008, 06:25 PM

If you're pasting that code into the Custom Box of Thesis, you're going to want to leave off the first part of it (up to the first <p> </p> line), as well as the last part (after the last </table> line).

Those tags -- HTML, HEAD, BODY, and so on -- are already defined by Thesis' templates; including them within a Thesis output page will result in invalid markup and likely cause rendering problems with Internet Explorer.

gnemer1 · #8 (**permalink**) 08-18-2008, 07:42 PM

Thanks for your continued help.
I have removed the tags that you told me to remove. However I am stilgetting errors in IE7. I also tried to replace the custom.css file.
Do you think that I am getting the errors because my template is too big? It doesn't apprear that way.
IE tells me what line the error is on. Can you look at it and tell me what you think?

Real Life, Real Purpose! — INTERNET MARKETING WITH PURPOSE

Thanks again

kingdomgeek · #9 (**permalink**) 08-18-2008, 11:23 PM

You're actually getting an error in IE? What does the error say and what line is it on?

gnemer1 · #10 (**permalink**) 08-19-2008, 12:59 AM

Anyways...
I've done what you told me to do with the tags but am still experiencing problems. I would really like to be able to use this space for an opt-in form since that is the primary goal of my blog.
Got any suggestions for getting it to work?

Thanks

Thread Tools
Show Printable Version Email this Page
Display Modes
Linear Mode Switch to Hybrid Mode Switch to Threaded Mode