Dreamweaver gratuit

Extensions et les tutorials gratuits disponibles sur internet pour Dreamweaver. PHP et ASP. Classement thématique. Blog référencé par Adobe "Communauté Dreamweaver".

06 mai 2008

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

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

Posté par caroder à 08:52 - Créer une newsletter avec Dreamweaver - Commentaires [0] - Rétroliens [0] - Permalien [#]

04 mars 2008

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

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

Posté par caroder à 20:39 - Créer une newsletter avec Dreamweaver - Commentaires [1] - Rétroliens [0] - Permalien [#]

23 novembre 2007

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

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  :

news26

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  :

news27

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.

Posté par caroder à 16:15 - Créer une newsletter avec Dreamweaver - Commentaires [3] - Rétroliens [0] - Permalien [#]

19 juillet 2007

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

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 :

news25

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

Posté par caroder à 19:30 - Créer une newsletter avec Dreamweaver - Commentaires [0] - Rétroliens [0] - Permalien [#]

17 juillet 2007

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

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  :

news9

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 :

news23

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).

Posté par caroder à 19:23 - Créer une newsletter avec Dreamweaver - Commentaires [0] - Rétroliens [0] - Permalien [#]

27 juin 2007

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

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  :

news21

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 :

news22

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

Posté par caroder à 20:27 - Créer une newsletter avec Dreamweaver - Commentaires [0] - Rétroliens [0] - Permalien [#]

28 mai 2007

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

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 :

news17

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 :

news18

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

Posté par caroder à 18:45 - Créer une newsletter avec Dreamweaver - Commentaires [0] - Rétroliens [0] - Permalien [#]

24 mai 2007

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

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 :

news16

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

Posté par caroder à 21:30 - Créer une newsletter avec Dreamweaver - Commentaires [3] - Rétroliens [0] - Permalien [#]

22 mai 2007

PHP : créer une newsletter avec Dreamweaver (Part 12) - Préparation des pages d’administration, méthode des includes

Pour mémoire, nous avons décidé qu’il existerait 2 statuts différents dans l’accès au back office de notre newsletter :
· l’administrateur du site qui peut gérer la base des inscrits, rédiger et expédier des newsletters aux inscrits
· le rédacteur qui a le seul droit de rédiger une newsletter.

Pour faciliter la maintenance future de notre site, nous allons travailler avec la méthode dite des includes. Cette méthode est classiquement utilisée par les développeurs. Nous allons travailler tout d’abord dans la page admin_newsletter.php à partir de laquelle nous allons créer nos includes. Insérez tout d’abord le code ci-dessous créant les éléments de navigation :

<h1 align="center">Espace administration de monsite.com</h1>
<div id="navconteneur" align="center">
<ul id="navigation">
<li><a href="admin_inscrits.php">Administration des inscrits</a></li>
   <li><a href="creer_newsletter.php">Cr&eacute;ation d'une newsletter</a></li>
   <li><a href="#">Se d&eacute;connecter </a></li>
</ul>
</div>
<div id="principal">
<table>
<tr><th>ID</th><th>Titre</th><th>Date de création</th><th>Date d'envoi</th><th>Statut</th><th>Modifier</th><th>Supprimer</th><th>Envoyer</th></tr>
<tr><td align="center">1</td>
  <td>Test de la mise en page pour Mon titre de newsletter </td>
  <td align="center">01/01/2001</td><td align="center">02/01/2001</td>
  <td align="center">0</td>
  <td align="center"><a href="#">M</a></td>
  <td align="center"><a href="#">S</a></td>
  <td align="center"><a href="#">Envoi</a></td>
</tr>
</table></div>

accompagné du code suivant que nous ajoutons à la feuille de style admin.css :

#navconteneur {
margin: 5px 0;
padding: 5px 0;
}
ul#navigation {
margin-left: 0;
padding-left: 0;
}

#navigation li {
display: inline;
list-style-type: none;
margin-right: 10px;
font: bold 11px Verdana, Arial, Helvetica, sans-serif;
}
#navigation a {
color: #fff;
background-color: #0099CC;
text-decoration: none;
padding: 5px 10px;
}

#navigation a:hover {
color: #fff;
background-color: #0086B3;
text-decoration: none;
}
#principal {
font: normal 11px Arial, Helvetica, sans-serif;
margin: 0 20px;
}
table {
width: 100%;
}
td {
border-bottom: 1px solid #CCC;
padding:3px;
background-color:#F7F7F7;
}
th {
background-color:#7DF;
padding:3px;
}

Cliquez ensuite dans la page et allez dans Comportement de serveur >> Authentification de l’utilisateur  >> Restreindre l’accès à la page. Renseignez la fenêtre comme suit :

news13

Le niveau 1 correspond à l’accès administrateur tel que nous l’avons défini précédemment.

Positionnez ensuite votre curseur dans l’item « se déconnecter » du menu de navigation et cliquer sur la balise <a> en bas de la fenêtre Dreamweaver (la totalité du lien doit alors se mettre en surbrillance). Allez dans Comportement de serveur >> Authentification de l’utilisateur  >> Déconnecter l’utilisateur. Renseigner la fenêtre de la façon suivante :

news14

Ouvrez maintenant la page en mode code. Découpez le code suivant :

<h1 align="center">Espace administration de monsite.com</h1>
<div id="navconteneur" align="center">
<ul id="navigation">
<li><a href="admin_inscrits.php">Administration des inscrits</a></li>
   <li><a href="creer_newsletter.php">Cr&eacute;ation d'une newsletter</a></li>
   <li><a href="<?php echo $logoutAction ?>">Se d&eacute;connecter</a> </li>
</ul>
</div>

Ouvrez le bloc_note et collez ce code dedans. Enregistrez le fichier sous le nom menu_admin.inc.

Retourner dans la page Dreamweaver en mode code et selectionnez la totalité du code PHP généré. Découpez le code et copiez-le dans le bloc-note. Sauvegardez sous le nom de acces_admin.inc.

Positionnez-vous maintenant avant la déclaration du doctype créer par Dreamweaver (1er ligne de code) et allez dans le menu Insertion >> Server Side include. Sélectionnez acces_admin.inc.

Juste en dessous de la balise <body> répétez l’opération mais en choisissant cette fois le fichier menu_admin.inc. Executez la page login_newsletter.php. Loggez vous avec les codes dmx-moteur / pw1. Vous devez en principe arriver sur la page admin_newsletter.php telle que ci-dessous :

news15

Dans un premier temps, nous allons donc travailler maintenant toutes les pages avec ces 2 includes ainsi que l'import de la feuille de style CSS et les balises <div> de mise en forme. Dans un deuxième temps nous créerons l’accès, le menu et les pages pour le niveau rédacteur en dupliquant et adaptant ce que nous aurons déjà fait pour le niveau admin.

Ce billet fait partie du tutorial dreamweaver newsletter

Posté par caroder à 20:10 - Créer une newsletter avec Dreamweaver - Commentaires [0] - Rétroliens [0] - Permalien [#]

21 mai 2007

PHP : créer une newsletter avec Dreamweaver (Part 11) - Création de la table des newsletters

Nous partons du principe dans ce tutorial que nous allons envoyer une newsletter « ex nihilo ». J’entends par là que nous ne récupérerons pas d’info en provenance d’une table de news déjà en ligne sur un site pour avertir les abonnés des parutions sur le site. Pour ceux qui souhaiteraient s’orienter vers une telle solution (qui est beaucoup plus ergonomique, j’en conviens), nous proposerons ultérieurement des pistes de réflexion.

Nous allons donc nous contenter ici d’écrire et de mettre en page un texte composé entièrement à partir de l’interface de newsletter. Ce texte fera l’objet d’une mise en page permettant au rédacteur de différencier édito, articles, brèves, etc…

La table comportant les newsletters sera donc faite de la façon suivante :

CREATE TABLE `newsletters` (
  `id_newsletter` int(11) NOT NULL auto_increment,
  `objet` varchar(200) NOT NULL default 'Newsletter de monsite.com',
  `folio` varchar(50) NOT NULL default 'N°XX – mois année',
  `contenu` text NOT NULL,
  `breves` text NOT NULL,
  `date_creation` date NOT NULL default '0000-00-00',
  `date_envoi` date default NULL,
  `statut` tinyint(2) NOT NULL default '0',
  PRIMARY KEY  (`id_newsletter`)
) TYPE=MyISAM AUTO_INCREMENT=1 ;

Le champ « objet » de la table constituera l’objet du mail. Le champ contenu va comporter le corps de la newsletter (édito + articles) et intègrera les feuilles de style permettant sa mise en page. La colonne breves permettra dans le template une mise en page sur 2 colonnes, plus sympathique à l’œil. On différencie la date de création et la date d’envoi. Le statut permet de distinguer les newsletters envoyées de celles en cours de constitution (0 correspondant à non envoyé).

Ce billet fait partie du tutorial dreamweaver newsletter

Posté par caroder à 18:40 - Créer une newsletter avec Dreamweaver - Commentaires [0] - Rétroliens [0] - Permalien [#]



« Accueil  1  2   Page suivante »