Ergebnis 1 bis 6 von 6

Thema: [CKEditor] Einbindung von Smilies

  1. #1
    König(in) Avatar von crAzywuLf
    Registriert seit
    03.02.2009
    Beiträge
    1.175
    Danke
    1
    Bekam 0 mal "Danke" in 0 Postings

    Standard [CKEditor] Einbindung von Smilies

    Hi,
    ich benutze den aktuellen CKEditor und raffe einfach nicht wie man dort seine eigenen Smilies einbinden kann?!
    in der Initialisierungsconfig vom CKEditor gibt es ja standardmäßig folgendes:
    Code:
                        smiley_images :
                        [
                            'regular_smile.gif','sad_smile.gif','wink_smile.gif','teeth_smile.gif','tounge_smile.gif',
                            'embaressed_smile.gif','omg_smile.gif','whatchutalkingabout_smile.gif','angel_smile.gif','shades_smile.gif',
                            'cry_smile.gif','kiss.gif'
                        ],
                        smiley_descriptions :
                        [
                            'smiley', 'sad', 'wink', 'laugh', 'cheeky', 'blush', 'surprise',
                            'indecision', 'angel', 'cool', 'crying', 'kiss'
                        ]
    Das klappt auch alles soweit, aber wenn ich dort meine eigenen Smilies benutzen möchte:
    Code:
                        smiley_path: '/cc2011/images/smilies/',
                        smiley_images :
                        [
                            'Yawn.gif',
                            'Wink.gif',
                            'Whatever.gif',
                            'Undecided.gif',
                            'Surprise.gif',
                            'StickOutTongue.gif',
                            'Sick.gif',
                            'Sad.gif',
                            'Rose.gif',
                            'MoneyMouth.gif',
                            'LipsSealed.gif',
                            'Laugh.gif',
                            'Kiss.gif',
                            'Hug.gif',
                            'Happy.gif',
                            'Halo.gif',
                            'FootinMouth.gif',
                            'Foolish.gif',
                            'EvilGrin.gif',
                            'Embarrassed.gif',
                            'Cry.gif',
                            'Cool.gif',
                            'Applause.gif',
                            'Angry.gif',
                        ],
                        smiley_descriptions :
                        [
                            ' :Yawn: ',
                            ' :Wink: ',
                            ' :Whatever: ',
                            ' :Undecided: ',
                            ' :Surprise: ',
                            ' :StickOutTongue: ',
                            ' :Sick: ',
                            ' :Sad: ',
                            ' :Rose: ',
                            ' :MoneyMouth: ',
                            ' :LipsSealed: ',
                            ' :Laugh: ',
                            ' :Kiss: ',
                            ' :Hug: ',
                            ' :Happy: ',
                            ' :Halo: ',
                            ' :FootinMouth: ',
                            ' :Foolish: ',
                            ' :EvilGrin: ',
                            ' :Embarrassed: ',
                            ' :Cry: ',
                            ' :Cool: ',
                            ' :Applause: ',
                            ' :Angry: ',
                        ]
    zeigt er sie an und ich kann Sie auch einbinden, jedoch kann ich mir den Quellcode nicht mehr per Button anzeigen lassen lassen und bei der die Übergabe per Post ist der Text leer.
    Firebug meldet mir:
    text is undefined
    return text.replace( baseEntitiesRegex, getChar )
    Eigentlich muss irgendwas fehlen, weil wenn ich einen Standard Smiley einfüge, dann wird er nicht mit der Smiley Description in den Quellcode geschrieben sondern mit z.B.
    Code:
    ;-)
    und das kann ich auch noch nicht so ganz nachvollziehen, woher das kommt xD

    Ich hab mir den Editor heute zum ersten mal angesehen und hab deshalb wirklich noch überhaupt keinen Plan. Die Doku (http://docs.cksource.com/ckeditor_ap...OR.config.html) half mir leider nicht weiter. Irgendwie scheint die Smiley Description auch nur der Anzeigetext im Menü zu sein. Es wäre super, wenn mir jemand auf die Sprünge helfen könnte...
    Achtung: Dies ist ein alter Thread im HTML und Webmaster Forum
    Diese Diskussion ist älter als 90 Tage. Die darin enthaltenen Informationen sind möglicherweise nicht mehr aktuell. Erstelle bitte zu deiner Frage ein neues Thema im Forum !!!!!
    Gruß crAzywuLf

  2. #2
    Unregistriert
    Gast

    Standard AW: [CKEditor] Einbindung von Smilies

    Du hast hinter dem letzten Eintrag ein Komma, nimm das mal weg

  3. #3
    König(in)
    Themenstarter
    Avatar von crAzywuLf
    Registriert seit
    03.02.2009
    Beiträge
    1.175
    Danke
    1
    Bekam 0 mal "Danke" in 0 Postings

    Standard AW: [CKEditor] Einbindung von Smilies

    Zitat Zitat von Unregistriert Beitrag anzeigen
    Du hast hinter dem letzten Eintrag ein Komma, nimm das mal weg
    bringt leider nichts...
    Der Fehler ist irgendwie in dem Plugin "entities":
    Code:
    /*
    Copyright (c) 2003-2011, CKSource - Frederico Knabben. All rights reserved.
    For licensing, see LICENSE.html or http://ckeditor.com/license
    */
    
    (function()
    {
        // Base HTML entities.
        var htmlbase = 'nbsp,gt,lt,amp';
    
        var entities =
            // Latin-1 Entities
            'quot,iexcl,cent,pound,curren,yen,brvbar,sect,uml,copy,ordf,laquo,' +
            'not,shy,reg,macr,deg,plusmn,sup2,sup3,acute,micro,para,middot,' +
            'cedil,sup1,ordm,raquo,frac14,frac12,frac34,iquest,times,divide,' +
    
            // Symbols
            'fnof,bull,hellip,prime,Prime,oline,frasl,weierp,image,real,trade,' +
            'alefsym,larr,uarr,rarr,darr,harr,crarr,lArr,uArr,rArr,dArr,hArr,' +
            'forall,part,exist,empty,nabla,isin,notin,ni,prod,sum,minus,lowast,' +
            'radic,prop,infin,ang,and,or,cap,cup,int,there4,sim,cong,asymp,ne,' +
            'equiv,le,ge,sub,sup,nsub,sube,supe,oplus,otimes,perp,sdot,lceil,' +
            'rceil,lfloor,rfloor,lang,rang,loz,spades,clubs,hearts,diams,' +
    
            // Other Special Characters
            'circ,tilde,ensp,emsp,thinsp,zwnj,zwj,lrm,rlm,ndash,mdash,lsquo,' +
            'rsquo,sbquo,ldquo,rdquo,bdquo,dagger,Dagger,permil,lsaquo,rsaquo,' +
            'euro';
    
        // Latin Letters Entities
        var latin =
            'Agrave,Aacute,Acirc,Atilde,Auml,Aring,AElig,Ccedil,Egrave,Eacute,' +
            'Ecirc,Euml,Igrave,Iacute,Icirc,Iuml,ETH,Ntilde,Ograve,Oacute,Ocirc,' +
            'Otilde,Ouml,Oslash,Ugrave,Uacute,Ucirc,Uuml,Yacute,THORN,szlig,' +
            'agrave,aacute,acirc,atilde,auml,aring,aelig,ccedil,egrave,eacute,' +
            'ecirc,euml,igrave,iacute,icirc,iuml,eth,ntilde,ograve,oacute,ocirc,' +
            'otilde,ouml,oslash,ugrave,uacute,ucirc,uuml,yacute,thorn,yuml,' +
            'OElig,oelig,Scaron,scaron,Yuml';
    
        // Greek Letters Entities.
        var greek =
            'Alpha,Beta,Gamma,Delta,Epsilon,Zeta,Eta,Theta,Iota,Kappa,Lambda,Mu,' +
            'Nu,Xi,Omicron,Pi,Rho,Sigma,Tau,Upsilon,Phi,Chi,Psi,Omega,alpha,' +
            'beta,gamma,delta,epsilon,zeta,eta,theta,iota,kappa,lambda,mu,nu,xi,' +
            'omicron,pi,rho,sigmaf,sigma,tau,upsilon,phi,chi,psi,omega,thetasym,' +
            'upsih,piv';
    
        /**
         * Create a mapping table between one character and its entity form from a list of entity names.
         * @param reverse {Boolean} Whether to create a reverse map from the entity string form to an actual character.
         */
        function buildTable( entities, reverse )
        {
            var table = {},
                regex = [];
    
            // Entities that the browsers DOM don't transform to the final char
            // automatically.
            var specialTable =
                {
                    nbsp    : '\u00A0',        // IE | FF
                    shy        : '\u00AD',        // IE
                    gt        : '\u003E',        // IE | FF |   --   | Opera
                    lt        : '\u003C',        // IE | FF | Safari | Opera
                    amp : '\u0026'        // ALL
                };
    
            entities = entities.replace( /\b(nbsp|shy|gt|lt|amp)(?:,|$)/g, function( match, entity )
                {
                    var org = reverse ? '&' + entity + ';' : specialTable[ entity ],
                        result = reverse ? specialTable[ entity ] : '&' + entity + ';';
    
                    table[ org ] = result;
                    regex.push( org );
                    return '';
                });
    
            if ( !reverse && entities )
            {
                // Transforms the entities string into an array.
                entities = entities.split( ',' );
    
                // Put all entities inside a DOM element, transforming them to their
                // final chars.
                var div = document.createElement( 'div' ),
                    chars;
                div.innerHTML = '&' + entities.join( ';&' ) + ';';
                chars = div.innerHTML;
                div = null;
    
                // Add all chars to the table.
                for ( var i = 0 ; i < chars.length ; i++ )
                {
                    var charAt = chars.charAt( i );
                    table[ charAt ] = '&' + entities[ i ] + ';';
                    regex.push( charAt );
                }
            }
    
            table.regex = regex.join( reverse ? '|' : '' );
    
            return table;
        }
    
        CKEDITOR.plugins.add( 'entities',
        {
            afterInit : function( editor )
            {
                var config = editor.config;
    
                var dataProcessor = editor.dataProcessor,
                    htmlFilter = dataProcessor && dataProcessor.htmlFilter;
    
                if ( htmlFilter )
                {
                    // Mandatory HTML base entities.
                    var selectedEntities = '';
    
                    if ( config.basicEntities !== false )
                        selectedEntities += htmlbase;
    
                    if ( config.entities )
                    {
                        selectedEntities += ',' + entities;
                        if ( config.entities_latin )
                            selectedEntities += ',' + latin;
    
                        if ( config.entities_greek )
                            selectedEntities += ',' + greek;
    
                        if ( config.entities_additional )
                            selectedEntities += ',' + config.entities_additional;
                    }
    
                    var entitiesTable = buildTable( selectedEntities );
    
                    // Create the Regex used to find entities in the text, leave it matches nothing if entities are empty.
                    var entitiesRegex = entitiesTable.regex ? '[' + entitiesTable.regex + ']' : 'a^';
                    delete entitiesTable.regex;
    
                    if ( config.entities && config.entities_processNumerical )
                        entitiesRegex = '[^ -~]|' + entitiesRegex ;
    
                    entitiesRegex = new RegExp( entitiesRegex, 'g' );
    
                    function getEntity( character )
                    {
                        return config.entities_processNumerical == 'force' || !entitiesTable[ character ] ?
                               '&#' + character.charCodeAt(0) + ';'
                                : entitiesTable[ character ];
                    }
    
                    // Decode entities that the browsers has transformed
                    // at first place.
                    var baseEntitiesTable = buildTable( [ htmlbase, 'shy' ].join( ',' ) , true ),
                        baseEntitiesRegex = new RegExp( baseEntitiesTable.regex, 'g' );
    
                    function getChar( character )
                    {
                        return baseEntitiesTable[ character ];
                    }
    
                    htmlFilter.addRules(
                        {
                            text : function( text )
                            {
                                return text.replace( baseEntitiesRegex, getChar )
                                        .replace( entitiesRegex, getEntity );
                            }
                        });
                }
            }
        });
    })();
    
    /**
     * Whether to escape basic HTML entities in the document, including:
     * <ul>
     * <li><code>nbsp</code></li>
     * <li><code>gt</code></li>
     * <li><code>lt</code></li>
     * <li><code>amp</code></li>
     * </ul>
     * <strong>Note:</strong> It should not be subject to change unless when outputting a non-HTML data format like BBCode.
     * @type Boolean
     * @default <code>true</code>
     * @example
     * config.basicEntities = false;
     */
    CKEDITOR.config.basicEntities = true;
    
    /**
     * Whether to use HTML entities in the output.
     * @name CKEDITOR.config.entities
     * @type Boolean
     * @default <code>true</code>
     * @example
     * config.entities = false;
     */
    CKEDITOR.config.entities = true;
    
    /**
     * Whether to convert some Latin characters (Latin alphabet No. 1, ISO 8859-1)
     * to HTML entities. The list of entities can be found in the
     * <a href="http://www.w3.org/TR/html4/sgml/entities.html#h-24.2.1">W3C HTML 4.01 Specification, section 24.2.1</a>.
     * @name CKEDITOR.config.entities_latin
     * @type Boolean
     * @default <code>true</code>
     * @example
     * config.entities_latin = false;
     */
    CKEDITOR.config.entities_latin = true;
    
    /**
     * Whether to convert some symbols, mathematical symbols, and Greek letters to
     * HTML entities. This may be more relevant for users typing text written in Greek.
     * The list of entities can be found in the
     * <a href="http://www.w3.org/TR/html4/sgml/entities.html#h-24.3.1">W3C HTML 4.01 Specification, section 24.3.1</a>.
     * @name CKEDITOR.config.entities_greek
     * @type Boolean
     * @default <code>true</code>
     * @example
     * config.entities_greek = false;
     */
    CKEDITOR.config.entities_greek = true;
    
    /**
     * Whether to convert all remaining characters not included in the ASCII
     * character table to their relative decimal numeric representation of HTML entity.
     * When set to <code>force</code>, it will convert all entities into this format.
     * For example the phrase "This is Chinese: 汉语." is output
     * as "This is Chinese: &amp;#27721;&amp;#35821;."
     * @name CKEDITOR.config.entities_processNumerical
     * @type Boolean|String
     * @default <code>false</code>
     * @example
     * config.entities_processNumerical = true;
     * config.entities_processNumerical = 'force';        //Converts from "&nbsp;" into "*";
     */
    
    /**
     * A comma separated list of  additional entities to be used. Entity names
     * or numbers must be used in a form that excludes the "&amp;" prefix and the ";" ending.
     * @name CKEDITOR.config.entities_additional
     * @default <code>'#39'</code>  (The single quote (') character.)
     * @type String
     * @example
     * config.entities_additional = '#1049';        // Adds Cyrillic capital letter Short I (Й).
     */
    CKEDITOR.config.entities_additional = '#39';
    an dieser Stelle:
    Code:
                    htmlFilter.addRules(                     { 
                            text : function( text ) 
                            { 
                                return text.replace( baseEntitiesRegex, getChar ) 
                                        .replace( entitiesRegex, getEntity ); 
                            } 
                        });
    komisch... Ich glaube ich nehme einfach einen anderen WYSIWUG Editor.
    Gruß crAzywuLf

  4. #4
    Unregistriert
    Gast

    Standard AW: [CKEditor] Einbindung von Smilies

    In welcher Datei hast du dein Smiley's eingebaut?

  5. #5
    König(in)
    Themenstarter
    Avatar von crAzywuLf
    Registriert seit
    03.02.2009
    Beiträge
    1.175
    Danke
    1
    Bekam 0 mal "Danke" in 0 Postings

    Standard AW: [CKEditor] Einbindung von Smilies

    Direkt unter der Textarea:
    HTML-Code:
                <textarea cols="80" id="editor1" name="text" rows="10"></textarea>
                <script type="text/javascript">
                //<=!=[=C=D=A=T=A=[
    
                // Replace the <textarea id="editor"> with an CKEditor
                // instance, using the "bbcode" plugin, shaping some of the
                // editor configuration to fit BBCode environment.
                CKEDITOR.replace( 'editor1',
                    {
                        extraPlugins : 'bbcode,smiley',
                        // Remove unused plugins.
                        removePlugins : 'entities,bidi,button,dialogadvtab,div,filebrowser,flash,format,forms,horizontalrule,iframe,indent,justify,liststyle,pagebreak,showborders,stylescombo,table,tabletools,templates',
                        // Width and height are not supported in the BBCode format, so object resizing is disabled.
                        disableObjectResizing : true,
                        // Define font sizes in percent values.
                        fontSize_sizes : "30/30%;50/50%;100/100%;120/120%;150/150%;200/200%;300/300%",
                        toolbar :
                        [
                            ['Source', '-','Undo','Redo'],
                            ['Find','Replace','-','SelectAll','RemoveFormat'],
                            ['Link', 'Unlink', 'Image', 'Smiley','SpecialChar'],
    //                        '/',
                            ['Bold', 'Italic','Underline'],
                            ['FontSize'],
                            ['TextColor'],
                            ['NumberedList','BulletedList','-','Blockquote'],
                        ],
                        // Strip CKEditor smileys to those commonly used in BBCode.
                        // smiley_images :
                        // [
                            // 'regular_smile.gif','sad_smile.gif','wink_smile.gif','teeth_smile.gif','tounge_smile.gif',
                            // 'embaressed_smile.gif','omg_smile.gif','whatchutalkingabout_smile.gif','angel_smile.gif','shades_smile.gif',
                            // 'cry_smile.gif','kiss.gif'
                        // ],
                        // smiley_descriptions :
                        // [
                            // 'smiley', 'sad', 'wink', 'laugh', 'cheeky', 'blush', 'surprise',
                            // 'indecision', 'angel', 'cool', 'crying', 'kiss'
                        // ]
                        smiley_images :
                        [
                            'Yawn.gif',
                            'Wink.gif',
                            'Whatever.gif',
                            'Undecided.gif',
                            'Surprise.gif',
                            'StickOutTongue.gif',
                            'Sick.gif',
                            'Sad.gif',
                            'Rose.gif',
                            'MoneyMouth.gif',
                            'LipsSealed.gif',
                            'Laugh.gif',
                            'Kiss.gif',
                            'Hug.gif',
                            'Happy.gif',
                            'Halo.gif',
                            'FootinMouth.gif',
                            'Foolish.gif',
                            'EvilGrin.gif',
                            'Embarrassed.gif',
                            'Cry.gif',
                            'Cool.gif',
                            'Applause.gif',
                            'Angry.gif'
                        ],
                        smiley_descriptions :
                        [
                            ' :Yawn: ',
                            ' :Wink: ',
                            ' :Whatever: ',
                            ' :Undecided: ',
                            ' :Surprise: ',
                            ' :StickOutTongue: ',
                            ' :Sick: ',
                            ' :Sad: ',
                            ' :Rose: ',
                            ' :MoneyMouth: ',
                            ' :LipsSealed: ',
                            ' :Laugh: ',
                            ' :Kiss: ',
                            ' :Hug: ',
                            ' :Happy: ',
                            ' :Halo: ',
                            ' :FootinMouth: ',
                            ' :Foolish: ',
                            ' :EvilGrin: ',
                            ' :Embarrassed: ',
                            ' :Cry: ',
                            ' :Cool: ',
                            ' :Applause: ',
                            ' :Angry: '
                        ]
                } );
    
                //]=]=>
                </script>
    Geändert von crAzywuLf (10.11.2011 um 13:49 Uhr)
    Gruß crAzywuLf

  6. #6
    König(in)
    Themenstarter
    Avatar von crAzywuLf
    Registriert seit
    03.02.2009
    Beiträge
    1.175
    Danke
    1
    Bekam 0 mal "Danke" in 0 Postings

    Standard AW: [CKEditor] Einbindung von Smilies

    Ich hab es gelöst... Was für ein bullshit... Zu erst muss man während des CKEditor Aufrufs z.B. die Smilies über:
    Code:
                        smiley_path: '/cc2011/images/smilies/',
                        smiley_images :
                        [
                            'Yawn.gif',
                            'Wink.gif',
                            'Whatever.gif',
                            'Undecided.gif',
                            'Surprise.gif',
                            'StickOutTongue.gif',
                            'Sick.gif',
                            'Sad.gif',
                            'Rose.gif',
                            'MoneyMouth.gif',
                            'LipsSealed.gif',
                            'Laugh.gif',
                            'Kiss.gif',
                            'Hug.gif',
                            'Happy.gif',
                            'Halo.gif',
                            'FootinMouth.gif',
                            'Foolish.gif',
                            'EvilGrin.gif',
                            'Embarrassed.gif',
                            'Cry.gif',
                            'Cool.gif',
                            'Applause.gif',
                            'Angry.gif'
                        ],
                        smiley_descriptions :
                        [
                            'Yawn',
                            'Wink',
                            'Whatever',
                            'Undecided',
                            'Surprise',
                            'StickOutTongue',
                            'Sick',
                            'Sad',
                            'Rose',
                            'MoneyMouth',
                            'LipsSealed',
                            'Laugh',
                            'Kiss',
                            'Hug',
                            'Happy',
                            'Halo',
                            'FootinMouth',
                            'Foolish',
                            'EvilGrin',
                            'Embarrassed',
                            'Cry',
                            'Cool',
                            'Applause',
                            'Angry'
                        ],
    einbinden...
    Was aber jetzt noch fehlt ist die Anpassung im bbcode plugin. (Wichtig hierbei, dass man am Besten die ckeditor_source.js nimmt, dann nimmt er den _source Ordner, in dem das Javascript nicht total zusammengequetscht und unlesbar ist)
    Also quasi unter _source/plugins/bbcode/plugin.js gibt es dann noch eine Variable namens smileyMap:
    Code:
            var smileyMap = {
                                'Yawn' : ' :Yawn: ',
                                'Wink' : ' :Wink: ',
                                'Whatever' : ' :Whatever: ',
                                'Undecided' : ' :Undecided: ',
                                'Surprise' : ' :Surprise: ',
                                'StickOutTongue' : ' :StickOutTongue: ',
                                'Sick' : ' :Sick: ',
                                'Sad' : ' :Sad: ',
                                'Rose' : ' :Rose: ',
                                'MoneyMouth' : ' :MoneyMouth: ',
                                'LipsSealed' : ' :LipsSealed: ',
                                'Laugh' : ' :Laugh: ',
                                'Kiss' : ' :Kiss: ',
                                'Hug' : ' :Hug: ',
                                'Happy' : ' :Happy: ',
                                'Halo' : ' :Halo: ',
                                'FootinMouth' : ' :FootinMouth: ',
                                'Foolish' : ' :Foolish: ',
                                'EvilGrin' : ' :EvilGrin: ',
                                'Embarrassed' : ' :Embarrassed: ',
                                'Cry' : ' :Cry: ',
                                'Cool' : ' :Cool: ',
                                'Applause' : ' :Applause: ',
                                'Angry' : ' :Angry: '
            },
    und das ist ein Mapping von smiley_description auf den Code der nachher im Quellcode Fenster oder im übergebenen Text angezeigt werden soll...
    Geändert von crAzywuLf (10.11.2011 um 14:24 Uhr)
    Gruß crAzywuLf

Ähnliche Themen

  1. ckeditor installieren (Plone 3.3.5)
    Von zaungast im Forum Zope & Plone - das deutsche Hilfeforum
    Antworten: 2
    Letzter Beitrag: 02.10.2010, 22:44
  2. RSS Einbindung
    Von klsa12 im Forum HTML & CSS Forum
    Antworten: 0
    Letzter Beitrag: 24.11.2007, 18:14
  3. Einbindung von Bildern
    Von Defekto im Forum Forum für Grafiken und Bildbearbeitung
    Antworten: 22
    Letzter Beitrag: 02.06.2005, 14:31
  4. Problem mit Einbindung
    Von im Forum PHP Forum - Apache - CGI - Perl - JavaScript und Co.
    Antworten: 7
    Letzter Beitrag: 22.03.2005, 17:51
  5. RSS Einbindung
    Von Noobie im Forum HTML & CSS Forum
    Antworten: 1
    Letzter Beitrag: 29.11.2004, 16:16

Stichworte

Berechtigungen

  • Neue Themen erstellen: Nein
  • Themen beantworten: Nein
  • Anhänge hochladen: Nein
  • Beiträge bearbeiten: Nein
  •