Rajout de boutons personnalisé avec liste déroulante sur le nouvel éditeur

4 participants

Page 3 sur 3 Précédent  1, 2, 3

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

Résolu Rajout de boutons personnalisé avec liste déroulante sur le nouvel éditeur

Message par demeter1 Jeu 13 Juin 2013 - 6:36

Rappel du premier message :

Bonjour à tous,
L'ancien éditeur permettait le rajout de boutons personnalisés en passant par les templates.

La dernière mise à jour ayant anéanti d'un coup de nombreux boutons, j'aimerai savoir s'il est possible d'en rajouter avec ce nouvel éditeur.

Merci par avance pour vos réponses


Dernière édition par demeter1 le Sam 5 Oct 2013 - 0:32, édité 7 fois
demeter1

demeter1
Membre actif

Masculin
Messages : 8993
Inscrit(e) le : 23/01/2009

https://altitudetropicale.forums-actifs.com/
demeter1 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Rajout de boutons personnalisé avec liste déroulante sur le nouvel éditeur

Message par demeter1 Dim 8 Sep 2013 - 18:35

up du troisième mois.
demeter1

demeter1
Membre actif

Masculin
Messages : 8993
Inscrit(e) le : 23/01/2009

https://altitudetropicale.forums-actifs.com/
demeter1 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Rajout de boutons personnalisé avec liste déroulante sur le nouvel éditeur

Message par demeter1 Mar 10 Sep 2013 - 9:45

up
demeter1

demeter1
Membre actif

Masculin
Messages : 8993
Inscrit(e) le : 23/01/2009

https://altitudetropicale.forums-actifs.com/
demeter1 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Rajout de boutons personnalisé avec liste déroulante sur le nouvel éditeur

Message par demeter1 Mer 11 Sep 2013 - 15:05

up
demeter1

demeter1
Membre actif

Masculin
Messages : 8993
Inscrit(e) le : 23/01/2009

https://altitudetropicale.forums-actifs.com/
demeter1 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Rajout de boutons personnalisé avec liste déroulante sur le nouvel éditeur

Message par demeter1 Jeu 12 Sep 2013 - 15:58

up
demeter1

demeter1
Membre actif

Masculin
Messages : 8993
Inscrit(e) le : 23/01/2009

https://altitudetropicale.forums-actifs.com/
demeter1 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Rajout de boutons personnalisé avec liste déroulante sur le nouvel éditeur

Message par demeter1 Ven 13 Sep 2013 - 16:07

up
demeter1

demeter1
Membre actif

Masculin
Messages : 8993
Inscrit(e) le : 23/01/2009

https://altitudetropicale.forums-actifs.com/
demeter1 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Rajout de boutons personnalisé avec liste déroulante sur le nouvel éditeur

Message par demeter1 Lun 16 Sep 2013 - 16:27

up
demeter1

demeter1
Membre actif

Masculin
Messages : 8993
Inscrit(e) le : 23/01/2009

https://altitudetropicale.forums-actifs.com/
demeter1 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Rajout de boutons personnalisé avec liste déroulante sur le nouvel éditeur

Message par demeter1 Lun 23 Sep 2013 - 15:11

up
demeter1

demeter1
Membre actif

Masculin
Messages : 8993
Inscrit(e) le : 23/01/2009

https://altitudetropicale.forums-actifs.com/
demeter1 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Rajout de boutons personnalisé avec liste déroulante sur le nouvel éditeur

Message par demeter1 Sam 28 Sep 2013 - 15:28

up
demeter1

demeter1
Membre actif

Masculin
Messages : 8993
Inscrit(e) le : 23/01/2009

https://altitudetropicale.forums-actifs.com/
demeter1 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Rajout de boutons personnalisé avec liste déroulante sur le nouvel éditeur

Message par demeter1 Lun 30 Sep 2013 - 13:52

up
demeter1

demeter1
Membre actif

Masculin
Messages : 8993
Inscrit(e) le : 23/01/2009

https://altitudetropicale.forums-actifs.com/
demeter1 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Rajout de boutons personnalisé avec liste déroulante sur le nouvel éditeur

Message par demeter1 Mer 2 Oct 2013 - 14:15

up
demeter1

demeter1
Membre actif

Masculin
Messages : 8993
Inscrit(e) le : 23/01/2009

https://altitudetropicale.forums-actifs.com/
demeter1 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Rajout de boutons personnalisé avec liste déroulante sur le nouvel éditeur

