Astuces Forumactif
Vous souhaitez réagir à ce message ? Créez un compte en quelques clics ou connectez-vous pour continuer.
Astuces Forumactif

EDGE/ PHPBB2 / PHPBB3/ PUNBB / INVISION/ MODERNBB/ AWESOMEBB
 
AccueilAccueil  PortailPortail  Connexion  S'enregistrerS'enregistrer  
Le deal à ne pas rater :
Promos Nike : Jusqu’à -50% de réduction !
Voir le deal

Astuces Forumactif :: Astuces Forumactif :: Toutes versions
 

 [TOUTES VERSIONS]Afficher au dessus de l'éditeur l'information si mode Wysiwyg ou texte

Aller en bas 
+4
fred9545
chrisnvidia
photoclic
Milouze14
8 participants
AuteurMessage
Milouze14
Fondateur

Milouze14



[TOUTES VERSIONS]Afficher au dessus de l'éditeur l'information si mode Wysiwyg ou texte Empty
MessageSujet: [TOUTES VERSIONS]Afficher au dessus de l'éditeur l'information si mode Wysiwyg ou texte   [TOUTES VERSIONS]Afficher au dessus de l'éditeur l'information si mode Wysiwyg ou texte EmptyJeu 7 Mar 2019 - 18:55
Hello les ami(e)s,

l'astuce suivante permettra à vos membres de voir si l'éditeur est en mode Wysiwyg :
(ce que vous tapez est ce que vous verrez) ou en mode html (texte).

L'avantage est qu'au clic sur le bouton permettant de changer de mode,
le message sera instantané avec une légère transition  clin oeil .

Les aperçus imagés:

Insertion d'un Smiley en mode html (texte)

[TOUTES VERSIONS]Afficher au dessus de l'éditeur l'information si mode Wysiwyg ou texte 1189

Insertion d'un Smiley en mode Wysiwyg

[TOUTES VERSIONS]Afficher au dessus de l'éditeur l'information si mode Wysiwyg ou texte 254


[TOUTES VERSIONS]Afficher au dessus de l'éditeur l'information si mode Wysiwyg ou texte Editeur


Modules/HTML JAVASCRIPT/Gestion des codes JavascriptCréer un nouveau javascript


Mettez un titre explicite.
Cochez sur toutes les pages.


Déposez ceci:
Code:

$(function() {
$(function() {
$editor = $('.sceditor-container');
var a =$editor.hasClass('wysiwygMode');
var b =$editor.hasClass('sourceMode');
  
//LE TEXTE POUR LE MODE WYSIWYG
var visu="Ce que vous voyez est ce que vous obtenez";
//LE TEXTE POUR LE MODE HTML  
var html="Mode texte";
  
$('.sceditor-container').before('<div id="M14_EDITOR"></div>');  
if(a){$('#M14_EDITOR').text(visu); }if(b){$('#M14_EDITOR').text(html);}
$('a.sceditor-button.sceditor-button-source').click(function(){
var c=$(this).hasClass('hover');var d=$(this).not('hover');
if(c){$('#M14_EDITOR').fadeOut().fadeIn().text(html); }
else if(d){ $('#M14_EDITOR').fadeOut().fadeIn().text(visu);}
});})});



Pensez a cliquer sur le bouton Valider


Vous pouvez changer le texte de chacun ici entre les guillemets:
Code:
//LE TEXTE POUR LE MODE WYSIWYG
var visu="Ce que vous voyez est ce que vous obtenez";
//LE TEXTE POUR LE MODE HTML  
var html="Mode texte";







Puis le style, que vous pouvez modifier comme bon vous semble:

Dans la feuille de style:
Affichage/Images et Couleurs/Couleurs/Feuille de style
Déposez ceci:
Code:

#M14_EDITOR
{
background-color: #666 !important;
color: #fff;
font-size: 12px;
font-style: italic;
text-align:center;
padding: 4px;
height: 14px;
line-height: 14px;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
margin: 5px;
box-sizing: content-box;
}




Pensez à valider les modifications en cliquant sur le bouton Valider


Vous pouvez aussi changer les icônes avec ce style:

Code:

