CKEditor: Classe ou ID pour le corps de l'éditeur

J'ai une instance de CKEditor sur une page. J'essaie de donner le CKEditor corps d'une classe ou un ID afin qu'il corresponde à certains styles je l'ai défini dans une feuille de style.

Il y a un La documentation de l'API qui devrait donner l'accès aux éléments du DOM, mais je n'arrive pas à le faire fonctionner. Tous les objets que j'ai essayer de requête de cette façon, tourner indéfini.

Quelqu'un sait comment faire, ou comment traiter correctement CKEditor est des éléments du dom?

Modifier: Merci les gens, nemisj de la réponse qu'il a fait pour moi, mais pour une raison quelconque, je n'ai pas à définir le "accepté" coche dans cette question.

source d'informationauteur Pekka 웃 | 2009-12-04

  1. 13

    Bien que la partie de l'API n'était pas porté à partir de 2.x à l'époque que cette question a été placé, il est maintenant plus facile à utiliser la bodyId et bodyClass options de configuration.

    Bien sûr, l'explication par nemisj est bon et peut être utile pour d'autres choses, mais vous devez vous rappeler que chaque fois que vous passez loin de la conception (à la vue de la source), l'iframe est détruit, de sorte que vous aurez besoin de réaffecter vos attributs si vous le faites manuellement.

  2. 11

    Si vous parlez à propos de CKEditor( version 3), puis il ya une possibilité d'obtenir tout DOM instance à l'intérieur de l'éditeur lui-même. Chaque CKEditor l'instance de la référence du document par l'intermédiaire de "document" de la propriété. 

    var documentWrapper = edit.document;

    Cette référence représentent du public wrapper pour tous CKEditor nœuds, mais il a aussi la référence directe à son nœud. Vous pouvez les récupérer en arriver ["$"] propriété. 

    var documentNode = documentWrapper.$; //or documentWrapper['$'] ;

    documentNode représentera le DOM instance du nœud de document à l'intérieur de l'iframe. Après vous avez les DOM exemple, vous pouvez faire ce que vous voulez faire avec DOM structure, Ajouter, supprimer, remplacer les classes, de la reconstruction, etc. Par exemple

    documentNode.body.className = "zork";

    J'espère que ce devrait être suffisant.

  3. 3

    J'ai eu le même problème aujourd'hui en essayant de définir la bodyClass comme ceci:

    CKEDITOR.replace( 'rédacteur1',
    {
    fullPage : true,
    bodyClass : "myClass"

    });

    Ce que j'ai trouvé, c'est que dans cette version (3.3.1), si vous définissez fullpage = true, la définition de la bodyId ou bodyClass ne fonctionne pas, mais si vous définissez fullPage = false, il ne fonctionne pas.

    Espère que cette aide.

  4. 2

    De la Manuel:

    <static> {String|Array} CKEDITOR.config.contentsCss

    Le fichier CSS(s) à être utilisé pour appliquer un style au contenu. Elle doit tenir compte de la CSS utilisée dans les dernières pages où le contenu doit être utilisé.

    config.contentsCss = '/css/mysitestyles.css';
config.contentsCss = ['/css/mysitestyles.css', '/css/anotherfile.css'];

    Valeur Par Défaut:

    <CKEditor folder>/contents.css

  5. 0

    Ne sais pas qui de l'éditeur, mais ils fonctionnent tous de la même façon, vous ne pouvez probablement pas accès aux éléments DOM créé par l'instance parce qu'ils sont créés après que la page a fini de charger, et le DOM est prêt. Ainsi, tous les nouveaux éléments du DOM ajoutés par la suite, sur le papier n'existent pas.

    Encore, vous pouvez essayer de L'éditeur TinyMCEqui a un "partenariat" avec la bibliothèque javascript jQuery pour manipuler tout ce que vous voulez, et l'éditeur lui-même est assez facile de changer dans presque tous les sens.

  6. 0

    Vos requêtes peuvent renvoyer undefined parce que les instances de l'éditeur sont placés à l'intérieur d'une iFrame et que votre requête n'est pas à la recherche là-bas?

  7. 0

    Dans config.js, écrire ce code

    config.bodyId = 'contents_id';

    alors vous voyez le corps de l'id dans Ckeditor, mais lorsque vous souhaitez accéder à cet identifiant, veuillez utiliser 

    $('#parent_id').find('iframe').contents().find('#within_iframe')

    il $('#parent_id') signifie form_id ou un parent qui est simplement le moyen d'accès de l'iframe. suivez ce code pour accéder à l'élément dans un iframe