Cutenews installation

1. Téléchargez cutenews et déziper dans un dossier nommé « cutenews »
2. uploadez sur votre site
3. Vous devez chmoder le dossier cutenews/data/ et tous les fichies qui se trouve à l’intérieur en 777
4. Pour finir ouvrez votre site http://votresite.com/cutenews/index.php et suivez les instructions.

Bon voici un petit article pour vous parlez des flux rss … je sais que d’autres sites en on déjà parlé mais vaut mieux deux fois qu’une !!! si vous êtes toujours pas convaincu après ça!

RSS …mais à quoi ça sert ?
Alors je suis pas une experte mais… je vais essayer d’expliquer à quoi ça sert, parce que pour moi c’est un outil génial et surtout gain de rapidité pour s’informer des mises à jours et des nouveaux articles
de tous vos blogs et site préférés que vous aimez suivre régulièrement.

Le but est donc de voir immédiatement qui a mis son site a jour en y postant un nouvel article.
c’est bien plus rapide que d’aller dans ses favoris et de cliquer sur tous les sites que l’on aime … pour voir si tel ou tel personnes à écrit quelque chose de nouveau !!! non ???

Pour ma part… ma grande passion du moment est la fimo et il existe énormément de site sur la fimo…et comme j’aime voir les nouvelles créations, les tutos, et les différentes trouvailles concernant ce sujet…
je perdrai énormément de temps a naviguer sur tous ses sites… Je crois qu’en ce qui concerne la fimo j’en suis a 162 sites mais les 162 blogueuses n’écrivent pas toutes et tous les jours en même temps  !! heureusement. quoi que !!! lol

Vous avez déjà dû voir sur certains blogs un petit carré orange  ou il est marqué :

• flux des articles
• rss
• fil des articles
• Syndication de contenu

Quand vous cliquez dessus vous arrivez sur une page xml ou l’on voit un tas de charabia et ou il faut lire entre les lignes ça c’est si vous utilisé Internet explorer comme ci dessous

RSS SOUS IE

Si vous êtes sous firefox ça ressemblera a ça :

RSS SOUS FIREFOX

c’est pourtant la même page mais firefox gère mieux !

Bon après … !? j’en fait quoi de cette page ?? hein ???

Et bien je l’ajoute a un « Reader » c’est à dire à lecteur de flux pour ces fameuses pages.
Donc moi …comme je suis sur google en moteur de recherche … j’utilise donc …le « Reader » de google.
Dedans j’y ajoute tous mes flux des blogs préférés … que ce soit cuisine, pixel, fimo, ou autre …

Des readers pour exemple

• google
• yahoo
• msn
• opera
• safari

voilà le « Reader de google »  et la partie gestion des flux

RSS READER

GESTION DES FLUX

pour google « reader » il faut s’inscrire mais c’est rapide et l’avantage c’est que partout ou vous allez, vous pouvez vous connecter et vous avez vos sites préféré sous la main et non plus dans les favoris de votre ordinateur resté à la maison…
Vous n’êtes pas obligé de créer une nouvel adresse gmail vous pouvez vous inscrire avec votre email actuel ….genre hotmail …

Mais la newsletter a sert à quoi alors ?
Certaines vont me dire … mais il y a la newsletter pour être informé !! oui certe … mais bonjour la surcharge dans les mails et le trie si je dois recevoir 162 newsletter !! pfff
nan la newsletter je m’y abonne que sur certains sites ou il n’y a pas de flux.
Ou parfois je m’abonne aux 2 pour être sûr de ne pas loupé une info.

Si je ne trouve pas le lien RSS ?
Petite précision… les flux se trouvent principalement sur des blogs…
j’entends par là .. les sites qui ont des articles par date… comme un journal.

Sur certains blog il se peut que dans la barre de naviguation on ne trouve pas ce petit lien ou carré orange…
mais ça ne veut pas forcement dire que le flux n’existe pas… c’est peut être juste l’auteur qui a preféré le retirer pour une question de design
ou qu’il n’a pas pensé à le mettre.
Je vous donne une astuce … il suffit d’ajouter à la fin du blog en question la partie en gras

pour     canalblog    http://PSEUDO.canalblog.com/rss.xml
pour     blogspot    http://PSEUDO.blogspot.com/rss.xml
pour     wordpress     http://TITREDUSITE.com/?feed=rss2
pour     overblog    http://PSEUDO.over-blog.com/rss2.php
pour     unblog        http://PSEUDO.unblog.fr/feed/
pour     doclear        http://TITREDUSITE.com/rss.php
pour     doclear 2  http://TITREDUSITE.com/index.php?feed/atom
pour     hautetfort    http://PSEUDO.hautetfort.com/index.rss
sur les blog msn aussi vous trouverez le flux

