Author Topic: HTMLArea stylesheet not working? (Read 22144 times)

Argos · « **on:** March 09, 2005, 03:51:29 PM »

Hi,

I mentioned this already in a previous topic, but it was kind of hidden away so here I go another time. The WYSIWYG editor uses my template stylesheet only when publishing, but not in editor mode itself. So it is not really "what you see is what you get" at the moment. I know HTMLArea can do this properly, because I have seen it in other CMS's. I checked everything I know, but cannot find the cause of this. I have two questions:

1. Is this just the way WSB works? Are the CMS and HTMLArea not 100% connected in this respect? So, do all users have this?
2. If not, does anyone know how to correct this, so that HTMLArea shows and uses the stylesheet in the editor mode, as well in the published results?

This is rather important for me, because I want to offer my clients that wil use WSB true WYSIWYG, instead of a barebone version that "only" does bold, italic and so on.

Thanks for any comments.

Ryan · « **Reply #1 on:** March 10, 2005, 10:10:24 PM »

It is a setting you will have to change in htmlarea, and you will have to create a hack yourself to get it working. If you figure out how to relate the fonts in your sites stylesheet to HTMLArea with some simple (include/require?) code, please share it so I can include it in the next version.

Argos · « **Reply #2 on:** March 11, 2005, 01:29:48 AM »

Damn... I wrote an extensive reply and when I sent it, the database was gone... And so was my message. This forum is offline a lot these days. Not a very stable host so it seems

Anyway, I wrote that I cannot do it myself because I don't know php, or how to code. And I wrote that www.phpwcms.de (open source cms) features a working link between htmlarea and the custom template stylesheet, so it is possible to connect them. I suggested that you or another person with php knowledge might take a look at that csm to see how it was done...

If I get to know the way how it should be done, I will certainly post it here!

Ryan · « **Reply #3 on:** March 11, 2005, 07:04:46 AM »

Maybe, if i remember, then I could look at it for the next release of WB (2.3.2), which I should hopefully release on monday.

Argos · « **Reply #4 on:** March 11, 2005, 01:02:53 PM »

Hey that's cool!! I love updates

Argos · « **Reply #5 on:** March 13, 2005, 10:47:36 PM »

Yes! I found out how to include the stylesheet in HTMLArea so that it really exactly shows in the editor how it will look like on the site. And in fact it is a very simple solution once you know it

1. Open htmlarea.js

2. Search for:

Code: [Select]

// style included in the iframe document
this.pageStyle = "";

3. Change into:

Code: [Select]

// style included in the iframe document
this.pageStyle = '@import url(/cms/include/htmlarea/iframe.css);';

Presto!

I made a separate stylesheet based on the template stylesheet, and put it into the htmlarea folder. I left some things out and compressed it a bit by removing spaces and returns. But I guess you can just as well link to your template stylesheet, using some WSB tag.

Works like a charm! I tried it before but without succes. I suddenly realized it maybe needed the "@import url" bit added, and indeed that did the trick

fienieg · « **Reply #6 on:** March 13, 2005, 11:04:55 PM »

Thanks jurgen...

It really works like charm, even on Firefox

Stefan · « **Reply #7 on:** March 13, 2005, 11:37:37 PM »

Works on IE for me but not on Firefox 1.0.1

Strange...

fienieg · « **Reply #8 on:** March 14, 2005, 12:09:06 AM »

I've got Firefox 1.0.1
And IE6, i never had any problems with IE... only with firefox.

And now it seems if it's broken again. It worked like 10 minutes....

Stefan · « **Reply #9 on:** March 14, 2005, 12:35:19 AM »

I have written a rough draft of a possible interaction of WB with htmlarea. No big deal, just a first step...

It queries the pages table for the template of the page being modified and sets the htmlarea option accordingly.
If the page doesn't have a specific template, the default template is used.

In WB_PATH/modules/wysiwyg/modify.php change lines 66 to 69:

