Couleurs de l'éditeur en mode Wysiwyg

Voir le sujet précédent Voir le sujet suivant Aller en bas

Résolu Couleurs de l'éditeur en mode Wysiwyg

Message par roussinix le Mar 8 Déc 2015 - 8:58

Détails techniques


Version du forum : phpBB3
Poste occupé : Fondateur
Navigateur(s) concerné(s) : Opera
Capture d'écran du problème :
Voir l'image:

Personnes concernées par le problème : Tous les utilisateurs
Problème apparu depuis : Depuis la création
Lien du forum : http://testkpark.forumactif.org/

Description du problème

Bonjour,

Je commence à en voir le bout, mais il reste encore quelques petits problèmes. Comme le montre la copie d'écran, c'est pas vraiment Wysiwyg => Résultat :


On constate immédiatement la différence. Je n'arrive pas à trouver d'où vient le fond jaune clair du "Quote" ni le fond blanc (ou presque) de "Code" (sans compter le mot "Code" en noir sur fond gris foncé).

Si quelqu'un a une idée, merci d'avance Wink


Dernière édition par roussinix le Lun 14 Déc 2015 - 18:21, édité 1 fois

roussinix
**

Masculin
Messages : 64
Inscrit(e) le : 21/08/2015

http://testkpark.forumactif.org/
roussinix a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Couleurs de l'éditeur en mode Wysiwyg

Message par Invité le Jeu 10 Déc 2015 - 17:11

Bonjour,

Pouvez-vous essayé pour le fond jaune ceci (à mettre dans la feuille de style css du forum) :

Code:
blockquote {
background: red !important;
}

J'ai mis le fond en rouge=red à vous de choisir par la suite.
Pour ce qui est de la partie en noire "Code:" à mettre ceci:

Code:
code:before {
color: red !important;
}

Idem que plus haut,à vous de choisir la couleur Wink

Cordialement.

Invité
Invité


Invité a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Couleurs de l'éditeur en mode Wysiwyg

Message par roussinix le Jeu 10 Déc 2015 - 17:33

Le code de blockquote est déjà modifié dans le CSS, ça agit dans le résultat final, mais pas dans l'éditeur lui-même en mode wysiwyg. Voici le code en place :
Code:
blockquote { background-color: #595959 !important; background-image: url('http://www.roussiniere.net/SauvegardeForums/TestKparK/Quote.png'); background-position: 6px 8px;
  background-repeat: no-repeat; font-size: 1em; margin: 5px 5px 0 5px; }