Sinon autre astuce si vous naviguer avec mozilla firefox … regarder en haut dans la barre d’adresse … si le carré orange apparait alors c’est que le flux existe sur le site ou vous êtes.

Petit clin d’oeil a Mélu avec son site

ASTUCE

Importation / Exportation de flux (petit tuto)
Je vous ai exporté mes flux
- 162 blogs sur la fimo ou loisirs créatifs
- 11 blogs sur la cuisine
- 2 blog concernant le pixel
- 4 flux perso ( site, commentaire du site, mes photos flickr , ma liste de partage de flux)

suffit de télécharger le fichier ci-dessous et d’aller dans votre « Reader » préféré.

Si vous êtes inscrit sur google (igoogle) voici la marche a suivre sinon créez vous un compte.

Quand vous êtes sur la page google

GOOGLE PERSO

vous cliquez sur « plus » puis « Reader » en haut a gauche

IMPORTATION

cliquez sur paramètre en haut a droite, puis sur l’onglet importer/exporter puis cliquez sur parcourir et ajouter le fichier « JUSTSEVgoogle-reader.xml »
voilà c’est fait.

Encore plus loin !!!!
Dans google reader vous pouvez vous créer votre propre page de partage de flux. C’est a dire que si vous avez trouvé un article sympa… ou tout simplement pour lui faire un coup de pub … vous cliquez sur « partager » ou « partager avec une note »…

RSS PARTAGE

Un exemple de partage avec un article de Mélu

Ensuite vous suffit de faire connaitre votre liste de partage ou de la mettre quelque par sur votre site .. tout comme je l’ai fait ici sur mon site dans flux partagés

ça donne ceci sur mon site en insérant un code

sinon voici la page d’origine des flux partagés

Bon ça peut vous sembler compliqué tout ça… mais c’etait vraiment pour aller jusqu’au bout de mon tuto … et puis allez voir dans « google reader » il est très simple a gérer et comprendre.

Synthèse !!!

Maintenant le matin … on jete un oeil à ses mails et ensuite aux flux.
on peut même suivre les flux sur les téléphones portables … Elle est pas belle la vie !

PS : Si vous avez des questions ou besoin d’aide n’hésitez pas.

Papier cadre simple 100%

papier cadre simple 100%

Faire un cadre et le diviser en 3 lignes et 3 colonnes

• 1,2,3.gif pour la premiere ligne
• 4,5,6.gif pour la deuxieme ligne
• 7,8,9.gif pour la troisièeme ligne

<TABLE id=INCREDIMAINTABLE cellSpacing=0 cellPadding=0 width="100%" border=0>
<TBODY>
<TR>
<TD align="center" valign="top">

<TABLE cellSpacing=0 cellPadding=0 width="100%" border=0"><!-- CHANGEMENT DE TAILLE ICI EN % OU PX -->
<TBODY>
<TR>
<td width="100%" height="36" id="INCREDIHEADER" colspan="3">
<p align="center">&nbsp;</p>
<p align="center"><img src="entete.gif" width="262" height="41" border="0"></p>
<p align="center">&nbsp;</p>
</td>
</TR>
<TR>
<TD id=INCREDIHEADER width="46" height="48"><IMG id=INCREDISETASATTACH alt="" hspace=0 src="1.gif" align=baseline border=0 width="46" height="138"></TD>
<td width="100%" id="INCREDIHEADER" background="2.gif" height="48"></td>
<td width="24" id="INCREDIHEADER" height="48"><IMG id=INCREDISETASATTACH alt="" hspace=0 src="3.gif" align=baseline border=0 width="24" height="138"></td>
</TR>
<TR>
<TD id=CENTERROW width="100%" colspan="3">
<TABLE cellSpacing=0 cellPadding="0" width="100%" border=0>
<TBODY>
<TR>
<TD id=INCREDITEXTLEFT width=0% height="100%" background="4.gif"></TD>
<TD id=INCREDITEXTREGION style="FONT-SIZE: 10pt" vAlign=top width="100%" height="100%" background="5.gif">
<DIV>
<p>&nbsp;</p>
</div>
</TD>
<TD id=INCREDITEXTRIGHT width=0% height="100%" background="6.gif"></TD>
</TR>
</TBODY>
<TR>
<td width="1%" id="INCREDITEXTLEFT"><img src="7.gif" width="46" height="21" border="0"></td>
<td width="100%" valign="top" background="8.gif" id="INCREDITEXTREGION" style="font-size:10pt;"></td>
<td id="INCREDITEXTRIGHT"><img src="9.gif" width="24" height="21" border="0"></td>
</TR>
</TABLE>
</TD>
</TR>
<TR>
<TD id=INCREDIFOOTER width="100%" colspan="3">
<TABLE cellSpacing=0 cellPadding=0 width="100%">
<TBODY>
<TR>
<TD vAlign=bottom>
<TABLE>
<TBODY>
<TR>
<TD width="100%"></TD>
<TD id=INCREDISOUND vAlign=bottom align=middle></TD>
<TD id=INCREDIANIM vAlign=bottom align=middle></TD>
</TR>
</TBODY>
</TABLE>
</TD>
</TR>
<TR>
<TD vAlign=bottom width="100%">
<TABLE contentEditable=true style="FONT-SIZE: 12pt; MARGIN: 3px; WIDTH: 100%; FONT-FAMILY: Times New Roman" width="100%">
<TBODY>
<TR>
<TD>
<DIV>
<p align="center"><FONT face=Verdana size=1>Crédits</FONT></p>
</DIV>
<DIV>
</DIV>
</TD>
</TR>
</TBODY>
</TABLE>
</TD>
</TR>
</TBODY>
</TABLE>
</TD>
</TR>
</TBODY>
</TABLE>

