How To Add a "TextArea" to a Wordpress Page?!?

19 replies
  • WEB DESIGN
  • |
Ok, so there doesn't seem to be a good tutorial or walkthrough anywhere for this issue, so I humbly ask for a little guidance here...

I'm trying to set up a "textarea" to display affiliate email swipes exactly like you can see on these pages:

Brainy Affiliate Dashboard | Start Potty Training Email Marketing
Google Sniper 2.0 Affiliate Tools Page

I'm trying to set it up with the "Text" editor in Wordpress for an Optimizepress site, and while the code itself works and the textarea is created, I can't seem to find a way to paste the emails themselves into the textarea so that they show automatically like they do on the two examples above.

Anyone have any suggestions as to how to work with a textarea in wordpress?

Any insight is greatly appreciated, looking forward to hearing what you have to say!
#add #page #textarea #wordpress
  • Profile picture of the author Steve Fleming
    If you make a custom template you can drop any html in
    you want.

    Code:
    <?php
    /*
    Template Name: Cover Page
    */
    ?>
    
    <?php get_header(); ?>
    Here's my cover page!
    <?php get_footer(); ?>
    Just make a new page with that in it and call it anything you want. Make sure to save it with .php as the extension. Then drop it in your themes folder (themes/name-of-theme/) and you'll see it appear in your 'templates' box when you go to make a page/post.

    Steve
    {{ DiscussionBoard.errors[7650767].message }}
    • Profile picture of the author Shadowflux
      You could try checking the source code of the sites you posted as examples.
      Signature
      Native Advertising Specialist
      Dangerously Effective
      Always Discreet
      {{ DiscussionBoard.errors[7650794].message }}
      • Profile picture of the author Cool Hand Luke
        Originally Posted by Shadowflux View Post

        You could try checking the source code of the sites you posted as examples.
        I did. For whatever reason, I just couldn't get it to work on my site the way I wanted it to.
        Originally Posted by Steve Fleming View Post

        If you make a custom template you can drop any html in
        you want.

        Code:
        <?php
        /*
        Template Name: Cover Page
        */
        ?>
        
        <?php get_header(); ?>
        Here's my cover page!
        <?php get_footer(); ?>
        Just make a new page with that in it and call it anything you want. Make sure to save it with .php as the extension. Then drop it in your themes folder (themes/name-of-theme/) and you'll see it appear in your 'templates' box when you go to make a page/post.

        Steve
        Wow. I had no idea that it would be that in-depth. Looks like this is something I'll end up paying someone to do... Thanks anyways Steve.
        {{ DiscussionBoard.errors[7650945].message }}
  • Profile picture of the author jskarthik1
    Hey! If you are using wordpress, then you should really check out this page - 15 WordPress Plugins for Displaying Code Snippets | Template Monster Blog

    You can easily achieve the same functionality. These plugins are basically used for displaying programming code like php, html or css. You may instead use it to display raw text!

    They will be of some use for you.
    {{ DiscussionBoard.errors[7804833].message }}
  • Profile picture of the author Bruce Wedding
    Dude,

    Switch from the visual editor to text and just paste it in. No big deal:

    A Text Area
    Code:
     
    <textarea rows="4" cols="50">
    Dear Affilate,
    
    This is an email swipe for you to use to promote my product.
    Love, 
    Bruce
     </textarea>
    {{ DiscussionBoard.errors[7805680].message }}
    • Profile picture of the author Cool Hand Luke
      Bump.

      I tried Bruce's suggestion above and it didn't work because the actual code text appears on the page.

      Would still love to hear from someone who knows how to add a textarea to an OptimizePress wordpress page.
      {{ DiscussionBoard.errors[8356680].message }}
  • {{ DiscussionBoard.errors[8356910].message }}
    • Profile picture of the author Cool Hand Luke
      Thanks Parker, but unfortunately GoogleDocs isn't going to work for this. I really just need to know how to do a simple "textarea" like you see on just about every Clickback affiliate resources page out there.

      I know it has to be something simple too, so any Warriors who have insight, please show me the light.
      {{ DiscussionBoard.errors[8356963].message }}
  • Profile picture of the author WillR
    Luke,

    They are just text area boxes:

    HTML textarea tag

    The code provided above should work fine. Make sure you are using the HTML/text editor and not pasting the code into the normal Wordpress visual editor box.
    {{ DiscussionBoard.errors[8356991].message }}
    • Profile picture of the author Cool Hand Luke
      Originally Posted by WillR View Post

      Luke,

      They are just text area boxes:

      HTML textarea tag

      The code provided above should work fine. Make sure you are using the HTML/text editor and not pasting the code into the normal Wordpress visual editor box.
      Will,

      Thanks but I'm definitely missing something here. For instance, I copy/pasted your example as is without changing a thing and it ended up looking like this on the page:


      No matter what I do, I can't seem to get rid of the little "br" line break code snippets.
      {{ DiscussionBoard.errors[8357036].message }}
  • Profile picture of the author Dennis Gaskill
    You can't use HTML inside a text area - that's why it shows on the page. If you want more formatting than plain text allows use an iframe.
    Signature

    Just when you think you've got it all figured out, someone changes the rules.

    {{ DiscussionBoard.errors[8357245].message }}
    • Profile picture of the author Cool Hand Luke
      Originally Posted by Dennis Gaskill View Post

      You can't use HTML inside a text area - that's why it shows on the page. If you want more formatting than plain text allows use an iframe.
      Thank you Dennis, but I'm still not quite sure I understand.

      I'm only trying to use the HTML code to build the textarea itself, and I don't want to use HTML in the actual textarea... if that makes sense.

      So if I'm off base her can anyone explain to me how wordpress sites can have a textarea like the ones on this page: Friends Into Lovers
      {{ DiscussionBoard.errors[8357295].message }}
      • Profile picture of the author Dennis Gaskill
        Originally Posted by Cool Hand Luke View Post

        Thank you Dennis, but I'm still not quite sure I understand.

        I'm only trying to use the HTML code to build the textarea itself, and I don't want to use HTML in the actual textarea... if that makes sense.

        So if I'm off base her can anyone explain to me how wordpress sites can have a textarea like the ones on this page: Friends Into Lovers
        Your screen shot shows code in the text area, break tags. Are you not putting those in there yourself?
        Signature

        Just when you think you've got it all figured out, someone changes the rules.

        {{ DiscussionBoard.errors[8358496].message }}
        • Profile picture of the author Cool Hand Luke
          Originally Posted by Dennis Gaskill View Post

          Your screen shot shows code in the text area, break tags. Are you not putting those in there yourself?
          No, I'm not. I copy-pasted the exact example from Will's example above without changing a thing.
          {{ DiscussionBoard.errors[8358632].message }}
  • Profile picture of the author topnichewebsites
    Just create a new page
    Name the page
    Click on "TEXT" not visual
    copy the below and save
    Look at your new page

    <table style="margin-left: 180px;" width="500" border="2" cellspacing="0" cellpadding="10" align="center">
    <tbody>
    <tr>
    <td style="border: 1px solid #cccccc;" bgcolor="#f3f3f3" width="572">
    <p align="center"><strong>Swipe #1:<a id="emailcopy" name="emailcopy"></a></strong>
    </p>

    <form name="emailcopyform1">
    <div align="center">
    <textarea cols="60" name="emailcopytext" rows="20">SWIPE #1 SUBJECT LINE: Use This And She'll Lust Uncontrollably For You</textarea>This automatically triggers
    her to lust uncontrollably
    for you...

    And has her thinking it
    was all HER IDEA even if
    she thinks of you as just
    a friend or would never
    normally hook up with you.

    It's too big for an
    email so go here and
    use this now:

    Your Link Text

    Let me know what you think.

    (YOUR NAME HERE)

    </div>
    </form></td>
    </tr>
    </tbody>
    </table>
    Signature
    http://pixelcovers.com/ <- eBook add eCovers

    https://www.unicommercesolutions.com <- WordPress Websites and Maintenance
    {{ DiscussionBoard.errors[8357772].message }}
  • Profile picture of the author yestyle
    Banned
    Swith to html editor on your page in wp-admin and paste textarea code that you want.
    {{ DiscussionBoard.errors[8357807].message }}
  • Profile picture of the author Dennis Gaskill
    I think WordPress is inserting the break tags because it is trying to be faithful to what was entered into the WordPress editor, so it's inserting break tags where you have blank lines.

    A textarea isn't supposed to have HTML inside it though, so the tags it inserts are showing up on the page instead of being interpretted as code. I'm guessing WordPress is doing this on the fly so the break tags aren't showing up in the WordPress editor for you.

    Try doing it this way instead...

    Create a scrolling division:

    Code:
    <div style="width: 540px; 
                       height: 280px; 
                       overflow: auto; 
                       padding: 7px; 
                       border: 1px solid black;">
    ...content here...
    </div>
    The key is setting the width and height and adding the overflow: auto property and value.

    One word of caution: if you set the width too narrow for the content it will cause a horizontal scrollbar as well as the desired vertical scrollbar. You can code it so that doesn't happen, but then your visitors won't be able to access all the content. It's better to make sure the content fits within the designated width. If it's just text that should be no problem. If you add images it could be.
    Signature

    Just when you think you've got it all figured out, someone changes the rules.

    {{ DiscussionBoard.errors[8358722].message }}
    • Profile picture of the author Cool Hand Luke
      Originally Posted by Dennis Gaskill View Post

      I think WordPress is inserting the break tags because it is trying to be faithful to what was entered into the WordPress editor, so it's inserting break tags where you have blank lines.

      A textarea isn't supposed to have HTML inside it though, so the tags it inserts are showing up on the page instead of being interpretted as code. I'm guessing WordPress is doing this on the fly so the break tags aren't showing up in the WordPress editor for you.

      Try doing it this way instead...

      Create a scrolling division:

      Code:
      <div style="width: 540px; 
                         height: 280px; 
                         overflow: auto; 
                         padding: 7px; 
                         border: 1px solid black;">
      ...content here...
      </div>
      The key is setting the width and height and adding the overflow: auto property and value.

      One word of caution: if you set the width too narrow for the content it will cause a horizontal scrollbar as well as the desired vertical scrollbar. You can code it so that doesn't happen, but then your visitors won't be able to access all the content. It's better to make sure the content fits within the designated width. If it's just text that should be no problem. If you add images it could be.
      Thanks Dennis, I appreciate your insight. I'll try this and report back.

      EDIT: Works like a charm Dennis, thanks again!
      {{ DiscussionBoard.errors[8358844].message }}
      • Profile picture of the author Dennis Gaskill
        Originally Posted by Cool Hand Luke View Post

        Thanks Dennis, I appreciate your insight. I'll try this and report back.

        EDIT: Works like a charm Dennis, thanks again!
        Glad to know it worked for you. I've done my good deed for the day.
        Signature

        Just when you think you've got it all figured out, someone changes the rules.

        {{ DiscussionBoard.errors[8359800].message }}

Trending Topics