0

I am trying to add a word to my numbered list. I want to put the word 'STEP ' before the number. I have seen many answers on how to add it in using CSS and counters (like this: How can I prefix ordered list item numbers with a static string using CSS?), but my list is in a generated email. Is there a way to do it inline?

This is my code:

public function createForgotPasswordEmail($transcriberEmail, $newpassword) {
    $attachments = $this->setForgotPasswordAttachmentImages();
    $htmlBody = '<h2>Seven steps to reset your password</h2>';
    $htmlBody .= '<span style="background-color: yellow;font-weight: bold;">Please follow the 7 steps below carefully to reset your password.</span><br>';
    $htmlBody .= '<br>This is a <u>one-time use</u> password.  If not used within 72 hours, it will expire and you will need to request another temporary password.<br><br>';
    $htmlBody .= '<ol><li><strong>Log out of the template manager</strong> (right click on the template manager in the task bar and choose Exit from the menu).</li><br />';
    $htmlBody .= '<img src="cid:exit_from_template_manager.png" width="325" height="149"><br /><br />';
    $htmlBody .= '<li>Copy the password below (highlighted in yellow) and use it to sign in to your account on <a href="https://###/">###</a>.';
    $htmlBody .= '<ul><li style="list-style-type: none;padding-top:5px;padding-bottom:5px;">Password: <span style="background-color: yellow;">' . $newpassword . '</span>';
    $htmlBody .= '</li></ul></li>';
    $htmlBody .= '<br /><img src="cid:log_in_to_###.jpg" width="185" height="175"><br /><br />';
    $htmlBody .= '<li>Once you log in, you will be prompted to change your password. ';
    $htmlBody .= 'A message will appear in red at the top left of the ### page if your password was changed successfully.</li>';
    $htmlBody .= '<br /><img src= "cid:password_successfully_changed_message.png" width="190" height="309"><br /><br />';
    $htmlBody .= '<li>You will now be automatically logged out. Please log in again using your new password.</li>';
    $htmlBody .= '<li>Update your password manager with your new password, if you use one.</li>';
    $htmlBody .= '<li>Log in to the template manager using your new password.</li>';
    $htmlBody .= '<br /><img src="cid:login_to_template_manager.png" width="361" height="298"><br /><br />';
    $htmlBody .= '<li>If you use a separate password manager for the template manager, update your password there too.</li></ol>';
    $htmlBody .= '<br><br>Thank you,<br>###';
    $data = [
        'From' => '###',
        'To' => $transcriberEmail,
        'Subject' => 'Your temporary ### password',
        'Tag' => 'temporaryPasswordSent',
        'HtmlBody' => $htmlBody,
        'Attachments' => $attachments
    ];
    $emailClient = new emailClient();
    return $emailClient->sendEmailWithInlineAttachments($data);

}

Just to be clear, I want to output:

STEP 1. Log out of the...
STEP 2. Copy the...
PortyR
  • 355
  • 1
  • 2
  • 12
  • 1
    No, you can't use pseudo classes inline. – Asons Mar 12 '19 at 09:14
  • Thank you for answering. – PortyR Mar 12 '19 at 09:16
  • 1
    I think your best way to do it “inline”, is to actually have this be part of the text content of the list items to begin with, and disable any `list-style` inline. With anything but inline styles, you run a risk that it gets removed completely or filtered in some way by the application displaying the mail on the recipient side. – 04FS Mar 12 '19 at 09:18
  • @04FS, thank you. I will give it a try. – PortyR Mar 12 '19 at 09:20

0 Answers0