</TD>
</TR>
</TBODY>
</TABLE>

</BODY>
</html>

Papier cadre simple 400px de large

papier cadre simple 400px

Faire un cadre et le diviser en 3 lignes et 3 colonnes

• 1,2,3.gif pour la premiere ligne
• 4,5,6.gif pour la deuxieme ligne
• 7,8,9.gif pour la troisièeme ligne

<TABLE id=INCREDIMAINTABLE cellSpacing=0 cellPadding=0 width="100%" border=0>
<TBODY>
<TR>
<TD align="center" valign="top">

<TABLE cellSpacing=0 cellPadding=0 width="400" border=0"><!-- CHANGEMENT DE TAILLE ICI EN % OU PX -->
<TBODY>
<TR>
<td width="100%" height="36" id="INCREDIHEADER" colspan="3">
<p align="center">&nbsp;</p>
<p align="center"><img src="entete.gif" width="262" height="41" border="0"></p>
<p align="center">&nbsp;</p>
</td>
</TR>
<TR>
<TD id=INCREDIHEADER width="46" height="48"><IMG id=INCREDISETASATTACH alt="" hspace=0 src="1.gif" align=baseline border=0 width="46" height="138"></TD>
<td width="100%" id="INCREDIHEADER" background="2.gif" height="48"></td>
<td width="24" id="INCREDIHEADER" height="48"><IMG id=INCREDISETASATTACH alt="" hspace=0 src="3.gif" align=baseline border=0 width="24" height="138"></td>
</TR>
<TR>
<TD id=CENTERROW width="100%" colspan="3">
<TABLE cellSpacing=0 cellPadding="0" width="100%" border=0>
<TBODY>
<TR>
<TD id=INCREDITEXTLEFT width=0% height="100%" background="4.gif"></TD>
<TD id=INCREDITEXTREGION style="FONT-SIZE: 10pt" vAlign=top width="100%" height="100%" background="5.gif">
<DIV>
<p>&nbsp;</p>
</div>
</TD>
<TD id=INCREDITEXTRIGHT width=0% height="100%" background="6.gif"></TD>
</TR>
</TBODY>
<TR>
<td width="1%" id="INCREDITEXTLEFT"><img src="7.gif" width="46" height="21" border="0"></td>
<td width="100%" valign="top" background="8.gif" id="INCREDITEXTREGION" style="font-size:10pt;"></td>
<td id="INCREDITEXTRIGHT"><img src="9.gif" width="24" height="21" border="0"></td>
</TR>
</TABLE>
</TD>
</TR>
<TR>
<TD id=INCREDIFOOTER width="100%" colspan="3">
<TABLE cellSpacing=0 cellPadding=0 width="100%">
<TBODY>
<TR>
<TD vAlign=bottom>
<TABLE>
<TBODY>
<TR>
<TD width="100%"></TD>
<TD id=INCREDISOUND vAlign=bottom align=middle></TD>
<TD id=INCREDIANIM vAlign=bottom align=middle></TD>
</TR>
</TBODY>
</TABLE>
</TD>
</TR>
<TR>
<TD vAlign=bottom width="100%">
<TABLE contentEditable=true style="FONT-SIZE: 12pt; MARGIN: 3px; WIDTH: 100%; FONT-FAMILY: Times New Roman" width="100%">
<TBODY>
<TR>
<TD>
<DIV>
<p align="center"><FONT face=Verdana size=1>Crédits</FONT></p>
</DIV>
<DIV>
</DIV>
</TD>
</TR>
</TBODY>
</TABLE>
</TD>
</TR>
</TBODY>
</TABLE>
</TD>
</TR>
</TBODY>
</TABLE>

</TD>
</TR>
</TBODY>
</TABLE>

</BODY>
</html>

Papier cadre double colonne 70% de large

papier cadre double colonne

Vous devez faire un cadre et le diviser en 3 lignes et 5 colonnes.

j’ai nommé les images

