[phpBB 3.0.x] Personnaliser l'éditeur de rédaction

Toutes les documentations phpBB seront ici.
Verrouillé
Avatar du membre
Dakin Quelia
Webmaster
Webmaster
Messages : 563
Enregistré le : ven. 27 nov. 2009 05:47
Localisation : Belgique
Contact :

[phpBB 3.0.x] Personnaliser l'éditeur de rédaction

Message par Dakin Quelia »

» Personnaliser l'éditeur de rédaction

A l'aide de cette documentation, vous pourrez personnaliser l'éditeur de phpBB qui est des plus basiques. Cela le rendra plus vivant.

Avant d'entamer les modifications, il est bon de faire une sauvegarde de vos fichiers.

Tout d'abord, télécharger le pack ci-dessous et mettez-le dans le dossier de votre forum.
special_editor.zip
(16.59 Kio) Téléchargé 254 fois
» Ajout d'une feuille de style

J'ai prévu une feuille de style pour l'éditeur personnalisé afin d'éviter à devoir éditer trop de fichiers. Tout ce qui doit être ajouté/modifié concernant l'éditeur passera par cette feuille.

Ouvrez le fichier « styles/{VOTRE_THEME}/theme/stylesheet.css ».

A la fin du fichier, ajoutez:

Code : Tout sélectionner

@import url("editor.css");
» Modifications template

Afin de rendre l'éditeur plus agréable et éviter certains petits soucis (comme la palette), il faut suivre ce qui suit.

Ouvrez le fichier « styles/{VOTRE_THEME}/template/posting_editor.html ».

Cherchez:

Code : Tout sélectionner

	<!-- INCLUDE posting_buttons.html -->
Remplacez par:

Code : Tout sélectionner

<script type="text/javascript" src="{T_SUPER_TEMPLATE_PATH}/editor.js"></script>
	<!-- IF S_BBCODE_ALLOWED -->
	<div id="colour_palette" style="display: none;">
		<dl style="clear: left;">
			<dt><label>{L_FONT_COLOR}:</label></dt>
			<dd>
			<script type="text/javascript">
			// <![CDATA[
				function change_palette()
				{
					dE('colour_palette');
					e = document.getElementById('colour_palette');
					
					if (e.style.display == 'block')
					{
						document.getElementById('bbpalette').value = '';
					}
					else
					{
						document.getElementById('bbpalette').value = '';
					}
				}

				colorPalette('h', 15, 10);
			// ]]>
			</script>
			</dd>
		</dl>
	</div>
	<!-- ENDIF -->
	<div class="editorMain">
		<!-- INCLUDE posting_buttons.html -->
		<textarea <!-- IF S_UCP_ACTION and not S_PRIVMSGS and not S_EDIT_DRAFT -->name="signature" id="signature"<!-- ELSE -->name="message" id="message"<!-- ENDIF --> tabindex="4">{MESSAGE}{DRAFT_MESSAGE}{SIGNATURE}</textarea>
	</div>
Cherchez:

Code : Tout sélectionner

	<div id="smiley-box">
Remplacez par:

Code : Tout sélectionner

	<div id="smiley-box" style="float: right;">
Cherchez et supprimez:

Code : Tout sélectionner

	<div id="message-box">
		<textarea <!-- IF S_UCP_ACTION and not S_PRIVMSGS and not S_EDIT_DRAFT -->name="signature" id="signature" style="height: 9em;"<!-- ELSE -->name="message" id="message"<!-- ENDIF --> rows="15" cols="76" tabindex="4" onselect="storeCaret(this);" onclick="storeCaret(this);" onkeyup="storeCaret(this);" onfocus="initInsertions();" class="inputbox">{MESSAGE}{DRAFT_MESSAGE}{SIGNATURE}</textarea>
	</div>
» Rafraîchissement et résultat

N'oubliez pas de rafraîchir le template et le thème (onglet Styles) et de vider le cache (onglet Général).

Cela donnera:
02.png

Verrouillé

Qui est en ligne

Utilisateurs parcourant ce forum : Aucun utilisateur enregistré et 3 invités