[Résolu] Icône a rajouter dans la barre des tâches.

[FANCH 56]

Bonjour

J'ai ajouté Hosting comme hébergeur sur mon forum, mais je ne trouve pas comment ajouter une icône dans la barre des tâches de la zone de saisie.

Si quelqu'un a une solution, je suis preneur.

Merci

[Invité]

Bonjour,

Ea a donné une solution ici : https://forum.forumactif.com/t353027-demande-code-pour-ajout-de-bouton#3007636

Cordialement.

[FANCH 56]

Hé bien là, je ne comprends rien.

[richere]

Bonjour Fanch 56

il faut aller dans affichage > Entête et Navigation,
puis en bas tu as l'option d'ajouter un bouton menu
et de le diriger vers un lien URL de ton choix.
et de le placer ou tu veux avec les petites flèche verte à droite.

[Invité]

Re,

Hé bien là, je ne comprends rien.

Qu'est-ce que vous ne comprenez pas ?

Bonjour Fanch 56

il faut aller dans affichage > Entête et Navigation,
puis en bas tu as l'option d'ajouter un bouton menu
et de le diriger vers un lien URL de ton choix.
et de le placer ou tu veux avec les petites flèche verte à droite.

Il s'agit des boutons de l'éditeur et non des boutons de la barre de navigation.

Cordialement.

[FANCH 56]

Bon vous êtes gentil. Pour le java je sais ou on le créé.

Mais je ne comprends pas le script indiqué, il s'agit d'un bouton éditer.

Ce que je souhaite, c'est cliquer sur le bouton, et qu'une fenêtre s'ouvre comme servimg, mais avec ce qui est ci-dessous

[richere]

ok, ben tu vas te créer une nouvelle HTML pour mettre ton hébergeur
et ensuite tu met le URL associé à cette nouvelle page HTML à l'intérieur du nouveau bouton de navigation.
et n'oubli pas de cocher l'option pour qu'elle puisse s'ouvrir dans une nouvelle fenêtre

[richere]

sinon, le bouton, tu peux aussi l'ajouter dans la zone d'édition de message comme tu veux,
mais je trouve qu'en ajouter dans la barre de navigation est beaucoup plus facille

[FANCH 56]

J'ai créé ma page HTML

Code:

http://www.anciens-cols-bleus.net/h3-hosting-boutton

Mais je mets l'url ou ? dans ce java

Code:


$(function(){$(function(){
       
          $('<a class="sceditor-button" unselectable="on" title="Hosting"><div unselectable="on" style="background-image:url(http://2img.net/i/fa//i/smiles/star3.png)">Hosting</div></a>').insertAfter('.sceditor-button-image').click(function(){
            $('#text_editor_textarea').sceditor("instance").insertText("[b][i]","[/i][/b]");
          });
       
        })});

EDIT : Je préfère dans la barre de l'éditeur.

[Self]

Bonjour,

Tu peux essayer de mettre ceci à la toute fin des templates viewtopic_body et posting_body :

Code:

<script type="text/javascript">
jQuery(function($){
   $('<a class="sceditor-button sceditor-button-hostimg" unselectable="on" title="héberger une image"><div unselectable="on" style="background-position: 0px -644px;"></div></a>').insertBefore('.sceditor-button-servimg');
   $('.sceditor-button-hostimg').click(function(e){
      e.preventDefault();
      if($('.sceditor-hostimg').length == 0){
         $('<div class="sceditor-dropdown sceditor-hostimg"><p><iframe style="width: 400px; height: 100px;" src="http://www.hostingpics.net/iframe_mini.php" scrolling="no" allowtransparency="true" frameborder="0"> </iframe></p></div>').appendTo('body');
      }else{
         $('.sceditor-hostimg').fadeToggle();
      };
      var y = $('.sceditor-button-hostimg').offset().top+30;
      var x = $('.sceditor-button-hostimg').offset().left;
      $('.sceditor-hostimg').css({'position':'absolute', 'top':y+'px', 'left':x+'px'});
   });
});
</script>

J'ai mis en fond du bouton la même image que celle actuelle pour servimg.
Si le bouton servimg n'est pas encore masqué et que tu veux le masquer utilise ce CSS :

Code:

.sceditor-button-servimg{
    display:none !important;
}

[FANCH 56]

Merci je verrai cela demain.

Je souhaite avoir les deux hébergeurs. Donc je vais étudier ton java.

bonne nuit

[Self]

Dans ce cas essaie comme ceci (toujours à la toute fin des templates viewtopic_body et posting_body) :

Code:

<script type="text/javascript">
   jQuery(function($){
      $('<a class="sceditor-button sceditor-button-hostimg" unselectable="on" title="héberger une image avec HostingPics"><div unselectable="on"></div></a>').insertBefore('.sceditor-button-servimg');
      $('.sceditor-button-hostimg').click(function(e){
         e.preventDefault();
         if($('.sceditor-hostimg').length == 0){
            $('<div class="sceditor-dropdown sceditor-hostimg"><p><iframe style="width: 400px; height: 100px;" src="http://www.hostingpics.net/iframe_mini.php" scrolling="no" allowtransparency="true" frameborder="0"> </iframe></p></div>').appendTo('body');
         }else{
            $('.sceditor-hostimg').fadeToggle();
         };
         var y = $('.sceditor-button-hostimg').offset().top+30;
         var x = $('.sceditor-button-hostimg').offset().left;
         $('.sceditor-hostimg').css({'position':'absolute', 'top':y+'px', 'left':x+'px'});
      });
   });