• 1,2,3,4,5.gif pour la premiere ligne
• 21,22,23,24,25.gif pour la deuxieme ligne
• 31,32,33,34,35.gif pour la troisièeme ligne

<TABLE id=INCREDIMAINTABLE cellSpacing=0 cellPadding=0 width="100%" border=0>
<TBODY>
<TR>
<TD align="center" valign="top">

<TABLE cellSpacing=0 cellPadding=0 width="70%" border=0"><!-- CHANGEMENT DE TAILLE ICI EN % OU PX -->
<TBODY>
<TR>
<td width="100%" height="36" id="INCREDIHEADER" colspan="5">
<p align="center"><img src="entete.gif" width="151" height="51" border="0"></p>
</td>
</TR>

<TR>
<TD id=INCREDIHEADER width="9" height="48"><img src="1.gif" width="8" height="58" border="0"></TD>
<td height="48" id="INCREDIHEADER" background="2.gif" width="150">
<!-- regler la taille du tableau 150 -->
       <table width="150">
                    <tr>
                        <td>
                            <p>&nbsp;</p>
                        </td>
                    </tr>
                </table>
<!-- fin regler la taille du tableau 150 -->
</td>

<td width="56" height="48" id="INCREDIHEADER"><img src="3.gif" width="67" height="58" border="0"></td>
<td width="100%" id="INCREDIHEADER" background="4.gif" height="48"></td>
<td width="12" id="INCREDIHEADER" height="48"><IMG id=INCREDISETASATTACH alt="" hspace=0 src="5.gif" align=baseline border=0 width="11" height="58"></td>
</TR>

<TR>
<TD id=CENTERROW width="100%" colspan="5">
<TABLE cellSpacing=0 cellPadding="0" width="100%" border=0>
<TBODY>
<TR>
<td width="1%" height="100%" id="INCREDITEXTLEFT" background="21.gif"></td>
<td width="1%" height="100%" background="22.gif" id="INCREDITEXTLEFT" valign="top">
<!-- regler la taille du tableau 150 -->
    <table width="150">
                    <tr>
                                    <td  style="FONT-SIZE: 10pt" valign="top">
                                        <ul>
                                            <li><a href="http://">Lien</a></li>
                                            <li><a href="http://">Lien</a></li>
                                            <li><a href="http://">Lien</a></li>
                                        </ul>
                                        <p>ou autre...</p>
                                    </td>
                    </tr>
                </table>

 <!-- fin regler la taille du tableau 150 -->
</td>

<TD id=INCREDITEXTLEFT width=0% height="100%" background="23.gif"></TD>
<TD id=INCREDITEXTREGION style="FONT-SIZE: 10pt" vAlign=top width="100%" height="100%" background="24.gif">
<DIV>
<p>&nbsp;</p>
</div>
</TD>
<TD id=INCREDITEXTRIGHT width=0% height="100%" background="25.gif"></TD>
</TR>
</TBODY>

<TR>
<td width="1%" id="INCREDITEXTLEFT"><img src="31.gif" width="8" height="66" border="0"></td>
<td id="INCREDITEXTLEFT" background="32.gif">&nbsp;</td>
<td width="1%" id="INCREDITEXTLEFT"><img src="33.gif" width="67" height="66" border="0"></td>
<td width="100%" valign="top" background="34.gif" id="INCREDITEXTREGION" style="font-size:10pt;"></td>
<td id="INCREDITEXTRIGHT"><img src="35.gif" width="11" height="66" border="0"></td>
</TR>
</TABLE>
</TD>
</TR>
<TR>
<TD id=INCREDIFOOTER width="100%" colspan="5">
<TABLE cellSpacing=0 cellPadding=0 width="100%">
<TBODY>
<TR>
<TD vAlign=bottom>
<TABLE>
<TBODY>
<TR>
<TD width="100%"></TD>
<TD id=INCREDISOUND vAlign=bottom align=middle></TD>
<TD id=INCREDIANIM vAlign=bottom align=middle></TD>
</TR>
</TBODY>
</TABLE>
</TD>
</TR>
<TR>
<TD vAlign=bottom width="100%">
<TABLE contentEditable=true style="FONT-SIZE: 12pt; MARGIN: 3px; WIDTH: 100%; FONT-FAMILY: Times New Roman" width="100%">
<TBODY>
<TR>
<TD>
<DIV>
<DIV align=center><FONT face=Verdana size=1>.::Crédits::.</FONT></DIV>
</DIV>
<DIV>
</DIV>
</TD>
</TR>
</TBODY>
</TABLE>
</TD>
</TR>
</TBODY>
</TABLE>
</TD>
</TR>
</TBODY>
</TABLE>

</TD>
</TR>
</TBODY>
</TABLE>

</BODY>
</html>

Papier cadre simple + scroll

papier cadre simple scroll

