HTML button to open URL in a new window

Question

I'm populating an email template and I'm having some issues with the button onclick event.

What I am trying to achieve is when clicking on the button it should open a URL in a new window rather than a new tab.

Currently when the email gets sent it is losing the onclick event functionality. Any recommendations on how can I achieve this?

I have also tried creating the button in the html template rather than replacing the tags as code below, but still run into the same issue.

HTML Code:

    <p>
        Hi,
    </p>
    <p>
        A [JobType], to start on [JobStartDate]
        <br />
        Click here to view the job: [JobUrl]
    </p>
    <p>
        <b>Job Details:</b>
        <br />
        - Reference: [JobReferenceNumber]
        <br />
        - Checklist: [AnswerEvaluationName]
        <br />
        - Created by: [JobCreator]
        <br />
    </p>
    <p>
        Kind regards<br />
    </p>
    <p class="auto-style6">
        Please do not reply to this system generated email
    </p>
</body>

public void CreateEmailNotificationForNewJob()
{
   // Populate the Email Template
   string EmailRecipientTestingNotes = "";
   string EmailSubject = "";
   string EmailTemplate = EmailSender.LoadEmailTemplate("EmailNewJob.html");
   string EmailTo = "";
   string TestButton = ("<input type=\"button\" onclick=\"window.open('https://www.google.com/','mywin','width=500,height=500');\" >");

   EmailSubject = "Job/task ";
   EmailTemplate = EmailTemplate.Replace("[JobReferenceNumber]", "Reference");
   EmailTemplate = EmailTemplate.Replace("[AnswerEvaluationName]", "Daily Update");
   EmailTemplate = EmailTemplate.Replace("[JobStartDate]", "Today");
   EmailTemplate = EmailTemplate.Replace("[JobType]", "1");
   EmailTemplate = EmailTemplate.Replace("[CompanySiteName]", "");
   EmailTemplate = EmailTemplate.Replace("[SiteName]", "");
   EmailTemplate = EmailTemplate.Replace("[JobUrl]", TestButton);

   EmailTo = "test@test.co.za";

   try
   {
      // Send email code
   }
   catch (Exception ex)
   {
      // Add handling
   }
}

Answer 1

Most email clients don't allow execution of JavaScript like a browser would (usually this is for security reasons).

But if you want to create a link to a URL to display in the email, you can just use a hyperlink instead of a button. (You can of course always use CSS to make it look like a button, if you wish.)

string TestButton = ("<a href='https://www.google.com/'>Click here</a>");

Answer 2

Email clients won't accept JavaScript. The best you can do is to use a standard link with the target attribute set to _blank:

string TestButton = ("<a href='www.blah.com' target='_blank'>link text</a>");

Having said that, most email clients will open in a new/blank tab anyway. However, this is helpful still for those who use click "view this email in your browser" (on Outlook desktop, for example, this is generated automatically).

Answer 3

Just use a hyperlink instead of a button because email clients won't accept JavaScript. Of course you can use css to make it looks like a button.

Button:

string TestButton = ("<a class='button' href='https://www.google.com/'>Click here</a>");

Css:

.button {
font: bold 11px Arial;
text-decoration: none;
background-color: #EEEEEE;
color: #333333;
padding: 2px 6px 2px 6px;
border-top: 1px solid #CCCCCC;
border-right: 1px solid #333333;
border-bottom: 1px solid #333333;
border-left: 1px solid #CCCCCC;
}