1. This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn More.
  2. This forum has been archived. New threads and replies may not be made. All add-ons/resources that are active should be migrated to the Resource Manager. See this thread for more information.

[EditorSkin]Blue ToolBar

Discussion in 'Styles [Archive]' started by DroidHost, Jan 31, 2011.

  1. DroidHost

    DroidHost Well-Known Member

    Hello ,

    This is the Final Result after Doing what in this Topic :
    EditroSkin.png

    First Search for [ editor_js_setup ] in the template
    then search for [ tinyMCE.init ] you will see somthing like this :
    Code:
                tinyMCE.init(
                {
                    mode: 'exact',
                    elements: $editor.attr('id'),
                    plugins: plugins,
                    cleanup: false,
                    theme: 'xenforo',
                    theme_xenforo_dialog_url: "{xen:jsescape 'index.php?editor/dialog'}", // TODO: can't use xen:link until editor_dialog* template respect base
                    theme_xenforo_contents_css_url: "css.php?style={xen:urlencode $visitorStyle.style_id}&css=editor_contents&d={xen:urlencode $visitorStyle.last_modified_date}",
                                    theme_xenforo_toolbar_align : "right",
                    language: '',
                    document_base_url: "{xen:jsescape $requestPaths.fullBasePath}",
    
                    xenforo_smilies_menu_image: '@imagePath/xenforo/editor/smilie.png',
                    xenforo_smilies: {xen:helper json, $smilies},
    
                    xenforo_bbcode_switch_text: ["{xen:jsescape {xen:phrase use_bb_code_editor}}", "{xen:jsescape {xen:phrase use_rich_text_editor}}"]
                });
    Under [theme: 'xenforo', ] put [ skin : "o2k7", ]

    now go to editor_ui.css
    go to the bottom of the file... past this css : copy it from the attached file [BlueSkin.text]


    Finally unzip the attached file you will see Editor Folder just put it in this Dir


    This is the Final Result :
    EditroSkin.png


    this Skin come with TinyMce as default
    My layout is RTL so don't worry about this ....
    :) I hope it will help someone
     

    Attached Files:

    SeVeN, JVCode, karev and 2 others like this.
  2. karev

    karev Active Member

    thanks beautiful template edit but if its possible to tell me how can i add buttons to the editor this will be kindful :)
     
  3. RickM

    RickM Well-Known Member

    Interesting! I never even thought of switching out the TinyMCE skin! I wonder if there's a site/page with some free MCE skins we can download other than the 3 it ships with :)
     
  4. DroidHost

    DroidHost Well-Known Member

    sorry I don't know how but maybe with time
    this seems intersting
    http://www.cirkuit.net/projects/tinymce/cirkuitSkin/example2.html

    I will do this skin in Wednesday I have lab Exam that day I need to study !!!
     
  5. yavuz

    yavuz Well-Known Member

    caps.png

    And this is how it looks :) Love the look but can it be placed in one row insted of two ?
     
  6. JVCode

    JVCode Well-Known Member

    Very nice.
     
  7. JVCode

    JVCode Well-Known Member

Share This Page