Faire un cadre et le diviser en 3 lignes et 3 colonnes

• 1,2,3.gif pour la premiere ligne
• 4,5,6.gif pour la deuxieme ligne
• 7,8,9.gif pour la troisièeme ligne

<TABLE id=INCREDIMAINTABLE cellSpacing=0 cellPadding=0 width="100%" border=0</li><TBODY>
<TR>
<TD align="center" valign="top">

<TABLE  cellSpacing=0 cellPadding=0 width="400" border=0"><!-- CHANGEMENT DE TAILLE ICI EN % OU PX -->
<TBODY>
<TR>
<td width="100%" height="22" id="INCREDIHEADER" colspan="3">
<p align="center">&nbsp;</p>
</td>
</TR>
<TR>
<TD id=INCREDIHEADER width="6" height="11"><IMG id=INCREDISETASATTACH alt="" hspace=0 src="1.gif" align=baseline border=0 width="13" height="16"></TD>
<td width="93%" id="INCREDIHEADER" background="2.gif" height="11"></td>
<td width="63" id="INCREDIHEADER" height="11"><IMG id=INCREDISETASATTACH alt="" hspace=0 src="3.gif" align=baseline border=0 width="63" height="16"></td>
</TR>

<TR>
<TD id=CENTERROW width="100%" colspan="3">
<TABLE cellSpacing=0 cellPadding="0" width="100%" border=0>
<TBODY>
<TR>
<TD id=INCREDITEXTLEFT width=0% height="100%" background="4.gif"></TD>
<TD  style="FONT-SIZE: 10pt" vAlign=top width="100%" height="400" background="5.gif">
<DIV>
<p align="center"><img src="justsev.gif" width="324" height="134" border="0"></p>
</DIV>
<DIV id=INCREDITEXTREGION style="
  OVERFLOW: auto;
  scrollbar-3dlight-color: #FFFFFF;
  scrollbar-arrow-color: #FFFFFF;
  scrollbar-base-color: #AAD5FE;
  scrollbar-darkshadow-color: #FFFFFF;
  scrollbar-shadow-color: #FFFFFF;
  scrollbar-face-color: #AAD5FE;
  scrollbar-highlight-color: #FFFFFF;
  scrollbar-track-color: #AAD5FE;
  HEIGHT: 300px;
  width:100%">
<p>&nbsp;</p>

</div>
</TD>
<TD id=INCREDITEXTRIGHT width=0% height="100%" background="6.gif"></TD>
</TR>
</TBODY>
<TR>
<td width="1%" id="INCREDITEXTLEFT"><img src="7.gif" width="13" height="20" border="0"></td>
<td width="100%" valign="top" background="8.gif" id="INCREDITEXTREGION" style="font-size:10pt;">

</td>
<td id="INCREDITEXTRIGHT"><img src="9.gif" width="63" height="20" border="0"></td>
</TR>
</TABLE>
</TD>
</TR>

<TR>
<TD id=INCREDIFOOTER width="100%" colspan="3">
<TABLE cellSpacing=0 cellPadding=0 width="100%">
<TBODY>
<TR>
<TD vAlign=bottom>
<TABLE>
<TBODY>
<TR>
<TD width="100%"></TD>
<TD id=INCREDISOUND vAlign=bottom align=middle></TD>
<TD id=INCREDIANIM vAlign=bottom align=middle></TD>
</TR>
</TBODY>
</TABLE>
</TD>
</TR>

<TR>
<TD vAlign=bottom width="100%">
<TABLE contentEditable=true style="FONT-SIZE: 12pt; MARGIN: 3px; WIDTH: 100%; FONT-FAMILY: Times New Roman" width="100%">
<TBODY>
<TR>
<TD>
<DIV>
<DIV align=center><FONT face=Verdana size=1>.::Crédits::.</FONT></DIV>
</DIV>
<DIV>
</DIV>
</TD>
</TR>
</TBODY>
</TABLE>
</TD>
</TR>

</TBODY>
</TABLE>
</TD>
</TR>
</TBODY>
</TABLE>

</TD>
</TR>
</TBODY>
</TABLE>

</BODY>
</html>

Si vous avez besoin d’ajouter un scroll à un autre modèle de lettre…

c’est ceci qu’il faut ajouté dans la cellule ou se trouve normalement le texte de votre lettre.

Il faut que vous enleviez le « id=INCREDITEXTREGION » qui se trouve à l’origine dans le tag <td id=INCREDITEXTREGION>

Puis ajoutez ceci dans la cellule on l’on écrit normalement le texte

