What is JotForm?
JotForm is a free online form builder which helps you create online forms without writing a single line of code. No sign-up required.

At JotForm, we want to make sure that you’re getting the online form builder help that you need. Our friendly customer support team is available 24/7.

We believe that if one user has a question, there could be more users who may have the same question. This is why many of our support forum threads are public and available to be searched and viewed. If you’d like help immediately, feel free to search for a similar question, or submit your question or concern.


  • Profile Image

    How to make website URL a hyperlink automatically.

    Asked by klitschkobrofan on July 04, 2011 at 12:18 AM

    Ok {url} is the url that the user inserted on the form. I'm in compose email Lets say someone using the forms inputed www.hifive.com as their url.  Without a hyperlink it would just show up on the submission as www.hifive.com with no hyperlink.  However, I want it a hyperlink.  So if I highlight {url} and click the hyperlink button on top of the editor a screen pops up that says  Insert/edit link.  It has link URL, target, and title.  Now for the link URL if you specify an actual address like www.hifive.com then everything is fine but that defeats the purpose.  You don't know what they will type in.  I want it dynamic.  So I figured since {url} stores the address that could just type in {url} in the link URL field and everything should be fine.  Nope.  What happens is for some odd reason the hyperlink will be the site that's hosting the from in this case http://freeforalllinks123.blogspot.com/ then after that the url the person inserted in the URL field.  So if they inputed www.hifive.com like above the hyperlink would be http://freeforalllinks123.blogspot.com/www.hifive.com.   Why is it doing this?   How can I get it so it will just be a hyperlink for www.hifive.com or whatever site someone inputs and nothing else?

     

     

    Website {website3}
    URL {url}
    Description {description}
    Keywords {keywords}
    E-mail {email}

     

    Here's the html with the {url} variable being used:  In bold is what I'm trying figure out.

     

    <table border="0" cellspacing="0" cellpadding="0" width="100%" bgcolor="#f7f9fc">
    <tbody>
    <tr>
    <td height="30">&nbsp;</td>
    </tr>
    <tr>
    <td align="center">
    <table border="0" cellspacing="0" cellpadding="0" width="600" bgcolor="#eeeeee">
    <tbody>
    <tr>
    <td width="13" height="30" background="http://www.jotform.com/images/win2_title_left.gif"><br /></td>
    <td align="left" valign="bottom" background="http://www.jotform.com/images/win2_title.gif"><img style="float: left;" src="//www.jotform.com/images/win2_title_logo.gif" alt="JotForm.com" width="63" height="26" /></td>
    <td width="14" background="http://www.jotform.com/images/win2_title_right.gif"><br /></td>
    </tr>
    </tbody>
    </table>
    <table border="0" cellspacing="0" cellpadding="0" width="600" bgcolor="#eeeeee">
    <tbody>
    <tr>
    <td width="4" background="http://www.jotform.com/images/win2_left.gif"><br /></td>
    <td align="center" bgcolor="#ffffff">
    <table border="0" cellspacing="0" cellpadding="5" width="100%">
    <tbody>
    <tr>
    <td style="padding: 5px !important;" width="170" bgcolor="white">Website</td>
    <td style="padding: 5px !important;" bgcolor="white">{website3}</td>
    </tr>
    <tr>
    <td style="padding: 5px !important;" width="170" bgcolor="#f9f9f9">URL</td>
    <td style="padding: 5px !important;" bgcolor="#f9f9f9"><a target="_blank" href="/{url}">{url}</a></td>
    </tr>
    <tr>
    <td style="padding: 5px !important;" width="170" bgcolor="white">Description</td>
    <td style="padding: 5px !important;" bgcolor="white">{description}</td>
    </tr>
    <tr>
    <td style="padding: 5px !important;" width="170" bgcolor="#f9f9f9">Keywords</td>
    <td style="padding: 5px !important;" bgcolor="#f9f9f9">{keywords}</td>
    </tr>
    <tr>
    <td style="padding: 5px !important;" width="170" bgcolor="white">E-mail</td>
    <td style="padding: 5px !important;" bgcolor="white">{email}</td>
    </tr>
    </tbody>
    </table>
    </td>
    <td width="4" background="http://www.jotform.com/images/win2_right.gif"><br /></td>
    </tr>
    <tr>
    <td style="font-size: 4px;" height="4" background="http://www.jotform.com/images/win2_foot_left.gif"><br /></td>
    <td style="font-size: 4px;" background="http://www.jotform.com/images/win2_foot.gif"><br /></td>
    <td style="font-size: 4px;" background="http://www.jotform.com/images/win2_foot_right.gif"><br /></td>
    </tr>
    </tbody>
    </table>
    </td>
    </tr>
    <tr>
    <td height="30">&nbsp;</td>
    </tr>
    </tbody>
    </table>
    <p><br /><br /></p>

     

    p.s.  If I can get this to work properly I will upgrading soon.  :)  Thanks ahead of time!

    Page URL:
    http://freeforalllinks123.blogspot.com/

    JotForm email style size
  • Profile Image
    JotForm Support

    Answered by liyam on July 04, 2011 at 02:32 AM

    Hello,

    I noticed that the URL you have set is starting with a slash:

    <a target="_blank" href="/{url}">{url}</a></td>

    To fix this, please use this code:

    <a target="_blank" href="http://{url}">{url}</a></td>

    Let us know if it still does not work.

    Thanks,

    Liyam

  • Profile Image

    Answered by klitschkobrofan on July 04, 2011 at 09:47 AM

    Thanks for replying.  I changed some things since last time.  Instead of the input field just being "url" i called it "your url" so now the variable for that field is 'yoyurUrl'.  I did this just to see what happened plus I got rid of the slash.  It still did the same thing.   I should point out that I'm ussing blogger.com aka blogspot's feature where you can email a post.  So I'm sending a email and blogger is posting that email.  The idea of the site is for visitors to provide a free  backlink to their site.    The site is here: http://freeforalllinks123.blogspot.com/ So its basic for now until I get this to work. 

     

    Ok so I messed around with some things on blogger and realized its not this program thats causing the issue its blogger itself.  For some reason whatever you are using for a variable "url" or "yourUrl" or whatever in blogger for some reason by default changes it.  For example as a test I went into Blogger to compose a new post as an experiment and in edit mode I had: <a target="_blank" href="{myUrl">www.testing.com</a> and then clicked compose mode where I could see the hyperlink of "www.testing.com and then back again to edit mode.   But, now that I had switched back this is what it now says as the html: <a target="_blank" href="http://www.blogger.com/%7BmyUrl" rel="nofollow">www.testing.com</a>.  So its inputing the user input but after the www.blogger.com/ and the "www.blogger.com" translates to whatever particular blog address this post is being posted on in this case http://freeforalllinks123.blogspot.com/.   Very strange.  So I was doing the right thing in regards to this site but for some reason blogger does this and I have no idea why and I doubt anyone could help me on something not directly related to jotform but I was planning on upgrading from the free if it did work and  if anyone could help I would appreciate it.  Thanks!

  • Profile Image
    JotForm Support

    Answered by NeilVicente on July 04, 2011 at 04:22 PM

    Hi,

    Like what my colleague Liyam has suggested, I added a "http://" before the {yourUrl4} placeholder in your form's notification email, and then made a test submit.

    Here is the result:

     

    Let us know if this is what you're trying to accomplish.


    Neil

  • Profile Image

    Answered by klitschkobrofan on July 04, 2011 at 05:26 PM

    Hey thanks.  That worked when I used the url such as www.jotform.com  if I add the http:// part to it though as in http://www.jotform.com  when it publishes it it comes out as http://http//www.jotform.com without a colon on the final http before the slashes..  I guess I can just make a note on the form to only enter domain without the http but any work around for that?  Thanks!

  • Profile Image
    JotForm Support

    Answered by NeilVicente on July 04, 2011 at 05:45 PM

    Hi,

    Apparently there is no workaround to that. Our email alerts system does not provide a conditional function to change the url syntax according to the structure of the url that the user entered.

    The best thing to do is to add a notice, such as a sub-label, in the field. You can also use a hint example to make things clearer to the user.

    Click on your field and then click on these buttons to set the sub-label and hint example

     

    Our finished product:

     

    Hope this helps. Thank you for using Jotform.


    Neil

  • Profile Image

    Answered by klitschkobrofan on July 04, 2011 at 07:25 PM

    Yes, I implemented your suggestion.  Thanks!

  • Profile Image
    JotForm Support

    Answered by liyam on July 04, 2011 at 10:38 PM

    If there's anything else you need assistance with, klitschkobrofan, please don't hesitate to start a new post.  We'll be here to respond.

    Warm regards,

    Liyam

  • Profile Image

    Answered by jonsan32 on February 26, 2012 at 03:33 PM

    I can't get this to work for the ilfe of me! Should I be using text mode or html? Every time I submit, the url completely dissapears. Any suggestions?

     

     


    <table><td valign="top" style="padding-top:40px;"><div align="right"><a target="_blank" href="http://www.officiatin.blogspot.com" rel="nofollow"><img src="//dl.dropbox.com/u/5739741/Images/MHO/mho%20logo.png" width=130></a></div></td><td valign="bottom" style="padding-bottom:40px;"><div align="left"><img src="//dl.dropbox.com/u/11459045/profile.png"></div></td></tr></table><br><br>

     

    <div style="padding-left:90px;"><table cellpadding=10 width="800"><tr><td valign="top">

    <img src="//{profilePicture}" width=200 height=200 style="border:4px solid black;">

    </td><td valign="top" width="580">

    <font style="font-size:23px; font-weight: bold;"> {fullName3}</font><hr size=3 color="#000000"></hr>

    <font style="font-size:13px; font-weight: bold;">{sports}</font><br><br>

    <font style="font-size:13px; font-weight: bold;">Phone: {phoneNumber8}</font><br>

    <font style="font-size:13px; font-weight: bold;">Email: {email4}</font><br><br>

    <font style="font-size:13px; font-weight: bold;">Certified Since: {certifiedSince}</font><br>

    <font style="font-size:13px; font-weight: bold;">Certifications: {certifications}</font><br><br>

     

    </td>

    </tr></table>

    </div>

     

    <br><div align="center"><a target="_blank" href="http://www.officiatin.blogspot.com" rel="nofollow" style="text-decoration:none;">[EXIT THIS PAGE]</a></div>

     

    PRODUCES

     

     

    <table><td valign="top" style="padding-top:40px;"><div align="right"><a target="_blank" href="http://www.officiatin.blogspot.com"><img src="http://dl.dropbox.com/u/5739741/Images/MHO/mho%20logo.png" width=130></a></div></td><td valign="bottom" style="padding-bottom:40px;"><div align="left"><img src="http://dl.dropbox.com/u/11459045/profile.png"></div></td></tr></table><br><br>

     

    <div style="padding-left:90px;"><table cellpadding=10 width="800"><tr><td valign="top">

    <img src="//" width=200 height=200 style="border:4px solid black;">

    </td><td valign="top" width="580">

    <font style="font-size:23px; font-weight: bold;"> Jonathan Sanders</font><hr size=3 color="#000000"></hr>

    <font style="font-size:13px; font-weight: bold;">Basketball</font><br><br>

    <font style="font-size:13px; font-weight: bold;">Phone: (925) 2099360</font><br>

    <font style="font-size:13px; font-weight: bold;">Email: jonsanders32@gmail.com</font><br><br>

    <font style="font-size:13px; font-weight: bold;">Certified Since: June 18, 1923</font><br>

    <font style="font-size:13px; font-weight: bold;">Certifications: Everything you can think of.</font><br><br>

     

    </td>

    </tr></table>

    </div>

     

    <br><div align="center"><a target="_blank" href="http://www.officiatin.blogspot.com" style="text-decoration:none;">[EXIT THIS PAGE]</a></div>

  • Profile Image
    JotForm Support

    Answered by NeilVicente on February 27, 2012 at 10:28 PM

    @jonsan32

    The codes you pasted above should be inserted on the notification email's HTML source. Simply click the small HTML icon in the Compose Email screen (Setup & Embed > Email Alerts > Notification).

    Then, paste your codes on the HTML Source Editor window that pops up.

  • Profile Image

    Answered by jonsan32 on February 27, 2012 at 10:40 PM

    Thanks for the reply, but no dice on it working. The image just comes up blank.

     

    So I have a form on a website that I want to automatically send to blogger to post. I have a text field accepting a URL for an image: http://officiatin.blogspot.com/2012/02/profile-maker.html

     

    I tried an image upload field, that didn't work either. Let me know if this is even possible. I want a client of mine to eb able to post some complicated html without ever having to see it.

  • Profile Image

    Answered by jonsan32 on February 27, 2012 at 10:58 PM

    OK, finally saw the HELP button in the corner of the image tag. I needed to erase the entire <img src> part andreplace it with {imgwhatev:200:200}, the 200's being my width and height. Sorry for overlooking that, and confusingly stating my problem. Have a great day.

  • Profile Image

    Answered by ianpijat on February 29, 2012 at 05:55 PM

    change your httml to text. there are bellow.ok.

  • Profile Image

    Answered by rileymckee on June 10, 2013 at 06:42 AM

    Hello there,

    When I designed the website, I found that many users post URL and Email information, but they just display as a text. I searched articles about automatically hyperlinks URLs but only found some information on simple website tutorials and VB source code for linking.

    The first step to detect URLs and Emails is use of regular expression from which you can automatically detect hyperlink sensitive text and automatically wrap them into the element posting to the same URL. I hope it could be of help.