Sending Custom HTML Emails via PowerShell

Hi Everyone,

I hope COVID restrictions are starting to ease for you all. Still, don’t want to let your guard down too much, ey! Better safe than sorry.

In this post, I’m showing a simple way to send HTML emails from PowerShell. This includes sending emails that contain local images instead of hosting them on a separate website. I might have done this in the past, but I want to just throw this out there again. Lets hop in!

First of all, HTML shows different on EVERY SINGLE DEVICE. Outlook is particularly bad, completely ignoring the head that might contain styling and CSS. So the only way around this is to put the styling on every single element in the HTML body.

Here is the HTML I used, we will discuss what is happening below:

<!DOCTYPE html>
    <html lang="en" xmlns="http://www.w3.org/1999/xhtml" xmlns:o="urn:schemas-microsoft-com:office:office">
    
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width,initial-scale=1">
        <meta name="x-apple-disable-message-reformatting">
        <title></title>
        <!--[if mso]>
          <noscript>
             <xml>
                <o:OfficeDocumentSettings>
                   <o:PixelsPerInch>96</o:PixelsPerInch>
                </o:OfficeDocumentSettings>
             </xml>
          </noscript>
          <![endif]-->
        <style>
            table,
            td,
            div,
            h1,
            p {
                font-family: Arial, sans-serif;
            }
        </style>
    </head>
<body style="margin:0;padding:0;">
        <table role="presentation" style="width:100%;border-collapse:collapse;border:0;border-spacing:0">
            <tr>
                <td align="center" style="padding:0;">
                    <table role="presentation"
                        style="width:800px;border-collapse:collapse;border-spacing:0;text-align:left;">
                        <!--Logo-->
                        <tr>
                            <td align="center" style="padding:40px 0 10px 0">
                                <img src="cid:logo.png" alt="" width="350" style="height:auto;display:block;" />
                            </td>
                        </tr>
                        <tr>
                            <td style="padding:10px 10px 10px 10px;">
                                <table role="presentation"
                                    style="width:100%;border-collapse:collapse;border:0;border-spacing:0;">
                                    <!--First chunk-->
                                    <tr>
                                        <td style="padding:0 0 20px 0">
                                            <h1
                                                style="font-size:38px;margin:0 0 20px 0;font-family:Arial,sans-serif;text-align:center;">
                                                Information Technology
                                            </h1>
                                            <p
                                                style="margin:0 0 12px 0;font-size:16px;line-height:24px;font-family:Arial,sans-serif;">
                                                Dear $firstname,
                                            </p>
                                            <h2 style="font-size:22px;margin:0 0 10px 0;font-family:Arial,sans-serif">
                                                Welcome!
                                            </h2>
                                            <p
                                                style="margin:0 0 12px 0;font-size:16px;line-height:24px;font-family:Arial,sans-serif;">
                                                Generic text can go here
                                            </p>
                                            <h2 style="font-size:22px;margin:0 0 10px 0;font-family:Arial,sans-serif">
                                                Your Login Information
                                            </h2>
                                            <p>
                                                style="margin:0 0 12px 0;font-size:16px;line-height:24px;font-family:Arial,sans-serif;">
                                                More generic text
                                           </p>
                                            <p>
                                                style="margin:0;font-size:16px;line-height:24px;font-family:Arial,sans-serif;">
                                            </p>
                                        </td>
                                    </tr>
								</table
							</td>
                        </tr>
                    </table>
                </td>
            </tr>
        </table>
        </td>
        </tr>
        <!--Footer-->
        <tr>
            <td style="padding:30px;background:#272a36;">
                <table role="presentation"
                    style="width:100%;border-collapse:collapse;border:0;border-spacing:0;font-size:9px;font-family:Arial,sans-serif;">
                    <tr>
                        <td style="padding:0;width:50%;" align="center">
                            <p style="margin:0;font-size:18px;line-height:16px;font-family:Arial,sans-serif;color:#ffffff;">
                                For an additional support, or if you have any questions, please
                                send an email to <a href="mailto:help@example.com"
                                    style="color:#d6d6d6;text-decoration:underline;">help@example.com</a>
                            </p>
                        </td>
                    </tr>
                </table>
            </td>
        </tr>
        </table>
        </td>
        </tr>
        </table>
    </body>
