Hoi iedereen,

Helaas is er weinig op internet te vinden hoe je de welkoms mail, die naar je klanten verstuurd word, omgezet kan worden naar HTML. Daarnaast als je wel wat vind word er al gauw verwezen naar de hoster. Helaas is dit laatste niet altijd een oplossing.

Graag deel ik hierbij een tutorial die je in een aantal stappen je welkoms mail leert aanpassen.

Niveau: Gemiddeld

Wat heb je nodig:

  • Computer / Laptop
  • HTML editor ( notepad++ o.i.d. )
  • Toegang tot resellers account

Om te starten is het belangrijk om eerst uit te vinden waar het is te vinden om je resellers account in Directadmin.

Log in op je Directadmin resellers account en ga naar ‘Verander gebruikersbericht‘ ( in het Engels ‘Edit user message‘ )

Er opent nu een pop up wat er als volgt uit ziet

Zoals je ziet staat de tekst in het Engels met een aantal tags erin. Bij deze adviseer ik dat je het onderwerp en de hele inhoud van het bericht in je HTML editor plaatst. Zo kan je makkelijker werken aan je nieuwe template.

Open nu in je HTML editor een nieuw leeg tablad, of als je in Kladblok werkt open een nieuw Kladblok ventster.

Het volgende is hetgeen waar je mee begint:

<html>
      <head>
      <title></title>
      </head>
	
      <body>
      </body>
<html>

Houd ten alle tijden de eerste HTML tag clean ( dus geen andere tekst in de tag of erboven zetten ).

In dien gewenst kun je eventuele meta en links tags in de HEADER zetten:

Zodra je klaar bent met de HEADER kun je naar de BODY gaan en je template daadwerkelijk vorm gaan geven. Persoonlijk heb ik de volgende opzet gebruikt:

<html>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
	<title>Uw gegevens</title>
	<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
	<body style="margin: 0; padding: 0;">
		<table border="1" cellpadding="0" cellspacing="0" width="100%">
			<tr>
				<td>
					<table align="center" border="1" cellpadding="0" cellspacing="0" width="600" style="border-collapse: collapse;">
						<tr>
							<td>
								<table align="center" border="1" cellpadding="0" cellspacing="0" width="600">
									<tr>
										<td align="center" bgcolor="#70bbd9" style="padding: 40px 0 30px 0;">
										Row 1
										</td>
									</tr>
									<tr>
										<td bgcolor="#ffffff" style="padding: 40px 30px 40px 30px;">
											<table border="1" cellpadding="0" cellspacing="0" width="100%">
												<tr>
													<td>
													Lorem ipsum dolor sit amet!
													</td>
												</tr>
												<tr>
													<td style="padding: 20px 0 30px 0;">
													Lorem ipsum dolor sit amet, consectetur adipiscing elit. In tempus adipiscing felis, sit amet blandit ipsum volutpat sed. Morbi porttitor, eget accumsan dictum, nisi libero ultricies ipsum, in posuere mauris neque at erat.
													</td>
												</tr>
												<tr>
													<td>
														<table border="1" cellpadding="0" cellspacing="0" width="100%">
															<tr>
																<td width="260" valign="top">
																Column 1
																</td>
																<td style="font-size: 0; line-height: 0;" width="20">
																&nbsp;
																</td>
																<td width="260" valign="top">
																Column 2
																</td>
															</tr>
													</table>
													</td>
												</tr>
											</table>
										</td>
									</tr>
									<tr>
										<td bgcolor="#ee4c50" style="padding: 30px 30px 30px 30px;">
											<table border="1" cellpadding="0" cellspacing="0" width="100%">
												<tr>
													<td>
													Column 1
													</td>
													<td>
													Column 2
													</td>
												</tr>
											</table>
										</td>
									</tr>
								</table>
							</td>
						</tr>
					</table>
				</td>
			</tr>
		</table>
	</body>
</html>

Nu kun je zelf aan de slag gaan met het invullen van je welkoms mail.

Mocht je graag willen weten hoe ik bovenstaande voorbeeld heb gebruikt? Kijk dan mijn resultaat via de volgende link:

https://www.devq.nl/vimexx/welkom.html

Uiteraard dien je nu je gemaakte template bij je Directadmin toe te voegen.

Mochten er nog vragen zijn, dan zie ik ze graag tegemoet op de Vimexx forum.