<DIV id=INCREDITEXTREGION style="
OVERFLOW: auto;
scrollbar-3dlight-color: #FFFFFF;
scrollbar-arrow-color: #FFFFFF;
scrollbar-base-color: #AAD5FE;
scrollbar-darkshadow-color: #FFFFFF;
scrollbar-shadow-color: #FFFFFF;
scrollbar-face-color: #AAD5FE;
scrollbar-highlight-color: #FFFFFF;
scrollbar-track-color: #AAD5FE;
HEIGHT: 300px;
width:100%">
TEXTE
</div>

Papier cadre avec curseur

papier cadre avec curseur gif

A mettre entre les 2 balises <head></head> de votre flavor.htm

code si votre curseur est hébergé en ligne

<STYLE>
BODY
{
CURSOR:url('http://votresite.com/dossier/oiseau.ani')
}
A:link
{
CURSOR: url('http://votresite.com/dossier/oiseauclic.ani')
}
A:visited
{
CURSOR: url('http://votresite.com/dossier/oiseauclic.ani')
}
A:active
{
CURSOR: url('http://votresite.com/dossier/oiseauclic.ani')
}
A:hover
{
CURSOR: url('http://votresite.com/dossier/oiseauclic.ani')
}
</STYLE>

Papier cadre div image

papier cadre avec div image

Vous devez faire un papier normal, simple avec une image, ou un tag, vous le placez n’importe ou dans lettor creator (en-tete, droite, gauche) enregistrez votre projet et ouvrez votre enveloppe comme pour les papiers cadre.

Vous copiez et collez le code ci dessous a la place de l’orginal et remplacer l’image de la div par la votre

le code :

<TABLE id=INCREDIMAINTABLE cellSpacing=0 cellPadding=0 width="100%" border=0>
<TBODY>
<TR>
<TD align="center" valign="top">

<TABLE cellSpacing=0 cellPadding=0 width="100%" border=0><!-- CHANGEMENT DE TAILLE ICI EN % OU PX -->
<TBODY>
<TR>
<TD id=INCREDIHEADER width="100%">

<TABLE contentEditable=true style="FONT-SIZE: 12pt; MARGIN: 3px; WIDTH: 100%; FONT-FAMILY: Times New Roman" width="100%">
<TBODY>
<TR>
<TD>
<DIV>
<p align="center"><img src="jemeposaisunepetitequestion.gif" width="312" height="36" border="0"></p>
<p align="center">&nbsp;</p>
</DIV>
</TD>
</TR>
</TBODY>
</TABLE>
</TD>
</TR>

<TR>

<TD id=CENTERROW width="100%">
<TABLE cellSpacing=0 cellPadding=2 width="100%" border=0>
<TBODY>
<TR>
<TD id=INCREDITEXTLEFT width=0%>
<TABLE contentEditable=true style="FONT-SIZE: 12pt; MARGIN: 3px -1px 3px -5px; WIDTH: 100%; FONT-FAMILY: Times New Roman" width="100%">
<TBODY>
<TR>
<TD>
<DIV>&nbsp;</DIV>
</TD>
</TR>
</TBODY>
</TABLE>
</TD>

<TD style="FONT-SIZE: 10pt" vAlign=top width="100%">
<!-- VOTRE DIV IMAGE -->
<div style="margin-right:10px; width:auto; height:auto; float:left;">
<img src="joshquestion.gif" width="338" height="418" border="0">
</DIV>
<!-- FIN VOTRE DIV IMAGE -->

<!-- LA DIV DU TEXTE -->
<DIV id=INCREDITEXTREGION>
<p>&nbsp;</p>
</div>
<!-- FIN LA DIV DU TEXTE -->

</TD>

</TR>

</TBODY>
</TABLE>
</TD>
</TR>

<TR>
<TD id=INCREDIFOOTER width="100%">

<TABLE cellSpacing=0 cellPadding=0 width="100%">
<TBODY>
<TR>
<TD vAlign=bottom>

<TABLE>
<TBODY>
<TR>
<TD width="100%"></TD>
<TD id=INCREDISOUND vAlign=bottom align=middle></TD>
<TD id=INCREDIANIM vAlign=bottom align=middle></TD>
</TR>
</TBODY>
</TABLE>

</TD>
</TR>

<TR>
<TD vAlign=bottom width="100%">

<TABLE contentEditable=true style="FONT-SIZE: 12pt; MARGIN: 3px; WIDTH: 100%; FONT-FAMILY: Times New Roman" width="100%">
<TBODY>
<TR>
<TD>
<DIV align=center><FONT face=Verdana size=1>Crédit : </FONT></DIV>
<DIV align=center><FONT face=Verdana size=1>images </FONT><A href="http://www/"><FONT face=Verdana size=1>www</FONT></A>&nbsp;</DIV>
</TD>
</TR>
</TBODY>
</TABLE>
</TD>
</TR>
</TBODY>
</TABLE>

</TD>
</TR>
</TBODY>
</TABLE>

</TD>
</TR>
</TBODY>
</TABLE>

</BODY>
</html>

