Dreamweaver gratuit

Sommaire du tutorial Newsletter avec Dreamweaver et PHP

22 novembre 2009 | Posté par caroder à 18:09

Suite aux remarques de quelques internautes, je mets en ligne le sommaire complet de ce tutorial afin qu'il soit accessible depuis une page unique de ce blog (chaque lien ouvre une nouvelle page). Je rappelle à ceux qui ne souhaitent pas mettre en oeuvre une solution complexe ou ceux qui sont grands débutants avec Dreamweaver qu'ils peuvent consulter mon tutorial très simple sur l'expédition d'une page HTML par mail (par exemple, vous avez déjà travaillé votre newsletter HTML dans Dreamweaver et vous voulez simplement envoyer cette page par mail mais vous ne savez pas comment faire).

Le tutorial ci-dessous permet de créer une interface complète d'administration de newsletters au sein d'un site en récupérant des adresses e-mail déposées par des visiteurs. Il nécessite une première expérience de développement de sites en PHP même s'il reste relativement simple d'accès.

1. Introduction au tutorial "créer une newsletter avec Dreamweaver"
2. Table MySQL "Inscriptions"
3. Insertion données utilisateurs
4. Génération aléatoire et automatique de mot de passe
5. Vérification de la saisie des champs
6. Vérification de l’existence de doublon dans la base
7. Validation du formulaire : système anti-spam Captcha
8. Initialisation du back office d’administration
9. Page de login du back office
10. Création de la table des newsletters
11. Préparation des pages d’administration, méthode des includes
12. Création du template de la newsletter
13. Page de création de la newsletter
14. Installation et paramétrage de FCK Editor
15. Preview de la newsletter
16. Page de modification de la newsletter
17. Page de suppression d’une newsletter
18. Page d'envoi de la newsletter
19. Système d'abonnement et de désabonnement à la newsletter
20. Templates gratuites pour créer vos newsletters

Templates de newsletters gratuites

| Posté par caroder à 18:06

Voici plus de 30 templates de newsletters gratuites que vous pouvez utiliser dans le cadre de mon tutorial "Créer une newsletter avec Dreamweaver, PHP et MySQL".

La particularité de ces templates est d'avoir été testées sur la plupart des clients existants, y compris webmails (type Yahoo mail, Hotmail, Gmail - y compris nouvelle version -, etc).

Pour télécharger et voir ces templates gratuites : http://www.campaignmonitor.com/templates/

Système de gestion d'abonnement à des newsletters thématiques par les utilisateurs

06 mai 2008 | Posté par caroder à 08:52

Joseph Lowery propose depuis le 28 avril dernier un tutorial en anglais sur un système de gestion d'abonnement thématique à des newsletters.

Dans cet article, vous apprendrez comment permettre à vos visiteurs de gérer eux-mêmes leurs abonnements. En bonus, comment incorporer un message d'erreur sur une page de login créée avec Dreamweaver.

Les pages créées avec ce tuto :

• Login.php: la page vérifie l'adresse e-mail et le mot de passe des visiteurs qui veulent modifier leurs paramètres d'abonnement. Affichage éventuel du message d'erreur sur la page.
• Manage_sub.php: gestion des abonnement via des cases à cocher.
• Thank_you.php: page de remerciements.
• Logout.php: script de déconnexion.