blockquote blockquote { background-color: #3d3d3d !important; font-size: 1em; margin: 5px 5px 0 5px; }
blockquote blockquote blockquote { background-color: #595959 !important; font-size: 1em; margin: 5px 5px 0 5px; }
Ce qui donne bien le résultat montré plus haut :


Hors, dans l'éditeur, j'ai toujours :

roussinix
**

Masculin
Messages : 64
Inscrit(e) le : 21/08/2015

http://testkpark.forumactif.org/
roussinix a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Couleurs de l'éditeur en mode Wysiwyg

Message par roussinix le Sam 12 Déc 2015 - 10:58

Up ... Pas d'idées ?

roussinix
**

Masculin
Messages : 64
Inscrit(e) le : 21/08/2015

http://testkpark.forumactif.org/
roussinix a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Couleurs de l'éditeur en mode Wysiwyg

Message par Invité le Dim 13 Déc 2015 - 7:37

Bonjour,

Je fait au maximum pour trouver rapidement et surtout lorsque j'ai le temps comme cette nuit Surprised Rolling Eyes

J'ai été voir le site officiel SCEditor ( http://www.sceditor.com/ ) et en particulier la partie pour les css ( http://www.sceditor.com/api/sceditor/css/ )
Malheureusement,les commandes données dessus donc celles-ci:
Code:
$('textarea').sceditor('instance').css('blockquote { background-color: red; }');
$('textarea').sceditor('instance').css('code:before { color: red; }');

Ne fonctionnent pas,elles "imitent" la fonction " destroy() " ( http://www.sceditor.com/api/sceditor/destroy/ )
Pourquoi je n'en sais rien.
Par conséquent la seule solution est de mettre dans la gestion des codes javascript ce code ci-dessous:
Code:
$(function() {
   $("textarea").sceditor({
   plugins: "bbcode",
        plugins: "xhtml",
   });
});

Et soit:

- Recommencer toute la structure blockquote,code etc via la feuille css personnelle de notre forum comme sur ce lien ( http://illiweb.com/rs3/18/frm/SCEditor/minified/jquery.sceditor.default.min.css )

Soit:

- Modifier le fichier css ici ( http://illiweb.com/rs3/18/frm/SCEditor/minified/jquery.sceditor.default.min.css ) en modifiant ce qu'il faut blockquote & code et le ré-héberger en ajoutant bien la nouvelle URL via le code ci-dessous:

Code:
$(function() {
   $("textarea").sceditor({
   plugins: "bbcode",
        plugins: "xhtml",
        style: "FICHIER.css"
   });
});

FICHIER.css : Mettre à la place le lien du fichier css hébergé se terminant donc par .css exemple :
- http://illiweb.com/rs3/18/frm/SCEditor/minified/jquery.sceditor.default.min.css

Pas mieux.

Warning Le code ajoute la panoplie complète des boutons :


Cordialement.

Invité
Invité


Invité a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Couleurs de l'éditeur en mode Wysiwyg

Message par Milouze14 le Dim 13 Déc 2015 - 8:17

Salut roussinix et Don Vito Corleone Wink ,

on peut personnaliser l'éditeur avec ce script:
Modules/HTML&JAVASCRIPT/Gestion des codes Javascript/Créer un nouveau Javascript

Mettre un titre explicite.
Cocher sur toutes les pages.
Code:

$(function(){
$(function() {
$("#text_editor_textarea ").sceditor('instance')
.css
('
code::before{content:"Ceci est un code";color:white;background-color: #3d3d3d !important;}
code{background-color: #3d3d3d !important;color:white !important;}
blockquote{background-color: #595959 !important;color:white !important;}
')
})});



Penses à cliquer sur le bouton


a++

Milouze14
+ Hyperactif +

Masculin
Messages : 4628
Inscrit(e) le : 18/04/2005

http://www.milouze14.com/
Milouze14 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Couleurs de l'éditeur en mode Wysiwyg

Message par Invité le Dim 13 Déc 2015 - 8:20

Hello Milouze,

J'avais tout tenté sauf le double fonction grrrrrrrrr Wink

Merci l'ami

Invité
Invité


Invité a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Couleurs de l'éditeur en mode Wysiwyg

Message par Milouze14 le Dim 13 Déc 2015 - 8:27

Re,

oui il ne pardonne rien Very Happy .

a++

Milouze14
+ Hyperactif +

Masculin
Messages : 4628
Inscrit(e) le : 18/04/2005

http://www.milouze14.com/
Milouze14 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Couleurs de l'éditeur en mode Wysiwyg

Message par roussinix le Dim 13 Déc 2015 - 9:36

Merci à vous deux, c'est super ... mais je vais tester à fond les deux méthodes ... la barre avec des boutons en plus me plais bien.

Bon, je vais aller voter et ensuite, je testerais et personnaliserais tout ça à tête reposée.

roussinix
**

Masculin
Messages : 64
Inscrit(e) le : 21/08/2015

http://testkpark.forumactif.org/
roussinix a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Couleurs de l'éditeur en mode Wysiwyg

Message par roussinix le Dim 13 Déc 2015 - 12:35

Bon, j'ai adopté la solution de Milouze14 même si les deux solution donne 100% satisfaction au niveau des couleurs. Par contre, dans la solution de Don Vito Corleone, il y a certes des boutons en plus, mais aussi des boutons en moins (Gras, Italic, Souligné et Barré).

D'ailleurs, du coup, il me vient une autre question : Comment rajouter les boutons "Liste" de l'éditeur complet à l'éditeur rapide. J'ai trouvé comment ajouter des boutons allant vers des liens externes, mais pas pour ces boutons là (surtout qu'il ne faudrait pas que du coup ils apparaissent en double sur l'éditeur complet.

Petite remarque : Quand deux personnes (ou plus) ont données des solutions valables, il est dommage de ne pouvoir en remercier qu'un seul. Sad

roussinix
**

Masculin
Messages : 64
Inscrit(e) le : 21/08/2015

http://testkpark.forumactif.org/
roussinix a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Couleurs de l'éditeur en mode Wysiwyg

Message par Invité le Lun 14 Déc 2015 - 17:52

Bonjour,

Petite remarque : Quand deux personnes (ou plus) ont données des solutions valables, il est dommage de ne pouvoir en remercier qu'un seul. Sad

Pas forcément de plus ma solution n'était pas adaptée,ne soyez pas triste Wink
Je citerais bien les propos d'Ea qui explique plutôt bien la fonction "merci":

Spoiler:
Si je vois un sujet qui m'intéresse, je l'ouvre et lit le premier post. Ensuite je le parcours et si je tombe sur un post remercié je saurais directement que la réponse qui a résolu la question qui m'intéressait dans ce sujet est très probablement dans ce message remercié ( alors que si il y avait eu 10 messages remerciés peut-être pas à juste titre je trouve la fonction presque inutile ).

Pour votre question (moi personnellement) aucune idée désolé peut-être serait-il judicieux de poster une demande dans ce sens et dans la section appropriée,à moins que quelqu'un donne la solution dans ce sujet.


Cordialement.

Invité
Invité


Invité a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Couleurs de l'éditeur en mode Wysiwyg

Message par roussinix le Lun 14 Déc 2015 - 18:02

Justement, ta solution n'était pas loin de répondre aux deux questions à la fois, car la barre d'icône complète existe (elle est à l'adresse que tu m'as donné http://www.sceditor.com). Donc, en théorie, ont doit pouvoir rendre tous les boutons visibles dans les deux éditeurs. Wink


roussinix
**

Masculin
Messages : 64
Inscrit(e) le : 21/08/2015

http://testkpark.forumactif.org/
roussinix a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Couleurs de l'éditeur en mode Wysiwyg

Message par Milouze14 le Lun 14 Déc 2015 - 18:10

Salut roussinix,

pour les boutons" liste" :

Modules/HTML&JAVASCRIPT/Gestion des codes Javascript/Créer un nouveau Javascript

Mettre un titre explicite.
Cocher Sur les sujets.

Déposes ceci:
Code:

$(function(){
$(function(){
$('<a class="sceditor-button" unselectable="on" title="-Liste">
<div unselectable="on" style="background-image:url(http://i68.servimg.com/u/f68/11/26/21/37/bullet10.png)">-Liste</div></a>').insertBefore('.sceditor-button-left').click(function(){
$('#text_editor_textarea').sceditor("instance").insert('[list][*][/list] ');
});})});

$(function(){
$(function(){
$('<a class="sceditor-button" unselectable="on" title="Liste ordonnée">
<div unselectable="on" style="background-image:url(http://i68.servimg.com/u/f68/11/26/21/37/number10.png)">Liste ordonnée</div></a>').insertBefore('.sceditor-button-left').click(function(){
$('#text_editor_textarea').sceditor("instance").insert('
[list=1][*][/list]');
});})});



Penses à cliquer sur le bouton

a++

Milouze14
+ Hyperactif +

Masculin
Messages : 4628
Inscrit(e) le : 18/04/2005

http://www.milouze14.com/
Milouze14 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Couleurs de l'éditeur en mode Wysiwyg

Message par roussinix le Lun 14 Déc 2015 - 18:20

Impeccable, merci Very Happy

roussinix
**

Masculin
Messages : 64
Inscrit(e) le : 21/08/2015

http://testkpark.forumactif.org/
roussinix a été remercié(e) par l'auteur de ce sujet.

Voir le sujet précédent Voir le sujet suivant Revenir en haut


Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum