Question

Savez-vous comment ajouter un filigrane dans CKEditor (Visual Word Processor)? Je veux le comportement comme ceci: lorsque le CKEditor est chargé, il a du texte par défaut. Lorsque je clique dessus, le texte doit disparaître.

Était-ce utile?

La solution

Vous trouverez ci-dessous les étapes pour ajouter une marque d'eau dans Ckeditor

Généralement, lorsque vous définissez le texte par défaut dans l'éditeur CK via le script Java sur le chargement de la page. L'événement JavaScript est licencié avant le chargement du contrôle, donc si possible définissez le texte pour le code derrière.

Attacher des événements en javascript pour onfocus et onblur

$(document).ready(function() {
    var myeditor = CKEDITOR.instances['EditorId'];

    myeditor.on("focus", function(e) {
        RemoveDefaultText();
    }); 
    myeditor.on("blur", function(e) {
        setDefaultText();
    });
});

Définissez votre texte par défaut dans cette fonction

function setDefaultText() {
    if (CKEDITOR.instances['EditorId'].getData() == '') {
        CKEDITOR.instances['EditorId'].setData('Your Message Here'); 
    }
}

function RemoveDefaultText() {
   if (CKEDITOR.instances['EditorId'].getData().indexOf('Your Mesage Here') >= 0) {
       CKEDITOR.instances['EditorId'].setData('');
       CKEDITOR.instances['EditorId'].focus();
   }
}

Vous pouvez également définir des styles à la marque d'eau en ajoutant des cours au texte par défaut et placer la classe dans votre éditeur CK Content CSS sinon cela ne fonctionnera pas

Autres conseils

Un plugin prêt à l'emploi peut être testé ici. Il permet de personnaliser le texte par défaut et il entre dans les boîtes de dialogue Acow, ainsi que la lecture des données à partir d'un script externe.

Vous voudrez peut-être essayer ce plugin jQuery:

https://github.com/antineleclair/ckwatermark

Licencié sous: CC-BY-SA avec attribution
Non affilié à StackOverflow
scroll top