</html>
  • Setting the Office product details and pixel density information
  • The logo.png is loaded using the cid: prefix which looks at the loaded images, you can see this below
  • The rest is just generic HTML with inline styling

Next we need to start creating the PowerShell email object.

#Define a valid SMTP server to send your emails through
$smtpServer = 'SERVER HERE' #e.g smtp.local.com
#Define a new SMTP object using the server defined above
$smtpObject = New-Object Net.Mail.SmtpClient($smtpServer)

#Create a new mail message object 
$msg = New-Object Net.Mail.MailMessage
$msg.From = 'DoNotReply@example.com'
$msg.ReplyTo = 'bccemail@example.com'
$msg.BCC.Add('bccemail@example.com')
$msg.To.Add('recipient@example.com')
$msg.subject = 'Example Email Subject'
$msg.IsBodyHtml = $True

$msg.Body = 'HTML FROM ABOVE - This can be a separate variable or right here'

#Provide a path to the photos for the email
$scriptPath = 'C:\example'

#Create a new mail attachment as an image
$logo = New-Object System.Net.Mail.Attachment -ArgumentList "$scriptPath\logo.png"
$logo.ContentDisposition.Inline = $True
$logo.ContentDisposition.DispositionType = "Inline"
$logo.ContentType.MediaType = "image/png"
$logo.ContentId = 'logo.png'

#Add the image attachment to the email, this allows the HTML to use the cid: prefix
$msg.Attachments.Add($logo)

#Try to send the email
try{
    $smptObject.Send($msg)
}catch{
    Write-Host 'Failed to send the email: ' -ForegroundColor Red -NoNewLine
    Write-Host $Error[0] -ForegroundColor Red
}

#Dispose of the image attachments and the email object to avoid memory leaks
#logo.Dispose()
$msg.Dispose()

Hopefully this shows just how easy it is to create and send HTML emails using PowerShell, including images send directly from the script instead of hosting them and suppling a web page URL.

If you have any questions etc, feel free to comment and I’ll help however I can.

Enjoy! 🙂

Hide Tags from WordPress Blog Posts

So you want to hide tags from your WordPress posts? Easy…

To remove the tags line, you need to find out how to reference it and change its style using CSS. This might sound alien and weird but trust me, you can do it. Or just post a comment if you’re having difficulty 🙂

  1. Open your website, open a post and open the dev tools in your browser. This is usually done by pressing F12
  2. Look at the screenshot below and follow the step:
    1. Press where arrow #1 hints to
    2. Hover over the “Tagged” section as arrow #2 shows
    3. Finally, see the name or ID that is given to that object (Mine is tags-links)

 

3. Now that we have that, we can add some CSS to our site to make this not appear.

4. Go into Appearance -> Customize -> Additional CSS

5. Here we will add the following lines (Note that you should replace this with whatever you found in section 2.3 above):

.tags-links{
    display:none;
}

6. You can see this below:

7. Now when we refresh the page, you should see that your tags have gone completely from all your posts!

Enjoy!

Make Website Confirm Before Leaving

Long pause between blogs here but busy life = slow blog.

In this blog, I will discuss how I created a simple webpage that would allow me to leave a pinned tab open in my web browser that would create a popup box when trying to leave the site. The popup box can be seen below:

This is helpful because Chrome doesn’t give the option to make sure you actually want to close the window. So if you have ever, just like myself, been 2 hours deep into researching something that seemed really important at the time and then accidentally clicked the red X and have it all close, then you know how I feel.

So I created my own website that I would load and pin in the Chome windows so that this wouldn’t happen to me. This is the code that I used:

<script>
 window.onbeforeload = function(){
  return "Do you really want to leave?";
 };
</script>

and the site that I created is currently live at noautoclose.mharwood.uk

Just make sure to click anywhere on the page for the script to work, enjoy!