</script>

Avec ce CSS :

Code:

.sceditor-button-hostimg div {
    background-position: center center !important;
    background-image: url('http://pbs.twimg.com/profile_images/1106463847/Sans-titre-3_normal.gif') !important;
    background-size: 16px;
}

[AenigmA]

Bonjour,
Merci Self +1

Merci Fanch pour la question, il te faudra aussi je pense ce bout de css en plus.

Code:

div.sceditor-hostimg {
    background: none repeat scroll 0 0 padding-box #fff;
    border: 1px dotted #000000;
    border-radius: 2px;
    box-shadow: 1px 2px 4px rgba(0, 0, 0, 0.8);
    color: #333;
    line-height: 1;
    padding: 5px;
    position: absolute;
    width: 336px;
    z-index: 4000;
}

[FANCH 56]

Alors là je ne comprends pas.

J'ai mis les deux templates et les deux CSS. Retiré mon premier java.

Et pas d'icône !!!!

[AenigmA]

Essaie de revalider tes templates au cas ou, sinon je te confirme qu'en invision c'est ok.

[*Henry*]

Bonjour François ...

Tu mets le dernier JS de SELF comme décrits plus haut

Code:

        <script type="text/javascript">
          jQuery(function($){
              $('<a class="sceditor-button sceditor-button-hostimg" unselectable="on" title="héberger une image avec HostingPics"><div unselectable="on"></div></a>').insertBefore('.sceditor-button-servimg');
              $('.sceditor-button-hostimg').click(function(e){
                e.preventDefault();
                if($('.sceditor-hostimg').length == 0){
                    $('<div class="sceditor-dropdown sceditor-hostimg"><p><iframe style="width: 400px; height: 100px;" src="http://www.hostingpics.net/iframe_mini.php" scrolling="no" allowtransparency="true" frameborder="0"> </iframe></p></div>').appendTo('body');
                }else{
                    $('.sceditor-hostimg').fadeToggle();
                };
                var y = $('.sceditor-button-hostimg').offset().top+30;
                var x = $('.sceditor-button-hostimg').offset().left;
                $('.sceditor-hostimg').css({'position':'absolute', 'top':y+'px', 'left':x+'px'});
              });
          });
        </script>

et uniquement ce entrée de CSS :

Code:

.sceditor-button-hostimg div {
    background-position: center center !important;
    background-image: url('http://pbs.twimg.com/profile_images/1106463847/Sans-titre-3_normal.gif') !important;
    background-size: 16px;
}


Aperçu de résultat

[FANCH 56]

Bon voici le viewtopic_body

viewtopic_body:

================================================

Posting_body:

Les CSS sont également en place.

J'ai appliqué la procédure. Et rien. Peux tu me faire une capture de ce que tu obtiens dans ton editeur ?

Merci

[FANCH 56]

Bonjour François ...

Tu mets le dernier JS de SELF comme décrits plus haut

Code:

        <script type="text/javascript">
          jQuery(function($){
              $('<a class="sceditor-button sceditor-button-hostimg" unselectable="on" title="héberger une image avec HostingPics"><div unselectable="on"></div></a>').insertBefore('.sceditor-button-servimg');
              $('.sceditor-button-hostimg').click(function(e){
                e.preventDefault();
                if($('.sceditor-hostimg').length == 0){
                    $('<div class="sceditor-dropdown sceditor-hostimg"><p><iframe style="width: 400px; height: 100px;" src="http://www.hostingpics.net/iframe_mini.php" scrolling="no" allowtransparency="true" frameborder="0"> </iframe></p></div>').appendTo('body');
                }else{
                    $('.sceditor-hostimg').fadeToggle();
                };
                var y = $('.sceditor-button-hostimg').offset().top+30;
                var x = $('.sceditor-button-hostimg').offset().left;
                $('.sceditor-hostimg').css({'position':'absolute', 'top':y+'px', 'left':x+'px'});
              });
          });
        </script>

et uniquement ce entrée de CSS :

Code:

.sceditor-button-hostimg div {
    background-position: center center !important;
    background-image: url('http://pbs.twimg.com/profile_images/1106463847/Sans-titre-3_normal.gif') !important;
    background-size: 16px;
}


Aperçu de résultat

Ok Henry je vais essayer. Je retire donc les templates et mets juste un java et un CSS ?

edit : Cela me donne ceci

[*Henry*]

François les Templates sont bon.
Sous le CSS doit seulement rester la dénier réglè de SELF

[FANCH 56]

Je ne comprends pas.

Est-ce la bonne procédure ?

Je mets les java de self dans les templates

Et ensuite le CSS

Est-ce correct.

[FANCH 56]

Merci Self et Henry. Super !!



Résolu

[*Henry*]

Avec plaisir.
amicalement