C’est un peu comme le papier scroll, c’est au niveau de la cellule on l’on met normalement le texte qu’il y a des changements à la ligne ou se trouve <td id=INCREDITEXTREGION>

si vous voulez le faire vous-meme

<TD style="FONT-SIZE: 10pt" vAlign=top width="100%">

<!-- VOTRE DIV IMAGE -->
<div style="margin-right:10px; width:auto; height:auto; float:left;">
<img src="VOTREIMAGE.gif" width="338" height="418" border="0">
</DIV>
<!-- FIN VOTRE DIV IMAGE -->

<!-- LA DIV DU TEXTE -->
<DIV id=INCREDITEXTREGION>  <p>&nbsp;</p>
</div>
<!-- FIN LA DIV DU TEXTE -->
</TD>

1 – Télécharger le logiciel gratuit ici

2 – Une fois installé … ouvrir skin créator

3 – cliquez sur « Tools » – « select external Editors »

Ceci vous sert à ouvrir les logiciels avec lesquels vous travaillez pour éditer les images du skin afin de les modifier

moi je travaille sous psp10… donc j’ai été rechercher l’executable de mon logiciel

dans C:Program FilesCorelCorel Paint Shop Pro XPaint Shop Pro X.exe

4 – cliquez sur  » Properties »

donner un nom a votre skin et a votre collection de skin

5 – Traduction

Copy from défaut = copier l’image par défaut

Get image = ajouter une image a partir de vos dossiers

Edit image = Editer l’image dans votre logiciel (psp ou photoshop)

Delete = Effacer l’image

6 – exemple pour l’image « newmail.bmp »

j’ai copier l’image par défaut

ensuite on trouve en bas a gauche les infos suivantes :

4 images – 21×21 each

il y a 4 images chacune de 21 par 21 pixel

Idle = defaut
Roll over = passage de la souris
Pressed = quand on presse l’image
Inactive = quand c’est inactif

En bas à droite on nous montre ou se situe l’image.

7 – Autre cas de figure pour l’image « Menubar.bmp »

ici on voit

3 images
Left – 96×24
Tiled – 48×24
Right – 96×24

ce qui signifie que le milieu de l’image sera répeter comme une tuile

c’est aussi la même chose pour les boutons du skins.

8 - Vous pouvez cliquez sur Preview pour voir ou vous en êtes dans votre skin

Voilà vous n’avez plus qu’a modifier vos images comme bon vous semble !!!!

Si vous avez besoin de voir un modèle vous pouvez toujours ouvrir un de mes skins dans skin creator.

Active News (histoire courte)

{title} – Titre de l article
{avatar} – Montrer l avatar (si il y en a un)
{short-story} – Histoire courte
{full-story} – Histoire longue (la deuxieme partie)
{author} – Auteur de l article avec le lien de son email(si il existe)
{author-name} – Le nom de l auteur sans l email
[mail] and [/mail] – Genere un lien avec l email de l auteur (si il existe)[mail]Email[/mail]
{date} – Date de l histoire
[link] and [/link] – Genere un lien vers la deuxieme partie de l histoire
[full-link] and [/full-link] – un lien vers la 2eme partie seulement si il existe une 2eme partie
[com-link] and [/com-link] – Genere un lien vers les commentaires
{comments-num} – Montre le nombre de commentaire
{category} – Montre le nom de la categorie ou est posté la news
{category-icon} – Montre l icone de la categorie (si l icone existe)

Exemple de template a personnaliser

<table class="post" border="0" width="100%">
<tbody>
<tr>
<td width="100%">
<table border="0" cellspacing="0" cellpadding="0" width="100%">
<tbody>
<tr>
<td>
<p class="titlepost" style="text-align: center"><a href="{title} {date}">{title} {date}</a></p>
</td>
</tr>
</tbody></table>
<table border="0" cellspacing="0" cellpadding="0" width="100%">
<tbody>
<tr>
<td width="100%" height="10">
<div style="margin-right: 15px; margin-bottom: 10px; width: auto; height: auto; float: left;"></div>
{short-story}
<p style="text-align: right">[full-link]suite [/full-link]</p>
<a href="/tutocsshtm.php?subaction=showcomments&amp;id=1175355607&amp;archive=&amp;start_from=&amp;ucat=7&amp;"><span class="title5">Commentaires</span> : 1 </a>

<span class="title5">Under</span> : css,html,script</td>
</tr>
</tbody></table>
</td>
</tr>
</tbody></table>

Full Story (histoire 2eme partie)

