Page 1 sur 2
[phpBB 3.0.x] BBCodes de mise en forme
Posté : jeu. 14 janv. 2010 04:03
par Dakin Quelia
» BBCodes de mise en forme
Dans cette documentation, nous allons lister tous les BBCodes qui sont liés à la mise en forme de votre message.
Dernière mise à jour le 22/05/2012
BBCode Tableau
Posté : jeu. 14 janv. 2010 04:03
par Dakin Quelia
» BBCode Tableau
Dans cette documentation, nous allons vous expliquer comment faire un BBCode tableau. Ce BBCode peut sembler complexe mais une fois que vous aurez lu cette documentation, vous comprendrez vite le fonctionnement. Il est, toutefois, recommandé d'avoir quelques connaissances en CSS.
» Balise Table
Nous commençons par créer une balise table pour former le tableau.
Utilisation du BBCode
Code HTML de remplacement
Code : Tout sélectionner
<table cellspacing="0" width="100%" style="{TEXT}">{TEXT2}</table>
Ligne d'aide
» Balise TR
Dans cette étape, nous allons vous expliquer comment créer la balise qui vous permettra d'ajouter une ligne dans un tableau.
Utilisation du BBCode
Code HTML de remplacement
Ligne d'aide
» Balise TD
Dans cette partie, nous allons créer une balise TD qui vous permettra d'ajouter une colonne à un tableau.
Utilisation du BBCode
Code HTML de remplacement
Ligne d'aide
Code : Tout sélectionner
Ajouter une colonne: [td=options css]Autre balise ou Texte[/td]
» Exemple
Voici un exemple.
Code : Tout sélectionner
[table=border: 1px solid #007295; width: 400px;][tr][td=width: 400px; background-color: #F7F7F7; text-align: center;][size=85][color=#1675BC][b]Forumactif vous offre un nom de domaine gratuit[/b][/color][/size][/td][/tr][/table][table=border-left: 1px solid #007295; border-right: 1px solid #007295; border-bottom: 1px solid #007295; width: 400px;][tr][td=width: 400px; padding-left: 5px; background-color: #F7F7F7; font-size: 0.9em; text-align: justify; padding: 5px;]Lorsque vous voulez indiquer (sur un site Internet, sur un forum, dans un email, via msn, icq... bref partout) l'adresse de votre forum, d'un sujet, d'un message, vérifiez bien que la partie de l'adresse contenant 'sid=582c4678011cbd97139689c8' n'est jamais indiqué.[/td][/tr][/table]
Ce qui donne:
BBCode Image Position
Posté : jeu. 14 janv. 2010 04:05
par Dakin Quelia
» BBCode Image Position
Dans cette documentation, nous allons vous expliquer comment créer un BBCode pour aligner des images dans un texte.
Utilisation du BBCode
Code HTML de remplacement
Code : Tout sélectionner
<img src="{URL}" alt="{URL}" style="float:{TEXT}; padding-left: {NUMBER}px; padding-right: {NUMBER2}px;" />
Ligne d'aide
Code : Tout sélectionner
Aligner image: [imagepos={TEXT},{NUMBER},{NUMBER2}]{URL}[/imagepos]
BBCode Miniature
Posté : jeu. 14 janv. 2010 04:05
par Dakin Quelia
» BBCode Miniature
Ce BBCode peut être très pratique lorsque vous avez des images de grandes tailles à introduire dans votre message.
» Version 1
Cette version comporte une information vous indiquant de cliquer dessus. Toutefois, vous ne pouvez pas aligner une miniature l'une à côté de l'autre.
Utilisation du BBCode
Code HTML de remplacement
Code : Tout sélectionner
<div style="text-align:center;"><a href="{TEXT}" onclick="window.open(this.href);return false;"><img src="{TEXT}" style="border: solid 1px #000000; width: 200px; heigh: 120px;" alt="Image" /></a>
<br /><span style="color: #000000; font-size: 10px;">Cliquez sur la miniature</span></div>
Ligne d'aide
» Version 2
Cette version vous permet d'aligner les captures l'une à côté de l'autre.
Utilisation du BBCode
Code HTML de remplacement
Code : Tout sélectionner
<a href="{TEXT}" onclick="window.open(this.href);return false;"><img src="{TEXT}" style="border: solid 1px #000000; width: 200px; heigh: 120px;" alt="Image" /></a>
Ligne d'aide
BBCode Max URL
Posté : jeu. 14 janv. 2010 04:06
par Dakin Quelia
» BBCode Max URL
Ce BBCode vous permet d'ouvrir plusieurs liens en un seul clic.
Utilisation BBCode:
Code HTML de remplacement:
Ligne d'aide:
BBCode Flottaison
Posté : jeu. 14 janv. 2010 04:07
par Dakin Quelia
» BBCode Flottaison
Ce BBCode vous permet de faire flotter votre texte à droite ou à gauche.
Utilisation BBCode:
Code HTML de remplacement:
Ligne d'aide:
Code : Tout sélectionner
Flottement: [float=left ou right]Votre texte ou contenu[/float]
BBCode Redimensionnement de l'image
Posté : dim. 14 mars 2010 18:10
par Dakin Quelia
» BBCode Redimensionnement de l'image
Ce BBCode vous permet d'avoir des miniatures automatiques des images.
Utilisation du BBCode:
Code HTML de remplacement:
Code : Tout sélectionner
<a href="{URL}" class="livethumbnail"><img src="{URL}" width="240" height="159" largewidth="{TEXT}" largeheight="{TEXT2}" alt=""></a>
<script type="text/javascript">
var links = document.getElementsByTagName('a');
for (var i = 0; i < links.length; i++)
if (links[i].className == 'livethumbnail')
{
var img = links[i].getElementsByTagName('img')[0];
img.state = 'small';
img.smallSrc = img.getAttribute('src');
img.smallWidth = parseInt(img.getAttribute('width'));
img.smallHeight = parseInt(img.getAttribute('height'));
img.largeSrc = links[i].getAttribute('href');
img.largeWidth = parseInt(img.getAttribute('largewidth'));
img.largeHeight = parseInt(img.getAttribute('largeheight'));
img.ratio = img.smallHeight / img.smallWidth;
links[i].onclick = scale;
}
function scale()
{
var img = this.getElementsByTagName('img')[0];
img.src = img.smallSrc;
// if we are scaling up, scale down everything else
if (img.state == 'small')
{
var links = document.getElementsByTagName('a');
for (var i = 0; i < links.length; i++)
if ((links[i].className == 'livethumbnail') &&
(links[i].getElementsByTagName('img')[0].state == 'large') &&
(links[i] != this))
links[i].onclick();
}
if (! img.preloaded)
{
img.preloaded = new Image();
img.preloaded.src = img.largeSrc;
}
var interval = window.setInterval(scaleStep, 10);
return false;
function scaleStep()
{
var step = 10;
var width = parseInt(img.getAttribute('width'));
var height = parseInt(img.getAttribute('height'));
if (img.state == 'small')
{
width += step;
height += Math.floor(step * img.ratio);
img.setAttribute('width', width);
img.setAttribute('height', height);
if (width > img.largeWidth - step)
{
img.setAttribute('width', img.largeWidth);
img.setAttribute('height', img.largeHeight);
img.setAttribute('src', img.largeSrc);
window.clearInterval(interval);
img.state = 'large';
}
}
else
{
width -= step;
height -= Math.floor(step * img.ratio);
img.setAttribute('width', width);
img.setAttribute('height', height);
if (width < img.smallWidth + step)
{
img.setAttribute('width', img.smallWidth);
img.setAttribute('height', img.smallHeight);
img.src = img.smallSrc;
window.clearInterval(interval);
img.state = 'small';
}
}
}
}
</script>
Ligne d'aide:
Code : Tout sélectionner
Redimensionnement: [ResizePic=Largeur,Hauteur]{URL}[/ResizePic]
BBCode Alinéa
Posté : ven. 21 oct. 2011 16:35
par Dakin Quelia
» BBCode Alinéa
Ce BBCode vous permet de faire des alinéas dans votre texte.
Utilisation du BBCode:
Code HTML de remplacement:
Ligne d'aide:
BBCode Barré
Posté : jeu. 17 mai 2012 23:31
par Dakin Quelia
» BBCode Barré
Dans cette documentation, nous allons vous expliquer comment créer un BBCode pour barrer du texte.
Utilisation du BBCode
Code HTML de remplacement
Ligne d'aide
BBCode Miniature 2
Posté : sam. 19 mai 2012 00:36
par Dakin Quelia
» BBCode Miniature 2
Ce BBCode vous permet d'intégrer une miniature dans votre message avec un effet scale.
Tout d'abord, téléchargez les fichiers. Il suffit de les placer dans le dossier de votre forum.
» 1. Modification template
Ouvrez le fichier «
styles/{VOTRE_THEME}/template/overall_footer.html ».
Cherchez:
Avant, ajoutez:
Code : Tout sélectionner
<script type="text/javascript" src="{T_SUPER_TEMPLATE_PATH}/scale.js"></script>
» 2. Création du BBCode
Utilisation du BBCode:
Code HTML de remplacement:
Code : Tout sélectionner
<a href="{TEXT}" class="livethumbnail"><img src="{TEXT}" width="170" title="{SIMPLETEXT}" alt="{SIMPLETEXT}"></a>
Ligne d'aide:
Code : Tout sélectionner
Miniature avec scale: [Miniature2=Id de balise]Adresse de l'image[/Miniature2]
» 3. Rafraîchissement
N'oubliez pas de rafraîchir le template (onglet Styles) et de vider le cache (onglet Général).