Pour découvrir ce tutorial en anglais :(( : http://www.adobe.com/devnet/dreamweaver/articles/sub_multiple.html

PHP - Système d'abonnement / désabonnement à une newsletter

04 mars 2008 | Posté par caroder à 20:39

Le site Adobe a publié courant janvier un article extrêmement interessant signé Joseph Lowery sur le développement d'un système d'abonnement / désabonnement à une newsletter. Cet article vient compléter très utilement mon propre tutorial sur le développement d'une newsletter.

Ce tuto nécessite l'utilisation de Dreamweaver ainsi que l'ajout d'un peu de code à la main. Le fonctionnel proposé est le suivant :

• abonnement de l'utilisateur par simple saisie de son email
• réception d'un email de confirmation d'inscription contenant un lien de désinscription personnel en cas de besoin.

Le tutorial comprend le développement de 5 pages :

• Subscribe.php : Formuliare permettant l'insertion de l'enregistrement comprenant l'email dans la basepuis redirection vers la page confirm_subscribe.php.
• Confirm_subscribe.php : envoi de l'email de confirùmation d'inscription contenant un lien de désinscription via la page confirm_unsubscribe.php.
• Error_subscribe.php : page d'erreur en cas d'impossibilité d'envoyer l'email de confirmation.
• Confirm_unsubscribe.php : page contenant le bouton de désincription propre à l'utilisateur.
• Unsubscribe_complete.php : confirmation en ligne de la désinscription.

Voici le lien vers ce superbe tuto (en anglais malheureusement :(( ):
http://www.adobe.com/devnet/dreamweaver/articles/subscribing_unsubscribing_with_php.html

Page d'envoi de la newsletter - PHP : Créer une newsletter avec Dreamweaver (Part 19)

23 novembre 2007 | Posté par caroder à 16:15

Merci à tous de votre patience ! Mon activité professionnelle me laisse à nouveau le loisir de reprendre la publication de ce tuto bien que l'interruption ait été bien plus longue que prévue !

Nous arrivons ici au cœur du sujet… Nous allons pour cela utiliser la fonction mail() de PHP pour procéder à l’expédition des newsletters.

Note importante sur la fonction mail() : cette fonction, très utile au demeurant, n’est en principe pas faite pour envoyer des mails en masse. Il est préférable pour cela d’utiliser un serveur SMTP. Avec une page exécutant la fonction mail de PHP vous pouvez en effet, en cas de données importantes à traiter (notamment nombre de destinataires), tomber en timeout. Il existe des solutions pour pallier à ce problème sans utiliser de serveur SMTP : exécuter le script par paquets de 30, 50 (ou plus) adresses mails. Plus le mail à envoyer est léger, plus vous pouvez envoyer de mails. J’ai quant à moi entendu parler de plus de 10000 mails envoyés au moyen d’un script mail() avec un timeout serveur à 30 minutes… A vous donc de vous adapter en fonction de ces différents paramètres. En tout état de cause, il vaut mieux envoyer vos newsletters à des moment de la journée où les serveurs ne sont pas trop saturés. Reportez-vous donc à vos statistiques de fréquentation pour déterminer l’heure optimale d’expédition (ou si vous êtes en hébergement mutualisé interrogez votre hébergeur). A noter aussi, certains hébergeurs interdisent l’envoi en masse de newsletter (notamment Free qui a désactivé la fonction).

Faites Fichier >> Nouveau. Choisissez « Pages dynamiques » et « PHP ». Enregistrer la page en la nommant envoi_newsletter.php. Afficher la fenêtre en mode code.

A la 1re ligne, faites insertion >> Server Side Include et sélectionnez le fichier acces_admin.inc.
Après la balise body, faites insertion >> Server Side Include et sélectionnez le fichier menu_admin.inc.
N’oubliez pas d’importer votre feuille de style admin.css.

Vous devez tout d’abord sélectionner les adresses mails qui permettront l’expédition de votre newsletter à ses destinataires.
Allez dans le panneau Liaison >> Jeu d’enregistrement. Renseignez votre fenêtre comme ci-dessous  :

Vous devez ensuite créer un enregistrement permettant de filtrer la newsletter que vous souhaitez envoyer. Celle-ci est déterminée par le paramètre d’URL transmis par le lien de la page admin.php.
Allez dans le panneau Liaison >> Jeu d’enregistrement. Renseignez votre fenêtre comme ci-dessous  :

Il s’agit maintenant :
- d’instancier la variable d’objet du mail et la variable de contenu du mail,
- de créer la boucle qui permet d’expédier un mail à chaque destinataire,
- de créer l’en-tête du mail.

En dessous de la ligne :

$totalRows_Recordset2 = mysql_num_rows($Recordset2);

Ajouter la ligne de code suivante qui crée la variable d’objet du mail :

$titre = $row_Recordset2['objet'] ;

Maintenant, pour le contenu du mail :

$contenu = "<html><body> </body></html>";

Dans la balise <body> copiez/collez le code suivant correspondant au template vide la newsletter (attention, les doubles quotes ont été remplacé par des simples quotes, ce qui est volontaire ) :

<style type='text/css'>
div.conteneur {
margin: 10px;
width: 700px;
}
div.header1 {
background-color:#FF6600;
background-image:url(http://www.monsite.com/img/logo.jpg);
background-repeat:no-repeat;
background-position:10px 10px;
font: normal 24px Arial, Helvetica, sans-serif;
padding:23px 10px 23px 180px;
color: #fff;
}
div.header2 {
background-color:#0099CC;
font: bold 11px Verdana, Arial, Helvetica, sans-serif;
padding:5px;
color:#fff;
text-align:right;
}
div.contenu {
font: normal 11px Arial, Helvetica, sans-serif;
color:#777;
margin: 15px 0 0 0;
line-height:15px;
width: 530px;
float:left;
}
p.edito {
border: 2px solid #0099CC;
padding:15px;
line-height:18px;
}
h1.article1 {
font: bold 13px Georgia, 'Times New Roman', Times, serif;
color:#f60;
border-bottom: 1px solid #f60;
margin-top:20px;
}
p.article2 {
color:#555;
}
div.breves {
float: right;
width: 150px;
margin: 15px 0 0 10px;
background-color:#FFDFCA;
padding: 5px;
}
h2.breves1 {
font: bold 11px Verdana, Arial, Helvetica, sans-serif;
color:#f60;
}
p.breves2 {
font: normal 10px Verdana, Arial, Helvetica, sans-serif;
}
div.pied {
clear:both;
border-top: 1px dotted #ccc;
font: normal 11px Arial, Helvetica, sans-serif;
color:#999;
text-align:center;
margin-top: 20px;
padding: 5px;
}
</style>
<div class='conteneur'>
<div class='header1'>
La Lettre newsletter de monsite.com
</div>
<div class='header2'>";
$contenu .= echo $row_Recordset2['folio'];
$contenu .= "</div>
<div class='contenu'>";
$contenu .= echo $row_Recordset2['contenu'];
$contenu .= "</div>
<div class='breves'>";
$contenu .= echo $row_Recordset2['breves'];
$contenu .= "</div>
<div class='pied'>Disclaimer de la newsletter de monsite.com
<br />
<a href='newsletters/desabonne.php'>Se désabonner de cette newsletter</a></div>
</div>

Il faut maintenant créer le fonctionnel qui va expédier la newsletter à chaque abonné.

Nous allons pour cela nous inspirer de l’excellent tutorial de Jpierre sur le site ASP-PHP.net : http://www.asp-php.net/tutorial/asp-php/envoi_lettre.php

Insérer une balise <form> dans votre page que vous nommez form_list et cérer un tableau à 5 colonnes comportant les intitulés suivants (balises <th>) : Abonné,  Fonction, Organisation, Mail, Expédition. Dans la 1re balise <td>, faites cliquer/glisser des variables {Recordset2.nom}, {Recordset2.fonction}, {Recordset2.organisme} et {Recordset2.mail}. Dans la 5e colonne ajouter une case à cocher que vous nommerez check_mail[] (les crochet sont importants).

Vous devez maintenant attribuer à cette case à cocher la valeur de la variable mail (vous pouvez faire un cliquer/glisser ou coder à la main):

<input name="check_mail[]" type="checkbox" id="check_mail[]" value="<?php echo $row_Recordset2['mail']; ?>" />

En dessous de votre 1er tableau, ajoutez-en un second avec 3 colonnes sur une ligne. Dans chacune des cellules insérez un bouton :

· 1er bouton : Tout sélectionner – ne cocher aucune action
· 2e bouton : Tout sélectionner – ne cocher aucune action
· 3e bouton : Envoyer la newsletter – action = envoyer le formulaire

Allez maintenant dans la balise <head> et ajouter le code javascript suivant :

<script>
        function check() {
               adresse_mail = "";
                for (i=0; i<document.form_list.elements.length; i++) {
                        if (document.form_list.elements[i].checked==1) {
                                if (adresse_mail != "")
                                        adresse_mail += ',' + document.form_list.elements[i].value;
                                else
                                        adresse_mail = document.form_list.elements[i].value;
                        }
                }
                return adresse_mail;
        }
      
        function set(n) {
                for (i=0; i<document.form_list.elements.length; i++)
                        document.form_list.elements[i].checked = n;
        }
        </script>

Allez maintenant dans la table contenant les boutons et ajouter les éléments suivants (en gras ci-dessous) :

<tr>
    <td><input name="selection" type="button" value="Tout s&eacute;lectionner" onclick="set(1)" /></td>
    <td><input name="deselection" type="button" id="deselection" value="Tout d&eacute;selectionner" onclick="set(0)" /></td>
    <td><input type="submit" name="Submit" value="Envoyer la lettre" /></td>
  </tr>

Dans le code PHP de la page, rajouter les ligne suivante correspondant à l’envoi du formulaire :

$editFormAction = $_SERVER['PHP_SELF'];
  if (isset($_SERVER['QUERY_STRING'])) {
    $editFormAction .= "?" . htmlentities($_SERVER['QUERY_STRING']);
}

Vous vous souvenez que plus haut dans ce tuto nous avions instancié la valeur de la variable $titre. Au dessus de cette ligne, ajouter le code suivant (qui est commenté pour une meilleure compréhension) :

// on appelle la méthode post
  if (isset($_POST['check_mail']) && $_POST['check_mail'] != "") {
// on avertit l'utilisateur
  echo "<p><strong>Le processus d'envoi de mail est en cours... Vous allez être redirigé vers la page d'administration.</strong></p>";

Nous allons, en même temps que nous envoyons la newsletter, mettre à jour la table newsletter afin qu’une même newsletter ne soit pas envoyé 2 fois par erreur. Pour cela ajoutons deux champs masqués dans notre formulaire, en dessous de nos boutons (nous reviendrons plus tard sur la page admin_newsletter .php) :

<input name="id_newsletter" type="hidden" class="input" id="id_newsletter" value="<?php echo $row_Recordset1['id_newsletter']; ?>" />
<input name="date" type="hidden" class="input" id="date" value="<? echo date("Y-m-d"); ?>" />

A la suite de l’instanciation de la variable $contenu, ajoutons le code suivant :

  // on ajoute un entête au mail afin qu’il s’affiche en HTML pour sa mise en forme
  $entete = "From:moi@monsite.com\nMime-Version: 1.0\n"; 
  $entete .= "Content-Type: text/html; charset=ISO-8859-1\n";
 
  // ici le script de Jpierre envoyant la newsletter
  for ($i=0; $i<sizeof($_POST['check_mail']); $i++) {
    if (!mail($_POST['check_mail'][$i],$titre,$contenu,$entete)) {
      echo "<p>erreur d'envoi</p>";
    } else {
      echo "<p>mail envoyé à :";
      echo $_POST['check_mail'][$i]."</p>";
  // Les lignes ci-dessous mettent à jour la table newsletter pour ajouter une sécurité dans l’interface
   $updateSQL = sprintf("UPDATE newsletters SET date_envoi=%s, statut='1' WHERE id_newsletter=%s",
                       GetSQLValueString($_POST['date'], "date"),
                       GetSQLValueString($_POST['id_newsletter'], "int"));

  mysql_select_db($database_connRecherche, $connRecherche);
  $Result1 = mysql_query($updateSQL, $connRecherche) or die(mysql_error());
    }
  }
}
// Si la date d’envoi est bien renseignée et donc le script s’est correctement exécuté on re-route l’utilisateur sur la page d’admin.
if (isset($_POST['date']) && $_POST['date'] != "") {
header('Location: admin_newsletter.php');
}

Voilà nous en avons terminé avec la partie la plus importante de notre administration. Vous pouvez télécharger ci-dessous le totalité du code de la page :

code_envoi

Les prochains billets seront consacrés aux derniers réglages et aux finitions de notre application, notamment la mise à jour de la page admin_newsletter.php et la page de désabonnement à la newsletter.

Page de suppression d’une newsletter - PHP : Créer une newsletter avec Dreamweaver (Part 18)

19 juillet 2007 | Posté par caroder à 19:30

Faites Fichier >> Nouveau. Choisissez « Pages dynamiques » et « PHP ». Enregistrer la page en la nommant supprime_newsletter.php. Afficher la fenêtre en mode code.

A la 1re ligne, faites insertion >> Server Side Include et sélectionnez le fichier acces_admin.inc.
Après la balise body, faites insertion >> Server Side Include et sélectionnez le fichier menu_admin.inc.
N’oubliez pas d’importer votre feuille de style.

Nous allons maintenant créer le script de suppression d’une newsletter.
Dans l’onglet Application de la fenêtre principale et cliquez sur l’icône «Supprimer l’enregistrement ». Renseigner la fenêtre comme suit :

Pour vérifier que le script fonctionne normalement, tentez de supprimer une newsletter depuis la page admin_newsletter.php.

Page de modification de la newsletter - PHP : Créer une newsletter avec Dreamweaver (Part 17)

17 juillet 2007 | Posté par caroder à 19:23

Faites Fichier >> Nouveau. Choisissez « Pages dynamiques » et « PHP ». Enregistrer la page en la nommant modif_newsletter.php. Afficher la fenêtre en mode code.

A la 1re ligne, faites insertion >> Server Side Include et sélectionnez le fichier acces_admin.inc.
Après la balise body, faites insertion >> Server Side Include et sélectionnez le fichier menu_admin.inc.
N’oubliez pas d’importer votre feuille de style.

Nous allons maintenant créer le formulaire d’insertion permettant de modifier du contenu dans notre newsletter.
Vous devez tout d’abord créer un enregistrement permettant de filtrer le contenu  à afficher.
Allez dans le panneau Liaison >> Jeu d’enregistrement. Renseignez votre fenêtre comme ci-dessous  :

Dans l’onglet Application de la fenêtre principale et cliquez sur l’icône « Insérer un enregistrement : Assistant de formulaire de mise à jour d’enregistrement ». Renseigner la fenêtre comme suit :

Vous noterez que les champs « id_newsletter » et « statut » sont des champs masqués.

Vous devez maintenant adapter le formulaire obtenu à vos besoins. Pour cela il vous faut changer les balises <input> créées automatiquement par Dreamweaver par des <textarea>.
Ainsi la ligne :

<input type="text" name="contenu" value="<?php echo $row_Recordset1['contenu']; ?>" size="32">

Devient

<textarea name="contenu" cols="70" rows="10"><?php echo $row_Recordset1['contenu']; ?></textarea>

Faites de même pour le champ “breves”. Intégrez ensuite FCK Editor (cf. le chapitre idoine de ce tutorial disponible en cliquant sur le lien).

Preview de la newsletter - PHP : Créer une newsletter avec Dreamweaver (Part 16)

27 juin 2007 | Posté par caroder à 20:27

Ouvrez votre page de template finale de la newsletter (celle que vous avez purgée du faux texte qui vous a servi a construire votre mise en page).

Allez dans le panneau Liaison >> Jeu d’enregistrement. Renseignez votre fenêtre comme ci-dessous  :

Toujours dans le panneau Liaison, déployez le jeu d’enregistrement ainsi créé et afficher  votre fenêtre principale en mode code.

Faites cliquer-glisser les différents items dans les balises <div> prévues à cet effet :

<div class="conteneur">
<div class="header1">
La lettre de monsite.com
</div>
<div class="header2">
<?php echo $row_Recordset1['folio']; ?>
</div>
<div class="contenu">
<?php echo $row_Recordset1['contenu']; ?>
</div>
<div class="breves">
<?php echo $row_Recordset1['breves']; ?>
</div>
<div class="pied"> Disclaimer de la newsletter de monsite.com
<br />
<a href="#">Se désabonner de cette newsletter</a></div>
</div>

Faites F12 pour vérifier votre travail en ajoutant à votre URL « ?id_newsletter=ici-votre-chiffre-d’id ».

Si tout se passe bien et que vous ayez testé votre page d’insertion avec un peu de faux texte, vous devriez voir ceci :

Nous laissons pour le moment le lien de désabonnement en l’état, nous y reviendrons ultérieurement.

Page creer_newsletter.php - PHP : créer une newsletter avec Dreamweaver (Part 14)

28 mai 2007 | Posté par caroder à 18:45

Faites Fichier >> Nouveau. Choisissez « Pages dynamiques » et « PHP ». Enregistrer la page en la nommant creer_newsletter.php. Afficher la fenêtre en mode code.

A la 1re ligne, faites insertion >> Server Side Include et sélectionnez le fichier acces_admin.inc.
Après la balise body, faites insertion >> Server Side Include et sélectionnez le fichier menu_admin.inc.
N’oubliez pas d’importer votre feuille de style.

Nous allons maintenant créer le formulaire d’insertion permettant d’insérer du contenu dans notre newsletter.
Dans l’onglet Application de la fenêtre principale et cliquez sur l’icône « Insérer un enregistrement : Assistant de formulaire d’insertion d’enregistrement ». Renseigner la fenêtre comme suit :

Aménagez la présentation de votre formulaire comme vous le souhaitez. Il vous faut cependant impérativement 2 <textarea> pour les champs « Contenu » et « Brèves ». Ces champs texte multilignes nous servirons pour l'implémentation de l'éditeur de texte permettant l'utilisation de nos feuilles de style. Le rendu après mise en forme est celui-ci :

Nous verrons dans mon prochain billet l'installation et le paramétrage de l'éditeur de texte.

Ce billet fait partie du tutorial dreamweaver newsletter

PHP : créer une newsletter avec Dreamweaver (Part 13) - Création du template de la newsletter

24 mai 2007 | Posté par caroder à 21:30

Avant de travailler sur l’interface de création de newsletter proprement dite, nous devons auparavant créer le template de la newsletter. Nous utiliserons pour cela les CSS pour lesquelles nous devons respecter un certain nombre de règles que vous trouverez ici.

Selon les préceptes de la mise en page CSS nous devons :
1. créer une div intégrant l’ensemble de la mise en page
2. intégrer les styles en dessous de cette div

Nous partons du principe que nous allons travailler sur 2 colonnes : une colonne contenant l’édito et les articles, une colonne contenant les brèves. La mise en page sur 2 colonnes en CSS se fait via le positionnement float.

Je vous conseille de travailler en faux texte votre template pour avoir un bon rendu de la mise en page finale. Voici pour ma part le template que je vais utiliser (on peut évidemment faire beaucoup mieux !) :

<body>
<style type="text/css">
div.conteneur {
margin: 10px;
width: 700px;
}
div.header1 {
background-color:#FF6600;
background-image:url(http://www.monsite.com/img/logo.jpg);
background-repeat:no-repeat;
background-position:10px 10px;
font: normal 24px Arial, Helvetica, sans-serif;
padding:23px 10px 23px 180px;
color: #fff;
}
div.header2 {
background-color:#0099CC;
font: bold 11px Verdana, Arial, Helvetica, sans-serif;
padding:5px;
color:#fff;
text-align:right;
}
div.contenu {
font: normal 11px Arial, Helvetica, sans-serif;
color:#777;
margin: 15px 0 0 0;
line-height:15px;
width: 530px;
float:left;
}
p.edito {
border: 2px solid #0099CC;
padding:15px;
line-height:18px;
}
h1.article1 {
font: bold 13px Georgia, "Times New Roman", Times, serif;
color:#f60;
border-bottom: 1px solid #f60;
margin-top:20px;
}
p.article2 {
color:#555;
}
div.breves {
float: right;
width: 150px;
margin: 15px 0 0 10px;
background-color:#FFDFCA;
padding: 5px;
font: normal 10px Verdana, Arial, Helvetica, sans-serif;
}
h2.breves1 {
font: bold 11px Verdana, Arial, Helvetica, sans-serif;
color:#f60;
}
div.pied {
clear:both;
border-top: 1px dotted #ccc;
font: normal 11px Arial, Helvetica, sans-serif;
color:#999;
text-align:center;
margin-top: 20px;
padding: 5px;
}
</style>
<div class="conteneur">
<div class="header1">
La lettre de monsite.com
</div>
<div class="header2">
N°1 - juin 2007
</div>
<div class="contenu">
  <p class="edito">Ici texte
  <br /><br />
  Ici texte
  <br />
  <br /><br />
  <strong>Antoine Dupont</strong><br />
  <em>Rédacteur en chef de monsite.com</em></p>

<h1 class="article1">Titre du premier article  </h1>
<p class="article2"> Ici texte
<br /><br />
<strong>Pour en savoir plus :</strong> <a href="http://www.monsite.com/article.php?id_article=25">http://www.monsite.com/article.php?id_article=25</a></p>
<h1 class="article1">Titre du 2e article de la newsletter </h1>
<p class="article2"> Ici texte
<br /><br />
<strong>Pour en savoir plus :</strong> <a href="http://www.monsite.com/article.php?id_article=25">http://www.monsite.com/article.php?id_article=32</a></p>
</div>
<div class="breves">
<h2 class="breves1">ICI TITRE DE CETTE COLONNE  </h2>
<p class="breves2"> Ici texte </p>
<h2 class="breves1">Ici titre 1  </h2>
<p class="breves2"> Ici texte <br />
    <strong><a href="#">Lire la suite</a></strong></p>
<h2 class="breves1">Ici titre 2  </h2>
<p class="breves2">Ici texte</p>
<h2 class="breves1">Ici titre 3 </h2>
<p class="breves2">Ici texte</p>
</div>
<div class="pied"> Disclaimer de la newsletter de monsite.com
<br />
<a href="#">Se désabonner de cette newsletter</a></div>
</div>
</body>

La prévisualisation dans le navigateur donne ceci :

Pour le template final, nous allons supprimer tout ce qui relèvera de la mise en forme via l’éditeur HTML (TinyMCE).

Il ne restera donc plus que ceci dans le fichier après la balise <body> (hors les feuilles de styles ) :

<div class="conteneur">
<div class="header1">
La lettre de monsite.com
</div>
<div class="header2">
</div>
<div class="contenu">
</div>
<div class="breves">
</div>
</div>

Ce billet fait partie du tutorial dreamweaver newsletter