{title} – Titre de l article
{avatar} – Montrer l avatar (si il y en a un)
{full-story} – Histoire longue (la deuxieme partie)
{short-story} – Histoire courte
{author} – Auteur de l article avec le lien de son email(si il existe)
{author-name} – Le nom de l auteur sans l email
[mail] and [/mail] – Genere un lien avec l email de l auteur (si existe)[mail]Email[/mail]
{date} – Date de l histoire
{comments-num} – Montre le nombre de commentaire
{category} – Montre le nom de la categorie ou est posté la news (si la categorie existe)
{category-icon} – Montre l icone de la categorie (si l icone existe)

Exemple de template a personnaliser

<table width="100%" class="post">
<tr>
<td width="100%">

<table width="100%" class="headerpost" cellpadding="0" cellspacing="0">
<tr>
<td>
<p class="titlepost">.:: {title} ::. {date}</p>
</td>
<td align="right">
<p>[com-link] {comments-num} [/com-link]</p>
</td>
</tr>
</table>

<table class="contentpost" width="100%" cellpadding="0" cellspacing="0">
<tr>
<td width="100%" height="10">
<div style="margin-right:15px; margin-bottom:10px; width:auto; height:auto; float:left;">
{avatar}<br />
</div>
{short-story}
<br />
{full-story}
<br />
<p>Catégorie : {category}</p>
</td>
</tr>
</table>

</td>
</tr>
</table>

{author} Nom de celui qui a posté le commentaire
{mail} Email du commentateur
{date} Date de quand a ete poste le commentaire
{comment} le commentaire
{comment-iteration} Montrer le numero ID du commentaire

Exemple de template a personnaliser

<table class="contentpost" width="100%" cellpadding="0" cellspacing="0">
<tr>
<td width="100%" height="10">
<p class="title3">{author} le {date}</p>
<p>{comment}</p>
</td>
</tr>
</table>

Autre exemple de template très simple

<p>{author} le {date}</p>
<p>{comment}</p>

Le formulaire de commentaire

Attention fragile !!!
il peut être personnalisé mais si jamais ça bug reprendre le formulaire de la template par défaut et recommencer !!!

<table border="0" width="268" cellspacing="0" cellpadding="0" style="background-color:white; border-width:1; border-color:rgb(51,51,51); border-style:solid;" align="center">
<tr>
<td width="83" height="22"><p align="center">nom: </p></td>
<td width="183" height="22"><p align="left"><input type="text" name="name" tabindex="1"></p>
</td>
</tr>

<tr>
<td width="83" height="23"><p align="center">mail ou site: </p></td>
<td width="183" height="23"><p align="left"><input type="text" name="mail" tabindex="2"> (optionel)</p>
</td>
</tr>

</center>
<tr>
<td width="83" height="15"><p align="center">smile:</p></td>
<center>
<td width="183" height="15"><p align="left"> smilies </p></td>
</tr>

<tr>
<td width="266" height="154" colspan="2">
<p align="center"><textarea cols="55" rows="7" name="comments" tabindex="3" style="font-family:’Century Gothic’; font-size:10px; color:rgb(78,180,217); scrollbar-face-color:white; scrollbar-shadow-color:rgb(255,153,204); scrollbar-highlight-color:white; scrollbar-3dlight-color:rgb(255,153,204); scrollbar-darkshadow-color:white; scrollbar-base-color:white; scrollbar-arrow-color:rgb(255,153,204); scrollbar-track-color:white;"></textarea></p>

<p align="center">
<input type="submit" name="submit" value="Ajouter le commentaire" accesskey="s" style="background-color:white; border-width:1; border-color:rgb(51,51,51); border-style:solid;">
</p>

<p align="center">
<input type=checkbox name=CNremember id=CNremember value=1 style="border-width:1px; border-color:rgb(51,51,51); border-style:dashed;"> <label for=CNremember>Se souvenir de Moi</label> | <a href="javascript:CNforget();">M’oublier</a><font size="1" face="Century Gothic" color="#62C3E7"> </font><font color="#62C3E7"></font>
</p>
</td>
</tr>
</table>

la Pagination

[prev-link] and [/prev-link] – Genere un lien vers les pages precedentes (si il y a)
[next-link] and [/next-link] – Genere un lien vers les pages suivantes (si il y a)
{pages} – montre le lien et le nombre de page; example: 1 2 3 4

Exemple avec des fleches en image (< – 1 2 3 – >)

<p align="center">
[prev-link]<img src="images/flecheg.gif" alt="gauche" width="11" height="9" border="0">[/prev-link]
{pages}
[next-link]<img src="images/fleched.gif" alt="droite" width="11" height="9" border="0">[/next-link]
</p>

la Pagination des commentaires

[prev-link] and [/prev-link] – Genere un lien vers les pages precedentes (si il y a)
[next-link] and [/next-link] – Genere un lien vers les pages suivantes (si il y a)
{pages} – montre le lien et le nombre de page; example: 1 2 3 4

Exemple avec du texte

<p align="center">
[prev-link]précédant[/prev-link]
{pages}
[next-link]suivant[/next-link]
</p>