/*Bouton wysiwyg */
a.sceditor-button.sceditor-button-source:not(.hover) div
{
background:url(https://i.servimg.com/u/f87/11/26/21/37/keyboa10.png);
background-repeat: no-repeat;
height: 16px;
width: 16px;
}
/*Bouton html */
a.sceditor-button.sceditor-button-source.hover div
{
background:url(https://i.servimg.com/u/f87/11/26/21/37/docume10.png);
background-repeat: no-repeat;
height: 16px;
width: 16px;
}








Dernière édition par Milouze14 le Lun 29 Nov 2021 - 16:34, édité 9 fois
Revenir en haut Aller en bas
https://www.milouze14.com
photoclic
Milouzien

avatar



[TOUTES VERSIONS]Afficher au dessus de l'éditeur l'information si mode Wysiwyg ou texte Empty
MessageSujet: Re: [TOUTES VERSIONS]Afficher au dessus de l'éditeur l'information si mode Wysiwyg ou texte   [TOUTES VERSIONS]Afficher au dessus de l'éditeur l'information si mode Wysiwyg ou texte EmptyJeu 7 Mar 2019 - 20:25
Merci beaucoup !

Excellent Philippe!

ça complète parfaitement cette astuce: https://www.milouze14.com/t31647-toutes-versionsfond-different-en-fonction-du-mode-d-edition

Pour laquelle on peut aussi colorier le bouton comme le fond ainsi:
Code:
/*Bouton wysiwyg idem fond */
a.sceditor-button.sceditor-button-source:not(.hover){background:#cde9ff;}
Revenir en haut Aller en bas
https://photoclic.forum-pro.fr/
Milouze14
Fondateur

Milouze14



[TOUTES VERSIONS]Afficher au dessus de l'éditeur l'information si mode Wysiwyg ou texte Empty
MessageSujet: Re: [TOUTES VERSIONS]Afficher au dessus de l'éditeur l'information si mode Wysiwyg ou texte   [TOUTES VERSIONS]Afficher au dessus de l'éditeur l'information si mode Wysiwyg ou texte EmptyVen 8 Mar 2019 - 5:51
Hello Serge,
oui mais ce script est instantané lors du clic contrairement à l"autre clin oeil .

Je viens d'ailleurs d'ajouter le lien de cette astuce pour l'occasion impeccable .

Revenir en haut Aller en bas
https://www.milouze14.com
Invité
Invité
Anonymous



[TOUTES VERSIONS]Afficher au dessus de l'éditeur l'information si mode Wysiwyg ou texte Empty
MessageSujet: Re: [TOUTES VERSIONS]Afficher au dessus de l'éditeur l'information si mode Wysiwyg ou texte   [TOUTES VERSIONS]Afficher au dessus de l'éditeur l'information si mode Wysiwyg ou texte EmptyVen 8 Mar 2019 - 10:33
Merci Phil, très pratique  fr4
Revenir en haut Aller en bas
chrisnvidia
Milouzien

chrisnvidia



[TOUTES VERSIONS]Afficher au dessus de l'éditeur l'information si mode Wysiwyg ou texte Empty
MessageSujet: Re: [TOUTES VERSIONS]Afficher au dessus de l'éditeur l'information si mode Wysiwyg ou texte   [TOUTES VERSIONS]Afficher au dessus de l'éditeur l'information si mode Wysiwyg ou texte EmptyVen 8 Mar 2019 - 18:39
Revenir en haut Aller en bas
https://sos-pc.forumactif.org/
Milouze14
Fondateur

Milouze14



[TOUTES VERSIONS]Afficher au dessus de l'éditeur l'information si mode Wysiwyg ou texte Empty
MessageSujet: Re: [TOUTES VERSIONS]Afficher au dessus de l'éditeur l'information si mode Wysiwyg ou texte   [TOUTES VERSIONS]Afficher au dessus de l'éditeur l'information si mode Wysiwyg ou texte EmptySam 9 Mar 2019 - 5:54
Hello les ami(e)s,
je viens d'ajouter un style si toutefois vous désiriez changer les icônes
dans les deux modes clin oeil


Dernière édition par Milouze14 le Sam 9 Mar 2019 - 19:47, édité 1 fois
Revenir en haut Aller en bas
https://www.milouze14.com
Quad Daniel
Animateur blagueur

Quad Daniel



[TOUTES VERSIONS]Afficher au dessus de l'éditeur l'information si mode Wysiwyg ou texte Empty
MessageSujet: Re: [TOUTES VERSIONS]Afficher au dessus de l'éditeur l'information si mode Wysiwyg ou texte   [TOUTES VERSIONS]Afficher au dessus de l'éditeur l'information si mode Wysiwyg ou texte EmptySam 9 Mar 2019 - 7:57
merci Philippe  clin oeil
Revenir en haut Aller en bas
https://www.quadsalvetain.com/
fred9545
Milouzien

fred9545



[TOUTES VERSIONS]Afficher au dessus de l'éditeur l'information si mode Wysiwyg ou texte Empty
MessageSujet: Re: [TOUTES VERSIONS]Afficher au dessus de l'éditeur l'information si mode Wysiwyg ou texte   [TOUTES VERSIONS]Afficher au dessus de l'éditeur l'information si mode Wysiwyg ou texte EmptySam 9 Mar 2019 - 9:59
Merci beaucoup !
Revenir en haut Aller en bas
http://www.mecanique-auto.com/
Invité
Invité
Anonymous



[TOUTES VERSIONS]Afficher au dessus de l'éditeur l'information si mode Wysiwyg ou texte Empty
MessageSujet: Re: [TOUTES VERSIONS]Afficher au dessus de l'éditeur l'information si mode Wysiwyg ou texte   [TOUTES VERSIONS]Afficher au dessus de l'éditeur l'information si mode Wysiwyg ou texte EmptyJeu 14 Mar 2019 - 1:39
Merci beaucoup !
Revenir en haut Aller en bas
hamesashek
Milouzien

hamesashek



[TOUTES VERSIONS]Afficher au dessus de l'éditeur l'information si mode Wysiwyg ou texte Empty
MessageSujet: Re: [TOUTES VERSIONS]Afficher au dessus de l'éditeur l'information si mode Wysiwyg ou texte   [TOUTES VERSIONS]Afficher au dessus de l'éditeur l'information si mode Wysiwyg ou texte EmptySam 23 Mar 2019 - 16:45
Merci beaucoup !
Revenir en haut Aller en bas
http://3arb-way.a7larab.net/
Invité
Invité
Anonymous



[TOUTES VERSIONS]Afficher au dessus de l'éditeur l'information si mode Wysiwyg ou texte Empty
MessageSujet: Re: [TOUTES VERSIONS]Afficher au dessus de l'éditeur l'information si mode Wysiwyg ou texte   [TOUTES VERSIONS]Afficher au dessus de l'éditeur l'information si mode Wysiwyg ou texte EmptyDim 24 Mar 2019 - 1:05
Merci beaucoup !
Revenir en haut Aller en bas
Ptite_Perle
Milouzien

Ptite_Perle



[TOUTES VERSIONS]Afficher au dessus de l'éditeur l'information si mode Wysiwyg ou texte Empty
MessageSujet: Re: [TOUTES VERSIONS]Afficher au dessus de l'éditeur l'information si mode Wysiwyg ou texte   [TOUTES VERSIONS]Afficher au dessus de l'éditeur l'information si mode Wysiwyg ou texte EmptyJeu 28 Mar 2019 - 20:56
Merci
Revenir en haut Aller en bas
https://forumcrea.forumactif.org/
Chéryl
Nouveau membre

Chéryl



[TOUTES VERSIONS]Afficher au dessus de l'éditeur l'information si mode Wysiwyg ou texte Empty
MessageSujet: Re: [TOUTES VERSIONS]Afficher au dessus de l'éditeur l'information si mode Wysiwyg ou texte   [TOUTES VERSIONS]Afficher au dessus de l'éditeur l'information si mode Wysiwyg ou texte EmptySam 30 Mar 2019 - 9:55
Merci beaucoup
Revenir en haut Aller en bas
https://graphismelesangesden.forumactif.org/
Quad Daniel
Animateur blagueur

Quad Daniel



[TOUTES VERSIONS]Afficher au dessus de l'éditeur l'information si mode Wysiwyg ou texte Empty
MessageSujet: Re: [TOUTES VERSIONS]Afficher au dessus de l'éditeur l'information si mode Wysiwyg ou texte   [TOUTES VERSIONS]Afficher au dessus de l'éditeur l'information si mode Wysiwyg ou texte EmptySam 30 Mar 2019 - 10:03
Merci beaucoup
Revenir en haut Aller en bas
https://www.quadsalvetain.com/
Contenu sponsorisé





[TOUTES VERSIONS]Afficher au dessus de l'éditeur l'information si mode Wysiwyg ou texte Empty
MessageSujet: Re: [TOUTES VERSIONS]Afficher au dessus de l'éditeur l'information si mode Wysiwyg ou texte   [TOUTES VERSIONS]Afficher au dessus de l'éditeur l'information si mode Wysiwyg ou texte Empty
Revenir en haut Aller en bas
 
[TOUTES VERSIONS]Afficher au dessus de l'éditeur l'information si mode Wysiwyg ou texte
Revenir en haut 
Page 1 sur 1
 Sujets similaires
-
» [TOUTES VERSIONS] Afficher un texte dactylographié
» [TOUTES VERSIONS] Afficher un texte dans l'éditeur avec transition
» [TOUTES VERSIONS] Afficher un texte qui au clic postera un message automatiquement
» [TOUTES VERSIONS] Changer les boutons Nouveau MP et Répondre au MP par du texte
» [TOUTES VERSIONS] Ajouter le texte bienvenu et le Pseudo dans l'onglet du navigateur

Permission de ce forum:Vous ne pouvez pas répondre aux sujets dans ce forum
Astuces Forumactif :: Astuces Forumactif :: Toutes versions-
Sauter vers: