Compteur de visites gratuit
CAForum infos
Ajouter imgur à l'éditeur de la réponse rapide Imgser10
Derniers sujets
» » Supprimez les/des boutons de la Chatbox
Ajouter imgur à l'éditeur de la réponse rapide Clock-10Ven 19 Juil 2019 - 13:33 par Passiflore

» » [phpBB3] Nouvelle police d'écriture
Ajouter imgur à l'éditeur de la réponse rapide Clock-10Jeu 18 Juil 2019 - 9:43 par Splash

» » Un ptit délire
Ajouter imgur à l'éditeur de la réponse rapide Clock-10Mer 17 Juil 2019 - 23:06 par Splash

» » Installer une police d'écriture sur votre forum
Ajouter imgur à l'éditeur de la réponse rapide Clock-10Sam 13 Juil 2019 - 20:47 par Splash

» » Icône pour la Chatbox sur la toolbar
Ajouter imgur à l'éditeur de la réponse rapide Clock-10Sam 13 Juil 2019 - 13:41 par chrisnvidia

» » Rendre l'image du header cliquable
Ajouter imgur à l'éditeur de la réponse rapide Clock-10Mer 3 Juil 2019 - 18:38 par David1195

» » Rendre l'image du header cliquable
Ajouter imgur à l'éditeur de la réponse rapide Clock-10Mer 3 Juil 2019 - 18:38 par David1195

» » Rendre l'image du header cliquable
Ajouter imgur à l'éditeur de la réponse rapide Clock-10Mer 3 Juil 2019 - 18:37 par David1195

» » Personnaliser la fenêtre de Connexion
Ajouter imgur à l'éditeur de la réponse rapide Clock-10Mer 3 Juil 2019 - 18:35 par David1195

» » Mettre le profil à droite dans les messages
Ajouter imgur à l'éditeur de la réponse rapide Clock-10Mer 3 Juil 2019 - 18:31 par David1195

» » Les dernières informations de Forumactif
Ajouter imgur à l'éditeur de la réponse rapide Clock-10Mer 3 Juil 2019 - 17:34 par Splash

» » [Edge] Modifier la fenêtre connexion rapide
Ajouter imgur à l'éditeur de la réponse rapide Clock-10Jeu 20 Juin 2019 - 20:00 par Splash

» » Le coucou du jour
Ajouter imgur à l'éditeur de la réponse rapide Clock-10Jeu 20 Juin 2019 - 17:11 par chrisnvidia

» » Autres hébergeurs d'images
Ajouter imgur à l'éditeur de la réponse rapide Clock-10Jeu 20 Juin 2019 - 16:44 par David1195

» » Modifier l'affichage "Sujets" et "Messages" sur l'index
Ajouter imgur à l'éditeur de la réponse rapide Clock-10Jeu 20 Juin 2019 - 16:39 par David1195

» » Bloc de connexion
Ajouter imgur à l'éditeur de la réponse rapide Clock-10Jeu 20 Juin 2019 - 16:32 par chrisnvidia

» » Problèmes sur Forumactif depuis le 16 juin 2019
Ajouter imgur à l'éditeur de la réponse rapide Clock-10Mer 19 Juin 2019 - 11:29 par Splash

» » [Edge] Mise à jour FAE v1.2.12
Ajouter imgur à l'éditeur de la réponse rapide Clock-10Lun 17 Juin 2019 - 21:42 par Splash

» » Pas moyen d'aller dans le panneau d'administration....
Ajouter imgur à l'éditeur de la réponse rapide Clock-10Lun 17 Juin 2019 - 13:45 par Diane M

» » Comment écrire Premier et Deuxième ainsi que Degré en exposant
Ajouter imgur à l'éditeur de la réponse rapide Clock-10Jeu 6 Juin 2019 - 13:55 par David1195

Ajouter imgur à l'éditeur de la réponse rapide

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

Splash

Splash

StaffAdmin
StaffAdmin

MessageSplash le Mer 27 Fév 2019 - 6:18

  • MP
  • Zoom
Hi,

Voici une petite astuce pour ajouter un bouton, à la réponse rapide, pour l'hébergeur imgur

Direction le javascript

Panneau d'administration / Modules / HTML & JAVASCRIPT / Gestion des codes javascript


Mettre ce script Sur les sujets :
Code:
;window['FormData'] && $(function(){$(function(){
 
  var imgur_client_id = 'Client-ID';
 
  var current = 0, uploaded, xhrs, file_selector, button = $('<a class="sceditor-button imgur-button" unselectable="on" title="Héberger une image"><div unselectable="on">Héberger avec imgur</div></a>').insertBefore('.sceditor-button-servimg').click(function(){
    if(current) return finish();
    if(!file_selector) file_selector = $('<input type="file" multiple/ accept="image/*">').css({position:'absolute', top:-100}).appendTo('body').change(function (e) {
      var files = e.target.files, fd, len;
      uploaded = [], xhrs = [];
      for (var i = 0, len = files.length; i < len; i += 1) {
        if (files[i].type.indexOf('image/') && files[i].type !== 'application/pdf') continue;
        current++;
        fd = new FormData();
        fd.append('image', files[i]);
        (function(xhr){
          var num = i, xhr = jQuery.ajaxSettings.xhr();
          xhrs.push(xhr);
          xhr.open('POST', 'https://api.imgur.com/3/image');
          xhr.setRequestHeader('Authorization', 'Client-ID '+imgur_client_id);
          xhr.onreadystatechange = function () {
            if (xhr.readyState !== 4) return;
            current--;
            if (xhr.status === 200) {
              var res = JSON.parse(xhr.responseText);
              uploaded[num] = res.data.link;
            }
            if(!current) finish();
          };
          xhr.send(fd);
        })();
      }
      if(current) button.css({background:'url(https://i.imgur.com/EMsOJtZ.gif) no-repeat'});
    });
    file_selector.click();
    return false;
  }).children();
  var finish = function(){
    for(var i=0; i < xhrs.length; i++) {
        if(xhrs[i].readyState == 4) continue;
        xhrs[i].onreadystatechange = function(){};
        xhrs[i].abort();
    }
    for(var i=0; i < uploaded.length; i++) {
      if(uploaded[i] === undefined) continue;
      $('body').find('.sceditor-button-image').click().end().find('.sceditor-insertimage').find('#image').val(uploaded[i]).end().find('input.button').click();
      $('#text_editor_textarea').sceditor('instance').insertText('\n');
    }
    button.removeAttr('style');
    current = 0;
    file_selector.wrap('<form>').closest('form').get(0).reset();
    file_selector.unwrap();
    return false;
  };
})});

Renseignez votre Client ID ici :
Code:
var imgur_client_id = 'Client-ID';

Pour l'obtention de votre Client ID, voir ce topic : https://lesforums.caforum.fr/t351-remplacer-servimg-par-imgur

Pour changer le texte de l'infobulle c'est ici :
Code:
<div unselectable="on">Héberger avec imgur</div>

Remplacer Héberger avec imgur par ce que vous voulez

Pensez à   Valider 2

Un peu de CSS pour mettre une image au bouton

Direction le CSS

Panneau d'administration / Affichage / Images et Couleurs / Couleurs / Feuille de style CSS


Mettre ce code à la CSS :
Code:
a.imgur-button div {
  background:url(https://i.imgur.com/rFzEjxZ.png);
}

Pensez à   Valider 2


Le nouveau bouton imgur figure à l'éditeur de la réponse rapide

Ajouter imgur à l'éditeur de la réponse rapide Imgur11




:u1:
À bientôt
Bye



† Aucune aide ne sera donnée en privé
David1195

David1195

StaffModo
StaffModo

MessageDavid1195 le Mer 27 Fév 2019 - 12:26

  • MP
  • Zoom
Merci beaucoup !



Modérateur des forums



chrisnvidia

chrisnvidia

Membre
Membre

Messagechrisnvidia le Mer 27 Fév 2019 - 16:38

  • MP
  • Zoom
Merci beaucoup !
LilaCH

LilaCH

Membre
Membre

MessageLilaCH le Dim 3 Mar 2019 - 9:03

  • MP
  • Zoom
Merci beaucoup !

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

Créer un compte ou se connecter pour répondre

Vous devez être membre pour répondre.

S'enregistrer

Rejoignez notre communauté ! C'est facile !


S'enregistrer

Connexion

Vous êtes déjà membre ? Aucun soucis, cliquez ici pour vous connecter.


Connexion

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