Message par Invité Mer 2 Oct 2013 - 19:40

Salut Stéphane,
j'ai bien un truc mais c'est assez lourd mon ami Rolling Eyes  .


Je te le donne tout de même Wink :


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

Mettre un titre explicite.
Cocher sur toutes les pages.

Code:

$(function(){  
$(function(){
      $('#M14_bloc_deroulant').insertAfter('.sceditor-button-source');
      
       })});

$(function () {
$('#M14_bloc_deroulant li ul').hide().removeClass('fallback');
$('#M14_bloc_deroulant li').hover(function () {
$('ul', this).stop().slideToggle(400);
 });
 });

$(function(){
$(function(){
$('<a class="sceditor-button" unselectable="on" title="LE TITRE AU SURVOL DU BOUTON">
<div unselectable="on" style="background-image:none !important"></div>
<span>Xata</span>
</a>')
.appendTo('#M14_bloc_deroulant li.M14_soustitre1 ').click(function()
{
$('#text_editor_textarea').sceditor("instance")
.insert("[Xata]","[/Xata]");
});
})
});
$(function(){
$(function(){
$('<a class="sceditor-button" unselectable="on" title="LE TITRE AU SURVOL DU BOUTON">
<div unselectable="on" style="background-image:none !important"></div>
<span>Hydra</span>
</a>')
.appendTo('#M14_bloc_deroulant li.M14_soustitre2 ').click(function()
{
$('#text_editor_textarea').sceditor("instance")
.insert("[Hydra]","[/Hydra]");
});
})
});
$(function(){
$(function(){
$('<a class="sceditor-button" unselectable="on" title="LE TITRE AU SURVOL DU BOUTON">
<div unselectable="on" style="background-image:none !important"></div>
<span>Présentation</span>
</a>')
.appendTo('#M14_bloc_deroulant li.M14_soustitre3 ').click(function()
{
$('#text_editor_textarea').sceditor("instance")
.insert("[Presentation]","[/Presentation]");
});
})
});
$(function(){
$(function(){
$('<a class="sceditor-button" unselectable="on" title="LE TITRE AU SURVOL DU BOUTON">
<div unselectable="on" style="background-image:none !important"></div>
<span>Charte</span>
</a>')
.appendTo('#M14_bloc_deroulant li.M14_soustitre4 ').click(function()
{
$('#text_editor_textarea').sceditor("instance")
.insert("[Charte]","[/Charte]");
});
})
});

$(function(){
$(function(){
$('<a class="sceditor-button" unselectable="on" title="LE TITRE AU SURVOL DU BOUTON">
<div unselectable="on" style="background-image:none !important"></div>
<span>Titre</span>
</a>')
.appendTo('#M14_bloc_deroulant li.M14_soustitre5 ').click(function()
{
$('#text_editor_textarea').sceditor("instance")
.insert("[Titre]","[/Titre]");
});
})
});

$(function(){
$(function(){
$('<a class="sceditor-button" unselectable="on" title="LE TITRE AU SURVOL DU BOUTON">
<div unselectable="on" style="background-image:none !important"></div>
<span>Verrou</span>
</a>')
.appendTo('#M14_bloc_deroulant li.M14_soustitre6 ').click(function()
{
$('#text_editor_textarea').sceditor("instance")
.insert("[Verrou]","[/Verrou]");
});
})
});

$(function(){
$(function(){
$('<a class="sceditor-button" unselectable="on" title="LE TITRE AU SURVOL DU BOUTON">
<div unselectable="on" style="background-image:none !important"></div>
<span>Modération</span>
</a>')
.appendTo('#M14_bloc_deroulant li.M14_soustitre7 ').click(function()
{
$('#text_editor_textarea').sceditor("instance")
.insert("[Moderation]","[/Moderation]");
});
})
});

Pensez à cliquer sur le boutonRajout de boutons personnalisé avec liste déroulante sur le nouvel éditeur - Page 3 Boutonvalider
Dans la feuille de style:
Affichage/Images et Couleurs/Couleurs/Feuille de style



Code:

#M14_bloc_deroulant {background:transparent;float:right;height:20px;margin-top:-5px;}
#M14_bloc_deroulant ul {text-align:center;}
#M14_bloc_deroulant ul li {display:inline;}

#M14_bloc_deroulant ul li a {display:block;}
#M14_bloc_deroulant ul li ul
{
position:absolute;
background:#FFF;
width:80px;
padding:2px 30px 10px 10px;
border:1px solid #666;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
}
#M14_bloc_deroulant ul li ul li.M14_soustitre1 ,
#M14_bloc_deroulant ul li ul li.M14_soustitre2 ,
#M14_bloc_deroulant ul li ul li.M14_soustitre3 ,
#M14_bloc_deroulant ul li ul li.M14_soustitre4 ,
#M14_bloc_deroulant ul li ul li.M14_soustitre5 ,
#M14_bloc_deroulant ul li ul li.M14_soustitre6 ,
#M14_bloc_deroulant ul li ul li.M14_soustitre7
{
margin:0;
padding:0;
width:80px;
height:20px;
float:left;

}

#M14_bloc_deroulant ul li ul li a.sceditor-button
{display:inline;padding:2px ;color:#444;font-size:11px;text-decoration:none!important;}
#M14_bloc_deroulant ul li ul li:hover a.sceditor-button {background:transparent;}
#M14_bloc_deroulant ul li ul.fallback {display:none;padding:2px;}
#M14_bloc_deroulant ul li:hover ul.fallback {display:block;}
#M14_bloc_deroulant a.sceditor-button:hover {box-shadow:none!important;}
Pense à cliquer sur le boutonRajout de boutons personnalisé avec liste déroulante sur le nouvel éditeur - Page 3 Boutonvalider

Dans le template:posting_body
Affichage/Templates/Poster et messages privés/posting_body


Recherches ligne 211 environ Very Happy :
Code:
<td class="row2" valign="top"><span class="genmed"></span>
 <table border="0" cellspacing="0" cellpadding="0" width="100%">
Juste après ajoutes ceci:

Code:

<div id="M14_bloc_deroulant">
<ul>
<li>
<a href="#"><img src="LE LIEN DE L IMAGE"/></a>
<ul class="fallback">
  <li class="M14_soustitre1"></li>
                  <li class="M14_soustitre2"></li>
                  <li class="M14_soustitre3"></li>
                  <li class="M14_soustitre4"></li>
                  <li class="M14_soustitre5"></li>
                  <li class="M14_soustitre6"></li>
                  <li class="M14_soustitre7"></li>
</ul>
</li>
</ul>
</div>


Pense a enregistrer les modifications en cliquant respectivement sur Rajout de boutons personnalisé avec liste déroulante sur le nouvel éditeur - Page 3 907288et Rajout de boutons personnalisé avec liste déroulante sur le nouvel éditeur - Page 3 Ajouter2024


Il ne restera plus qu'a attribuer les droits mon ami Wink 

a++


Dernière édition par Milouze14 le Ven 4 Oct 2013 - 16:48, édité 1 fois
Anonymous

Invité
Invité


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

Résolu Re: Rajout de boutons personnalisé avec liste déroulante sur le nouvel éditeur

Message par demeter1 Ven 4 Oct 2013 - 15:11

Bonjour Milouze,
un grand merci déjà pour cette aide.:thanks: 

Le script fonctionne à merveille; chapeau bas pour le script. Je vais grandement abuser en te demandant s'il est possible de faire apparaitre également le bouton dans le message rapide .

Pour attribuer les droits aux modérateurs, je suppose qu'il faut mettre en début de script quelque chose de ce style

Code:
$(function(){if (userdata.user_level == 2 )
Encore un grand merci pour ton aide

demeter1

demeter1
Membre actif

Masculin
Messages : 8993
Inscrit(e) le : 23/01/2009

https://altitudetropicale.forums-actifs.com/
demeter1 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Rajout de boutons personnalisé avec liste déroulante sur le nouvel éditeur

Message par Invité Ven 4 Oct 2013 - 16:08

Salut Stéphane,
de rien c'est un réel plaisir Wink ,

Il suffit de rajouter le code Html :


Code:

<div id="M14_bloc_deroulant">
<ul>
<li>
<a href="#"><img src="LE LIEN DE L IMAGE"/></a>
<ul class="fallback">
  <li class="M14_soustitre1"></li>
                  <li class="M14_soustitre2"></li>
                  <li class="M14_soustitre3"></li>
                  <li class="M14_soustitre4"></li>
                  <li class="M14_soustitre5"></li>
                  <li class="M14_soustitre6"></li>
                  <li class="M14_soustitre7"></li>
</ul>
</li>
</ul>
</div>

Dans le template viewtopic_body:
Affichage/Templates/Général/viewtopic_body

Recherches ceci:
Code:

{QUICK_REPLY_FORM}<br />
Juste après ajoutes le code html ci-dessus Wink 
Pensez a enregistrer les modifications en cliquant respectivement sur Rajout de boutons personnalisé avec liste déroulante sur le nouvel éditeur - Page 3 907288et Rajout de boutons personnalisé avec liste déroulante sur le nouvel éditeur - Page 3 Ajouter2024



Et voilà le tour est joué Wink  .

Pour les droits, j'ai enfin pigé le fonctionnement car en fait je me basais sur une astuce vue ailleurs.
Enfin bref:

Il faut voir les groupes dans ton PA et regarder
(en passant le curseur de ta souris pour afficher le chiffre attribué )

Rajout de boutons personnalisé avec liste déroulante sur le nouvel éditeur - Page 3 120



a++


Dernière édition par Milouze14 le Ven 4 Oct 2013 - 16:47, édité 1 fois
Anonymous

Invité
Invité


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

Résolu Re: Rajout de boutons personnalisé avec liste déroulante sur le nouvel éditeur

Message par Invité Ven 4 Oct 2013 - 16:45

Re,
je me permet de faire un double post car je ne sais pas si Demeter avait lu mon message,
j'ai amélioré le plugin en y insérant directement le code HTML :

Donc tu peux supprimer le code HTML dans les deux templates Stéphane Wink ;

Voici ensuite le plugin dans sa totalité mon ami Clin d\'oeil  :
Code:

$(function(){

 $('body').append("<div id='M14_bloc_deroulant'>
<ul>
<li>
<a href='#'><img src='LE LIEN DE L IMAGE'/></a>
<ul class='fallback'>
  <li class='M14_soustitre1'></li>
                  <li class='M14_soustitre2'></li>
                  <li class='M14_soustitre3'></li>
                  <li class='M14_soustitre4'></li>
                  <li class='M14_soustitre5'></li>
                  <li class='M14_soustitre6'></li>
                  <li class='M14_soustitre7'></li>
</ul>
</li>
</ul>
</div>");
});




$(function(){  
$(function(){
$('#M14_bloc_deroulant').insertAfter('.sceditor-button-source');

      
       })});

$(function () {
$('#M14_bloc_deroulant li ul').hide().removeClass('fallback');
$('#M14_bloc_deroulant li').hover(function () {
$('ul', this).stop().slideToggle(400);
 });
 });




$(function(){
$(function(){
$('<a class="sceditor-button" unselectable="on" title="LE TITRE AU SURVOL DU BOUTON">
<div unselectable="on" style="background-image:none !important"></div>
<span>Xata</span>
</a>')
.appendTo('#M14_bloc_deroulant li.M14_soustitre1 ').click(function()
{
$('#text_editor_textarea').sceditor("instance")
.insert("[Xata]","[/Xata]");
});
})
});
$(function(){
$(function(){
$('<a class="sceditor-button" unselectable="on" title="LE TITRE AU SURVOL DU BOUTON">
<div unselectable="on" style="background-image:none !important"></div>
<span>Hydra</span>
</a>')
.appendTo('#M14_bloc_deroulant li.M14_soustitre2 ').click(function()
{
$('#text_editor_textarea').sceditor("instance")
.insert("[Hydra]","[/Hydra]");
});
})
});
$(function(){
$(function(){
$('<a class="sceditor-button" unselectable="on" title="LE TITRE AU SURVOL DU BOUTON">
<div unselectable="on" style="background-image:none !important"></div>
<span>Présentation</span>
</a>')
.appendTo('#M14_bloc_deroulant li.M14_soustitre3 ').click(function()
{
$('#text_editor_textarea').sceditor("instance")
.insert("[Presentation]","[/Presentation]");
});
})
});
$(function(){
$(function(){
$('<a class="sceditor-button" unselectable="on" title="LE TITRE AU SURVOL DU BOUTON">
<div unselectable="on" style="background-image:none !important"></div>
<span>Charte</span>
</a>')
.appendTo('#M14_bloc_deroulant li.M14_soustitre4 ').click(function()
{
$('#text_editor_textarea').sceditor("instance")
.insert("[Charte]","[/Charte]");
});
})
});

$(function(){
$(function(){
$('<a class="sceditor-button" unselectable="on" title="LE TITRE AU SURVOL DU BOUTON">
<div unselectable="on" style="background-image:none !important"></div>
<span>Titre</span>
</a>')
.appendTo('#M14_bloc_deroulant li.M14_soustitre5 ').click(function()
{
$('#text_editor_textarea').sceditor("instance")
.insert("[Titre]","[/Titre]");
});
})
});

$(function(){
$(function(){
$('<a class="sceditor-button" unselectable="on" title="LE TITRE AU SURVOL DU BOUTON">
<div unselectable="on" style="background-image:none !important"></div>
<span>Verrou</span>
</a>')
.appendTo('#M14_bloc_deroulant li.M14_soustitre6 ').click(function()
{
$('#text_editor_textarea').sceditor("instance")
.insert("[Verrou]","[/Verrou]");
});
})
});

$(function(){
$(function(){
$('<a class="sceditor-button" unselectable="on" title="LE TITRE AU SURVOL DU BOUTON">
<div unselectable="on" style="background-image:none !important"></div>
<span>Modération</span>
</a>')
.appendTo('#M14_bloc_deroulant li.M14_soustitre7 ').click(function()
{
$('#text_editor_textarea').sceditor("instance")
.insert("[Moderation]","[/Moderation]");
});
})
});

a++
Anonymous

Invité
Invité


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

Résolu Re: Rajout de boutons personnalisé avec liste déroulante sur le nouvel éditeur

Message par demeter1 Ven 4 Oct 2013 - 18:38

Yes Yes Yes ça fonctionne nickel Philippe. Chapeau bas pour ce codage.

Je vais être chia..t. Dans cette partie :
Code:
$('#text_editor_textarea').sceditor("instance")
.insert("[Xata]","[/Xata]");
est il possible de mettre à la place du bbcode personnalisé une iframe dans ce style :
Code:
<center><IFRAME src=" http://altitudetropicale.forums-actifs.com/h20-message-de-bienvue-7-laurent" width=100% height=580px scrolling=no frameborder=0 > </IFRAME></center>
Désolé pour cette nouvelle question qui n'a presque rien à voir avec la demande initiale. A la limite je ré ouvre un autre sujet pour cette question.

demeter1

demeter1
Membre actif

Masculin
Messages : 8993
Inscrit(e) le : 23/01/2009

https://altitudetropicale.forums-actifs.com/
demeter1 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Rajout de boutons personnalisé avec liste déroulante sur le nouvel éditeur

Message par Invité Ven 4 Oct 2013 - 18:56

Re,
mais non , tu n'es pas ch... Clin d\'oeil .

Ton code sera comme ceci Stéphane :

Code:

<center><IFRAME src=\" http:\//altitudetropicale.forums-actifs.com\/h20-message-de-bienvue-7-laurent\" width=100% height=580px scrolling=no frameborder=0 > </IFRAME></center>
Il faut déposer des \ avant chaque " et /   Clin d\'oeil .

a++
Anonymous

Invité
Invité


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

Résolu Re: Rajout de boutons personnalisé avec liste déroulante sur le nouvel éditeur

Message par demeter1 Sam 5 Oct 2013 - 0:31

Philippe, que dire si ce n'est que tu es un véritable génie. Cela fonctionne à merveille.  Yahoo Yahoo Yahoo Yahoo 
Grace à toi, je vais réussir à remettre en place plusieurs boutons que le nouvel éditeur avait rendu obsolétes.

Un grand, très grand merci ok
demeter1

demeter1
Membre actif

Masculin
Messages : 8993
Inscrit(e) le : 23/01/2009

https://altitudetropicale.forums-actifs.com/
demeter1 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Rajout de boutons personnalisé avec liste déroulante sur le nouvel éditeur

Message par Invité Sam 5 Oct 2013 - 5:25

Salut Stéphane,

allez, un problème de moins Ptdr .

Passons au suivant Clin d\'oeil .

a++
Anonymous

Invité
Invité


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

Résolu Re: Rajout de boutons personnalisé avec liste déroulante sur le nouvel éditeur

Message par demeter1 Sam 5 Oct 2013 - 5:53

Mr. Green Tu m'as enlevé une grosse épine du pied , je peux te l'assurer.
demeter1

demeter1
Membre actif

Masculin
Messages : 8993
Inscrit(e) le : 23/01/2009

https://altitudetropicale.forums-actifs.com/
demeter1 a été remercié(e) par l'auteur de ce sujet.

Page 3 sur 3 Précédent  1, 2, 3

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

- Sujets similaires

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