Forum closed. New forum available at http://community.wymeditor.org/

A couple of probably simple issues

Support forum for WYMeditor.

A couple of probably simple issues

Postby matthoughton on Thu Feb 12, 2009 10:34 pm

Hi everyone,
Firstly, great editor I'm currently building it into my CMS.

The issue I have is that I'm not that great at js and am having trouble skinning the editor. I'd like to be able to restrict the "containers" to ones I've allowed the mods to use. It's a strict W3C Compliant CMS so I don't want them re-using the H1 tag for instance.
I love the fact that they have no options to modify the fonts but I'd like to also restrict the containers they can use. Is there an easy way to do this? I removed the relevant lines from the jquery.wymeditor.js
Code: Select all
AT LINE 140:
containersItems: [
        {'name': 'P', 'title': 'Paragraph', 'css': 'wym_containers_p'},
        {'name': 'H3', 'title': 'Heading_3', 'css': 'wym_containers_h3'},...

but this hasn't made a slight difference!!

I'd also like to style the HTML Text Area and change the font in there from Times New Roman. I've sorted this using the skin css file but can't change the size without it overwriting the container styles. Any clues?

Thanks for your help!
matthoughton
 
Posts: 24
Joined: Thu Feb 12, 2009 10:28 pm

Re: A couple of probably simple issues

Postby mr_lundis on Fri Feb 20, 2009 4:31 pm

Hi Mat and welcome to the WYMeditor forum!

If you just want to hide some of the available containers, the easiest way to do so is by css. Each container in the list has a class name in the form of wym_containers_<container_name>, making them easy to hide if needed. If you want to disable the use of a default container altogether you'll need to modify the XhtmlValidator to exclude it, and that's a whole other story.

To change the appearance of the editor area, take a look at the wymiframe.css-file inside /wymeditor/default/iframe.

Cheers ;)
Jonatan Lundin - designer, developer and forum moderator. You should follow me on Twitter!
mr_lundis
 
Posts: 335
Joined: Sun Dec 02, 2007 10:59 am
Location: Sweden

Re: A couple of probably simple issues

Postby matthoughton on Mon Feb 23, 2009 6:20 pm

Thanks very much. The css system works perfectly with a {display: none} element.

Which is the css file which needs to be modified to accurately represent the Preview? I just need to drag the existing front-end css into play but can't work out how.

Thanks again
matthoughton
 
Posts: 24
Joined: Thu Feb 12, 2009 10:28 pm

Re: A couple of probably simple issues

Postby mr_lundis on Mon Feb 23, 2009 7:04 pm

You're welcome! :wink:

At the moment only the skin styles are included (see skins/default/skin.css), and there's no easy way to add your own style sheets.

What you could do is to add all your css rules to the skin.css file and prepend .wym_dialog_preview to all the rules. This isn't ideal, but it will work.

Cheers!
Jonatan Lundin - designer, developer and forum moderator. You should follow me on Twitter!
mr_lundis
 
Posts: 335
Joined: Sun Dec 02, 2007 10:59 am
Location: Sweden

Re: A couple of probably simple issues

Postby der-meister on Sat Apr 03, 2010 12:30 pm

You can overwrite the whole preview functionality:

Code: Select all
jQuery(function() {
    jQuery('.wymeditor').wymeditor({
        postInit: function(wym) {
            // change name of preview button to suppress standard preview and assign a new preview function:
            jQuery(wym._box).find('li.wym_tools_preview a').attr('name','Preview2').click(function(e) {
                // adjust html to include your document type and style sheets
                var html =
'<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">\n' +
'<html xmlns="http://www.w3.org/1999/xhtml">\n' +
'<head>\n' +
'   <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>\n' +
'   <title>vlcek.at: Preview</title>\n' +
'   <link rel="stylesheet" href="/css/master.css" type="text/css" media="all" charset="utf-8" />\n' +
'</head>\n' +
'<' + 'body>\n' +
wym.html() +
'</' + 'body>\n' +
'</html>\n';
                // don't know how to get the dialogFeaturesPreview from WYM, so define it here:
                var features = "menubar=no,titlebar=no,toolbar=no,resizable=no,scrollbars=yes,width=560,height=300,top=0,left=0";
                var wDialog = window.open('', 'dialog', features);   
                var doc = wDialog.document;
                doc.write(html);
                doc.close();
            });
        }
    });
});
der-meister
 
Posts: 1
Joined: Sat Apr 03, 2010 12:20 pm


Return to Support

Who is online

Users browsing this forum: No registered users and 2 guests