How can I make one of these?

8 replies
  • WEB DESIGN
  • |


I am nearly clueless on HTML but I would like to make an opt-in box like the one above. Any suggestions on how i can do this? I am using Aweber.
#make
  • Profile picture of the author Karen Blundell
    you are going to need some CSS styling. Google is your friend but you can start here:
    http://themehybrid.com/support/topic...form-using-css
    Signature
    ---------------
    {{ DiscussionBoard.errors[2281002].message }}
    • Profile picture of the author c0rv3tt3
      Originally Posted by Karen Blundell View Post

      you are going to need some CSS styling. Google is your friend but you can start here:
      Styling An Opt In Form Using CSS. Theme Hybrid Support
      Thanks for the suggestion.
      The problem I'm having is I don't know how to put a pic to the right of the optin box. Every time I put a pic in it centers it and puts it below the submit button and such. I have a feeling its a very simple fix but I am just being dumb.
      Signature

      {{ DiscussionBoard.errors[2281033].message }}
      • Profile picture of the author Product Developer
        Originally Posted by c0rv3tt3 View Post

        Thanks for the suggestion.
        The problem I'm having is I don't know how to put a pic to the right of the optin box. Every time I put a pic in it centers it and puts it below the submit button and such. I have a feeling its a very simple fix but I am just being dumb.
        You need to "wrap" the image to the left or right. Depending on what you're using to create the page... it should be in "image properties".

        You'll get an alignment like the four images here Featured Articles

        In editing you'll probably find if you right click on the image you'll be able to select the properties. Or when you insert the image you might be prompted to add title tags, specify size, borders, spacing etc... here you should be able to select wrap to left, right, top, middle or bottom of text.

        OR

        Insert a table with 2 columns and 1 row - set the table border size to zero pixels, and then simply add the opt-in box to the left hand column and add the image in the right hand column.

        One more thing if you struggle with html - Easy way to add the aweber opt-in box is to type (AAAAAAAAAAAAAAAA) in the left hand column and the position you want the opt-in box - then switch to html view, find all the A's - highlight them and paste in your aweber html code.

        Alex
        {{ DiscussionBoard.errors[2281399].message }}
  • Profile picture of the author KathyK
    Code:
    <img src="yourimagelinkhere.jpg" align="right" alt="text for people who can't see images">
    Since you don't know html OR css, I'm just giving you basic html.
    If your page is xhtml add a / after the last " and before the > />

    ALternately, make a table. put the image in the right side and the form stuff in the left.
    Code:
    <table><tr><td>Form stuff here</td><td valign="middle">picture here</td></tr></table>
    (That valign="middle" centers the pic vertically - you can also do top or bottom)

    HTH
    Signature

    Cheers,
    Kathy

    {{ DiscussionBoard.errors[2283825].message }}
    • Profile picture of the author c0rv3tt3
      Originally Posted by KathyK View Post

      Code:
      <img src="yourimagelinkhere.jpg" align="right" alt="text for people who can't see images">
      Since you don't know html OR css, I'm just giving you basic html.
      If your page is xhtml add a / after the last " and before the > />

      ALternately, make a table. put the image in the right side and the form stuff in the left.
      Code:
      <table><tr><td>Form stuff here</td><td valign="middle">picture here</td></tr></table>
      (That valign="middle" centers the pic vertically - you can also do top or bottom)

      HTH
      Thank you. This is what I was looking for but when I put the code in it looks completely out of whack.



      How can I get them to align?
      Signature

      {{ DiscussionBoard.errors[2285089].message }}
  • Profile picture of the author KathyK
    you could try doing an align="top" in both or an align="bottom" in both of the td tags.

    Also might be that your pic is too big for the area and is forcing the form down - you could try making it a bit smaller.
    Signature

    Cheers,
    Kathy

    {{ DiscussionBoard.errors[2287918].message }}
  • Profile picture of the author ramshankar
    Hi
    I don't know the Exact coding for You.But I am sure u will find your answer in W3schools.com .In this website go to Learn HTML Tutorial.Its a free website.
    {{ DiscussionBoard.errors[2292150].message }}
  • Profile picture of the author hendricius
    Its pretty simple, what you're looking at is just the forms part of html. I suggest u look up the codes from w3schools.com or you could try out microsoft front page.
    {{ DiscussionBoard.errors[2359818].message }}

Trending Topics