6 {{ upvoteCount | shortNum }}
6 {{ upvoteCount | shortNum }}

Optin Code Help Needed with Optin Box

by gazza9797
4 replies
  • WEB DESIGN
    • |
Hi All,

I would like to turn the following graphic into an optin box. I have the coding from mailchimp for the HTML.

Optin Box
http://integrityrealestatecoaching.com/Opt.jpg


Optin Coding

Code:
<!-- Begin MailChimp Signup Form -->
<link href="http://cdn-images.mailchimp.com/embedcode/slim-081711.css" rel="stylesheet" type="text/css">
<style type="text/css">
	#mc_embed_signup{background:#fff; clear:left; font:14px Helvetica,Arial,sans-serif; }
	/* Add your own MailChimp form style overrides in your site stylesheet or in this style block.
	   We recommend moving this block and the preceding CSS link to the HEAD of your HTML file. */
</style>
<div id="mc_embed_signup">
<form action="http://renttobuyahome.us1.list-manage.com/subscribe/post?u=79b968a0cc6813e9523f48b9c&amp;id=56828a9194" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank">
	
	<input type="email" value="" name="EMAIL" class="email" id="mce-EMAIL" placeholder="email address" required>
	<div class="clear"><input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button"></div>
</form>
</div>

<!--End mc_embed_signup-->

What do I need to do?
#box #code #needed #optin
  • Profile picture of the author AdWordsUzmani
    You need to add name field in your optin code
    {{ DiscussionBoard.errors[5120964].message }}
  • Profile picture of the author jumpa
    Hi, Gazza9797
    This my suggestion



    <html><head><title>optin mix</title>
    <style>
    .optin{
    width:395px;
    height:235px;
    background:url(opt.jpg);
    margin:0px;
    border:0px solid;
    font-size:24px;
    clear:both;
    overflow:hidden;
    }
    .name{
    width:250px;
    height:auto;
    border:0px solid;
    float:right;
    margin: 64px 37px auto auto;
    padding:2px;


    }
    .email{
    width:250px;
    height:auto;
    border:0px solid;
    float:right;
    margin: 5px 38px auto auto;
    padding:2px;


    }
    .clear{
    width:220px;
    height:auto;
    border:0px solid;
    float:right;
    margin: 5px 20px auto auto;
    padding:2px;
    font-size:40px;

    }
    </style>
    </head>
    <body>
    <div class="optin">
    <link href="http://cdn-images.mailchimp.com/embedcode/slim-081711.css" rel="stylesheet" type="text/css">
    <form action="http://renttobuyahome.us1.list-manage.com/subscribe/post?u=79b968a0cc6813e9523f48b9c&amp;id=56828a9194 " method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank">
    <div class="name">
    <input style="background:#cccccc; font-size:24px;" type="name" value="" name="NAME" placeholder="your name" required><br>
    </div>
    <div class="email">
    <input style="background:#cccccc; font-size:24px;" type="email" value="" name="EMAIL" placeholder="email address" required>
    </div>
    <div class="clear"><input style="opacity:0.1;" type="submit" value="Subscribe Subscribe Subscribe" name="subscribe" class="button"></div>
    </form>
    </div>

    </body></html>



    Or you can see demo on this link

    optin mix

    Maybe it can give some inspiration to make it better
    {{ DiscussionBoard.errors[5127759].message }}
  • Profile picture of the author gazza9797
    jumpa
    That will do the trick!!!

    Do you think you can help me out one more time with a video skin. Same idea but I want the video to play over/within the skin.

    Here is the a link to the skin. The size of the video and skin will have to adjusted.
    http://integrityrealestatecoaching.com/Videoskin.jpg

    I don't have the final video as of yet but we could use this one as an example.
    Signature

    Gary "Gazza" M

    {{ DiscussionBoard.errors[5132144].message }}
  • Profile picture of the author jumpa
    Hi, Gary
    I only now how to place an image or video with some background

    so here is the sample, video [i place my vown short video] and your video skin

    video skin

    one important thing is, you must make css class with your videoskin image as abckground, and then you canplace your video between tag <div> and </div>

    that s the principle

    you can change video size to make it better

    have a nice try

    here is html code
    <html><head><title>video skin</title>
    <style>
    .video{
    background:url(videoskin.jpg) teal ;
    width:906px;
    height:517px;
    border:1px;
    padding-top:45px;
    margin:10px auto;
    }
    </style>
    </head>
    <body>
    <br>
    <div class="video" align="center">
    <center>
    <object height="360" width="480"><param name="movie" value="movie1.swf"><param name="allowFullScreen" value="true">
    <embed src="movie1.swf" height="360" width="480"></object>
    </center>
    </div>
    <br>



    </body></html>
    {{ DiscussionBoard.errors[5134328].message }}

Trending Topics