Code: [Select]


	$query_wysiwyg = $database->query("SELECT section_id FROM ".TABLE_PREFIX."sections WHERE page_id = '$page_id' AND module = 'wysiwyg'");
	if($query_wysiwyg->numRows() > 0) {
		while($wysiwyg_section = $query_wysiwyg->fetchRow()) {
		echo 'var editor = new HTMLArea("content'.$wysiwyg_section["section_id"].'");'

to the following

Code: [Select]

$query_pages=$database->query("SELECT template FROM ".TABLE_PREFIX."pages WHERE page_id = '$page_id'");
$page_row=$query_pages->fetchRow();
$templatename=$page_row['template'];
if ($templatename=='')
	$templatename=DEFAULT_TEMPLATE;
echo 'var config = new HTMLArea.Config();
config.pageStyle = "@import url('.WB_PATH.'/templates/'.$templatename.'/screen.css);";';

	$query_wysiwyg = $database->query("SELECT section_id FROM ".TABLE_PREFIX."sections WHERE page_id = '$page_id' AND module = 'wysiwyg'");
	if($query_wysiwyg->numRows() > 0) {
		while($wysiwyg_section = $query_wysiwyg->fetchRow()) {
		echo 'var editor = new HTMLArea("content'.$wysiwyg_section["section_id"].'",config);'

Have fun!
Too bad Firefox is having an issue here...

Argos · « **Reply #10 on:** March 14, 2005, 12:40:32 AM »

Ain't it nice to know how to code

Cool, I'll give it a try it tomorrow.

Ryan · « **Reply #11 on:** March 14, 2005, 04:17:51 AM »

Maybe someone could find a solution for firefox?

Ryan · « **Reply #12 on:** April 02, 2005, 07:44:40 AM »

Just thought I would let you guys know this problem will be solved as of 2.4.0-test4 - I have added a option where you specify the font to be used by default by HTMLArea.

littlefishweb · « **Reply #13 on:** July 11, 2005, 04:36:10 PM »

Is there a place to specify h1, h2, h3 styles, etc?

Argos · « **Reply #14 on:** July 12, 2005, 09:08:17 PM »

Both my and Stefan's solutions don't seem to work anymore in WSB 2.5.2... Is there a change somewhere in the way the WYSIWYG module is set up now?

littlefishweb · « **Reply #15 on:** July 12, 2005, 09:37:24 PM »

Actually, I got it to work. You have to specify the stylesheet in the include/htmlarea/htmlarea.js file AND in the modules/wysiwyg/modify.php file.

Argos · « **Reply #16 on:** August 02, 2005, 08:05:14 PM »

Quote from: littlefishweb on July 12, 2005, 09:37:24 PM

Actually, I got it to work. Â You have to specify the stylesheet in the include/htmlarea/htmlarea.js file AND in the modules/wysiwyg/modify.php file.

What should I exactly do in the modify.php file?

Ryan · « **Reply #17 on:** August 03, 2005, 12:16:29 AM »

Maybe try this:
WebsiteBaker Administration -> Settings -> Advanced Settings -> WYSIWYG Style: (change to what you want)

Argos · « **Reply #18 on:** August 03, 2005, 12:21:10 AM »

How can I put a whole stylesheet in there?

Or at least something about the H1 tag?

Ryan · « **Reply #19 on:** August 15, 2005, 02:11:54 PM »

Maybe try using "@import url('cssfilehere.css');" as the value for Administration -> Settings -> Advanced Settings -> WYSIWYG Style

Argos · « **Reply #20 on:** August 15, 2005, 03:03:21 PM »

Nope, that didn't work. However, I tried several other thinsg again, and now I found a working way. For the editor I only needed to have a style for H1, apart from the standard text. So now I have this, and it works:

Code: [Select]

{font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 12px;} h1{font-size: 14px;color: #C6423C;font-weight: bold;padding: 0;}

ephraimt · « **Reply #21 on:** February 15, 2006, 01:36:56 PM »

Stefan, could you post an update to your code (from March 13, 2005) for using the current page's template's screen.css as the .css for the wysiwyg editor?

The patch doesn't work for 2.6.1.

Thank you!

crespowu · « **Reply #22 on:** January 04, 2008, 02:14:45 AM »

Is this bug fixed now?

ruebenwurzel · « **Reply #23 on:** January 04, 2008, 04:56:03 AM »

Hello,

the developement of HTMLArea is closed and also the developement of features and bugfixes. Sorry. Try to use FCKEditor from our addons Page as WYSIWYG Editor.

Matthias

News

Support WebsiteBaker

Your donations will help to:

You can donate by clicking on the button below.

Author Topic: HTMLArea stylesheet not working? (Read 22144 times)

Argos

Argos

Argos

Argos

fienieg

Stefan

fienieg

Stefan

Argos

Argos

Argos

Argos

Argos

ephraimt

crespowu