osCommerce Community Support Forums > Replace TEXTAREA with Rich Content Editor

orviwan

Sep 20 2005, 10:36 PM

QUOTE

TinyMCE is a platform independent web based Javascript HTML WYSIWYG editor control released as Open Source under LGPL by Moxiecode Systems AB. It has the ability to convert HTML TEXTAREA fields or other HTML elements to editor instances. TinyMCE is very easy to integrate into other CMS systems.

http://tinymce.moxiecode.com/

I found this very easy to integrate into osCommerce 2.2-MS2.

Here's how:

1. Download TinyMCE (see above).

2. Extract the TinyMCE .zip file to a temporary location.

3. Copy the contents of the \tinymce\jscripts\tiny_mce\ folder from the temporary location to /admin/includes/javascript/tiny_mce/ on the web server.

4. Edit /admin/includes/header.php and insert the following lines before the <table> tag.

CODE

That's it, now every <TEXTAREA> within the Administration site will be automatically replaced with a powerful inline html editor.

You will see the editor when adding or editing a product, maybe in other places too.

See the TinyMCE readme or website for ways you can tweak the editor, the default settings don't do it justice.

shaytaan

Sep 21 2005, 04:44 AM

QUOTE (orviwan @ Sep 20 2005, 10:36 PM)

http://tinymce.moxiecode.com/

I found this very easy to integrate into osCommerce 2.2-MS2.

Here's how:

1. Download TinyMCE (see above).

2. Extract the TinyMCE .zip file to a temporary location.

3. Copy the contents of the \tinymce\jscripts\tiny_mce\ folder from the temporary location to /admin/includes/javascript/tiny_mce/ on the web server.

4. Edit /admin/includes/header.php and insert the following lines before the <table> tag.

CODE

That's it, now every <TEXTAREA> within the Administration site will be automatically replaced with a powerful inline html editor.

You will see the editor when adding or editing a product, maybe in other places too.

See the TinyMCE readme or website for ways you can tweak the editor, the default settings don't do it justice.

Too good to be true

Thanks alot

TF Solutions

Sep 21 2005, 06:12 AM

WOW!

It worked without a single issue... fantastic!

peterpil19

Sep 21 2005, 03:41 PM

UNBELIEVABLE!!!!!!!!!!!!!

Could not actually believe something like this would actually exist!!!!

This is a must install and EVERY one should know about it.

Seeing as I can use bullet-points or numbers now,I almost regret installing the Category Fields contribution!!!

It even lets you create ANCHORS!!!! insert IMAGES!!! LINKS!!! It's like being a child in a candystore....

Thanks for posting it orvi won, make sure to add it to the contribution section....

--Peter

orviwan

Sep 21 2005, 04:05 PM

Thanks for the feedback, I'm glad you like it. I didn't write TinyMCE, I have just used it in previous projects and saw the opportunity. I will try to add this into the contributions, but I only installed osCommerce yesterday for the first time so this is all new to me

TobiasP

Sep 22 2005, 10:30 AM

This is really great.

It is also pretty simple to modify it to include the Image Manager from http://www.zhuo.org/htmlarea/ if you don't want to buy the Image editor from TinyMCE.

I will try to create an intruction for that later.

ChrisW123

Sep 27 2005, 08:43 PM

I can't get it to work! Copied files and sub-folders in "tinymce" to my ".../includes/javascript/" folder and added the code you posted in includes/Header.php above the <table> tag. But no go! None of the textboxes on any admin screen look different.

Did you have to do anything else to get it to work?

orviwan

Sep 27 2005, 08:49 PM

I would check the permissions on the files/folders. What server is osCommerce running on?

ChrisW123

Sep 27 2005, 09:22 PM

QUOTE (orviwan @ Sep 27 2005, 12:49 PM)

I would check the permissions on the files/folders. What server is osCommerce running on?

I just changed the "javascript" and "tiny_mcs" folders to 777, and tiny_mcs.js to 777 but no help. My browser is setup to run Java script.

Server is a shared Unix server. Any ideas? I have other java script that works fine.

orviwan

Sep 28 2005, 12:24 AM

PM me the url and I will check a few things.

demon2lima

Sep 28 2005, 09:47 PM

My page loads fine but at the bottom of IE I get a page load error. The details say that TinyMCE is not defined.

orviwan

Sep 29 2005, 01:24 PM

Check the contents of /admin/includes/javascript/tiny_mce/

It should contain:

> langs
> plugins
> themes
> utils
blank.htm
license.txt
tiny_mce.js
tiny_mce_popup.js
tiny_mce_src.js

demon2lima

Sep 29 2005, 08:03 PM

Thanks, I figured it out minutes after placing that post. I was short a file. oops.

Chuck

www.everythingbelowretail.com

mad_princess

Oct 20 2005, 07:55 AM

hihi.... How come my textarea is on top of the Rich Content Editor? Is there anyway to make my textarea BELOW the Rich Content Editor?

Thanks in advance.....

orviwan

Oct 20 2005, 07:07 PM

I sent you a PM, please respond.

Thanks

Kristofor

Oct 21 2005, 01:46 AM

wow, this is seriously good, it kicks the other wysiwyg editors out of the park. I have one problem I have ultra images installed and when I install this my first main product image now displays as below

Now the code that is relevent in the categories document is

CODE

<tr>
           <td class="dataTableRow" valign="top"><span class="main"><?php echo TEXT_PRODUCTS_IMAGE_NOTE; ?></span></td>
           <?php if (WYSIWYG_USE_PHP_IMAGE_MANAGER == 'Disable') { ?>
           <td class="dataTableRow" valign="top"><span class="smallText"><?php echo tep_draw_separator('pixel_trans.gif', '24', '15') . ' ' . tep_draw_file_field('products_image') . '<br>'; ?>
           <?php } else { ?>
           <td class="dataTableRow" valign="top"><span class="smallText"><?php echo '<table border="0" cellspacing="0" cellpadding="0"><tr><td class="dataTableRow">' . tep_draw_textarea_field('products_image', 'soft', '70', '2', $pInfo->products_image) . tep_draw_hidden_field('products_previous_image', $pInfo->products_image) . '</td></tr></table>';
           } if (($HTTP_GET_VARS['pID']) && ($pInfo->products_image) != '') { ?>
              <tr>
                <td class="dataTableRow" colspan="2" valign="top"><?php if (tep_not_null($pInfo->products_image)) { ?><span class="smallText"><?php echo tep_image(DIR_WS_CATALOG_IMAGES . $pInfo->products_image, $pInfo->products_image, SMALL_IMAGE_WIDTH, SMALL_IMAGE_HEIGHT, 'align="left" hspace="0" vspace="5"') . tep_draw_hidden_field('products_previous_image', $pInfo->products_image) . '<br>'. tep_draw_separator('pixel_trans.gif', '5', '15') . ' <input type="checkbox" name="unlink_image" value="yes">' . TEXT_PRODUCTS_IMAGE_REMOVE_SHORT . '<br>' . tep_draw_separator('pixel_trans.gif', '5', '15') . ' <input type="checkbox" name="delete_image" value="yes">' . TEXT_PRODUCTS_IMAGE_DELETE_SHORT . '<br>' . tep_draw_separator('pixel_trans.gif', '1', '42'); ?></span><?php } ?></td>
              </tr>
              <tr>
                <td colspan="2"><hr></td>
             </tr>
           <?php } ?>
         </tr>
  <?php
      if (ULTIMATE_ADDITIONAL_IMAGES == 'Enable') {
   ?>
          <tr>
           <td class="dataTableRow" valign="top"><span class="main"><?php echo TEXT_PRODUCTS_IMAGE_MEDIUM; ?></span></td>
           <?php if (WYSIWYG_USE_PHP_IMAGE_MANAGER == 'Disable') { ?>
           <td class="dataTableRow" valign="top"><span class="smallText"><?php echo tep_draw_separator('pixel_trans.gif', '24', '15') . ' ' . tep_draw_file_field('products_image_med') . '<br>'; ?>
           <?php } else { ?>
           <td class="dataTableRow" valign="top"><span class="smallText"><?php echo '<table border="0" cellspacing="0" cellpadding="0"><tr><td class="dataTableRow">' . tep_draw_textarea_field('products_image_med', 'soft', '70', '2', $pInfo->products_image_med) . tep_draw_hidden_field('products_previous_image_med', $pInfo->products_image_med) . '</td></tr></table>';
           } if (($HTTP_GET_VARS['pID']) && ($pInfo->products_image_med) != '') { ?>
              <tr>
                <td class="dataTableRow" colspan="2" valign="top"><?php if (tep_not_null($pInfo->products_image_med)) { ?><span class="smallText"><?php echo tep_image(DIR_WS_CATALOG_IMAGES . $pInfo->products_image_med, $pInfo->products_image_med, SMALL_IMAGE_WIDTH, SMALL_IMAGE_HEIGHT, 'align="left" hspace="0" vspace="5"') . tep_draw_hidden_field('products_previous_image_med', $pInfo->products_image_med) . '<br>'. tep_draw_separator('pixel_trans.gif', '5', '15') . ' <input type="checkbox" name="unlink_image_med" value="yes">' . TEXT_PRODUCTS_IMAGE_REMOVE_SHORT . '<br>' . tep_draw_separator('pixel_trans.gif', '5', '15') . ' <input type="checkbox" name="delete_image_med" value="yes">' . TEXT_PRODUCTS_IMAGE_DELETE_SHORT . '<br>' . tep_draw_separator('pixel_trans.gif', '1', '42'); ?></span><?php } ?></td>
              </tr>
              <tr>
                <td colspan="2"><hr></td>
             </tr>
           <?php } ?>

          <tr>
           <td class="dataTableRow" valign="top"><span class="main"><?php echo TEXT_PRODUCTS_IMAGE_LARGE; ?></span></td>
           <?php if (WYSIWYG_USE_PHP_IMAGE_MANAGER == 'Disable') { ?>
           <td class="dataTableRow" valign="top"><span class="smallText"><?php echo tep_draw_separator('pixel_trans.gif', '24', '15') . ' ' . tep_draw_file_field('products_image_lrg') . '<br>'; ?>
           <?php } else { ?>
           <td class="dataTableRow" valign="top"><span class="smallText"><?php echo '<table border="0" cellspacing="0" cellpadding="0"><tr><td class="dataTableRow">' . tep_draw_textarea_field('products_image_lrg', 'soft', '70', '2', $pInfo->products_image_lrg) . tep_draw_hidden_field('products_previous_image_lrg', $pInfo->products_image_lrg) . '</td></tr></table>';
           } if (($HTTP_GET_VARS['pID']) && ($pInfo->products_image_lrg) != '') { ?>
              <tr>
                <td class="dataTableRow" colspan="2" valign="top"><?php if (tep_not_null($pInfo->products_image_lrg)) { ?><span class="smallText"><?php echo tep_image(DIR_WS_CATALOG_IMAGES . $pInfo->products_image_lrg, $pInfo->products_image_lrg, SMALL_IMAGE_WIDTH, SMALL_IMAGE_HEIGHT, 'align="left" hspace="0" vspace="5"') . tep_draw_hidden_field('products_previous_image_lrg', $pInfo->products_image_lrg) . '<br>'. tep_draw_separator('pixel_trans.gif', '5', '15') . ' <input type="checkbox" name="unlink_image_lrg" value="yes">' . TEXT_PRODUCTS_IMAGE_REMOVE_SHORT . '<br>' . tep_draw_separator('pixel_trans.gif', '5', '15') . ' <input type="checkbox" name="delete_image_lrg" value="yes">' . TEXT_PRODUCTS_IMAGE_DELETE_SHORT . '<br>' . tep_draw_separator('pixel_trans.gif', '1', '42'); ?></span><?php } ?></td>
              </tr>
              <tr>
                <td colspan="2"><hr></td>
             </tr>
           <?php } ?>
         </tr>

What i dont get is why does it only mess up the first image thing, I have lots more which it doesnt mess up. i would just like to remove it from the image area and keep it for the html area.

What should I do?

jwen

Oct 21 2005, 11:23 PM

Is anyone know how to add full feasures in the edit penal ples?

ken.yong

Oct 24 2005, 10:17 PM

can't help to post the followings:

THIS IS THE BEST HTML WYSIWYG EDITOR!

Kristofor

Oct 24 2005, 10:28 PM

yeh I agree, but does anyone know how to fix my problem, because i dont want it in the image editing area.

orviwan

Oct 25 2005, 07:00 AM

QUOTE (Kristofor @ Oct 24 2005, 11:28 PM)

yeh I agree, but does anyone know how to fix my problem, because i dont want it in the image editing area.

Put a CSS class on the textarea you don't want to be changed into the editor.

Example of usage of the editor_deselector option:

CODE

tinyMCE.init({
...
editor_deselector : "mceNoEditor"
});

Example of usage in the HTML:

CODE

<textarea id="myarea1" class="mceNoEditor">This will be a NOT be a editor.</textarea>

<textarea id="myarea2">This will be a editor.</textarea>

http://tinymce.moxiecode.com/tinymce/docs/...deselector.html

cgourlay

Oct 31 2005, 03:57 PM

QUOTE (mad_princess @ Oct 20 2005, 03:55 AM)

hihi.... How come my textarea is on top of the Rich Content Editor? Is there anyway to make my textarea BELOW the Rich Content Editor?

Thanks in advance.....

Does anyone have a fix for this?

orviwan

Oct 31 2005, 08:32 PM

hi, someone had the same problem and this was the fix they used:

QUOTE

I added this: theme_advanced_toolbar_location : "top" and everything is fine already.

brushwood

Oct 31 2005, 08:47 PM

First a note: This is excellent! Thanks so very much!!! If and when you make this an official Contrib, and I think you should, please make a note:
When using this Contribution and the Products Short Descriptions Contribution, the resulting short descriptions will be shortened by the number of html characters you add. The formatting works, but the truncation comes earlier in the visible text. Consider adding similar html code near the beginning of each description and making the truncation number bigger to capture more text.

orviwan

Nov 3 2005, 10:46 AM

QUOTE (brushwood @ Oct 31 2005, 08:47 PM)

First a note: This is excellent! Thanks so very much!!! If and when you make this an official Contrib, and I think you should, please make a note:
When using this Contribution and the Products Short Descriptions Contribution, the resulting short descriptions will be shortened by the number of html characters you add. The formatting works, but the truncation comes earlier in the visible text. Consider adding similar html code near the beginning of each description and making the truncation number bigger to capture more text.

Ok, I will mention that when I get my contribution ready.

The way I did short descriptions was to take the first 3 lines of the description, so it doesnt need a specific character length.

Add

CODE

pd.products_description

to

CODE

$listing_sql

in /index.php

In includes/modules/product_listing.php, at the end of

CODE

case 'PRODUCT_LIST_NAME':

before the

CODE

break;

CODE

            if($listing['products_description']!='') {
              $sDesc = str_replace("<br>", "\n", $listing['products_description']);
              $aDesc = split("\n", $sDesc);
              $sDesc = "<br>" . $aDesc[0] . "<br>" . $aDesc[1] . "<br>" . $aDesc[2];
              $lc_text .= $sDesc;
            }

It displays 3 lines of the description beflow the product name.

Melinda Odom

Nov 4 2005, 04:46 AM

Hi,

I am having one little problem ...

In the admin when I put an image path in like:
http://www.designhosting.biz/assets/bg_body.jpg the image shows up in the store admin editor box plus on the website.

When I put an image path in like:
http://www.designhosting.biz/catalog/images/bg_body.jpg the image shows up in the store admin edit box but does not show up on the website ... there is just a blank image that shows up.
Example is here:
http://www.designhosting.biz/catalog/produ...&products_id=11

You will see that the dead image path excludes the "catalog" folder which was clearly put in the path in the admin editor box.

Any ideas on this?

Thanks!

Melinda Odom

Nov 4 2005, 03:54 PM

Hi,

Found another problem...this editor does not show the text area where you type in text in the orders section comment box.

Any ideas why or how to fix?

Thanks!

nickm324

Nov 5 2005, 04:21 AM

QUOTE (modom @ Nov 4 2005, 09:54 AM)

Hi,

Found another problem...this editor does not show the text area where you type in text in the orders section comment box.

Any ideas why or how to fix?

Thanks!

I see the exact same problem, have you found a fix yet?

The box is collapsed its there but as thin as a hair you can actually click in it and type something even though you can't see what your typing and the hit update and the customer will receive the comment.

Would be nice to see what you are typing though.

I will work on it and if I find a fix I will post it here.

nickm324

Nov 5 2005, 05:49 AM

QUOTE (orviwan @ Oct 25 2005, 01:00 AM)

Put a CSS class on the textarea you don't want to be changed into the editor.

Example of usage of the editor_deselector option:

CODE

tinyMCE.init({
...
editor_deselector : "mceNoEditor"
});

Example of usage in the HTML:

CODE

<textarea id="myarea1" class="mceNoEditor">This will be a NOT be a editor.</textarea>

<textarea id="myarea2">This will be a editor.</textarea>

http://tinymce.moxiecode.com/tinymce/docs/...deselector.html

exactly where does this go?

CODE

tinyMCE.init({
...
editor_deselector : "mceNoEditor"
});

Tasker

Nov 5 2005, 08:06 AM

Now hold it right here, I'm sure I have installed this as per instructions in first post but editor does not show!
IE shows an error about "tinyMCE.init" being "undefined" while FireFox just fails to load the editor.

I have this in my header:
<script language="javascript" type="text/javascript" src="/includes/javascript/tiny_mce/tiny_mce.js"></script>
<script language="javascript" type="text/javascript">
tinyMCE.init({
mode : "textareas"
});
</script>

Does anyone know what's keeping this from activating the editor?

orviwan

Nov 5 2005, 11:45 AM

QUOTE (Tasker @ Nov 5 2005, 08:06 AM)

Now hold it right here, I'm sure I have installed this as per instructions in first post but editor does not show!
IE shows an error about "tinyMCE.init" being "undefined" while FireFox just fails to load the editor.

I have this in my header:
<script language="javascript" type="text/javascript" src="/includes/javascript/tiny_mce/tiny_mce.js"></script>
<script language="javascript" type="text/javascript">
tinyMCE.init({
mode : "textareas"
});
</script>

Does anyone know what's keeping this from activating the editor?

Can you make sure that the file exists in this path: src="/includes/javascript/tiny_mce/tiny_mce.js"

The slash at the beginning of '/includes' mean that the path starts from the root of your webserver, you probably want to remove the slash and try again... or fix the path.

QUOTE (nickm324 @ Nov 5 2005, 05:49 AM)

exactly where does this go?

CODE

tinyMCE.init({
...
editor_deselector : "mceNoEditor"
});

In the first post of this thread, it says:

QUOTE

4. Edit /admin/includes/header.php and insert the following lines before the <table> tag.

CODE

You will want to do something like

CODE

nickm324

Nov 7 2005, 04:05 PM

QUOTE (orviwan @ Nov 5 2005, 05:45 AM)

Can you make sure that the file exists in this path: src="/includes/javascript/tiny_mce/tiny_mce.js"

The slash at the beginning of '/includes' mean that the path starts from the root of your webserver, you probably want to remove the slash and try again... or fix the path.
In the first post of this thread, it says:
You will want to do something like

CODE

Ok I have used your example of putting editor_deselector : "mceNoEditor"
in the tinyMCE.init section and the result is that it kills tinyMCE in all the textareas. I didn't even get to add the class="mceNoEditor" to the ones I wanted to. It kills them all.

Any other ideas?

HoopsGuru

Nov 9 2005, 07:25 AM

My own problem is that I define languages (i.e. shipping.php) through the admin interface and now that I have the text editor installed it is an empty box if I try to do this (actually flashes the old editor with all the coding first, then advances to an empty box). Any way around this as it was the easiest for me.

GORF

Nov 11 2005, 03:23 AM

QUOTE (nickm324 @ Nov 4 2005, 11:21 PM)

I see the exact same problem, have you found a fix yet?

The box is collapsed its there but as thin as a hair you can actually click in it and type something even though you can't see what your typing and the hit update and the customer will receive the comment.

Would be nice to see what you are typing though.

I will work on it and if I find a fix I will post it here.

Found it....

Look for

CODE

Change to

CODE

It seems it can't handle a short text area

bibbli

Nov 13 2005, 06:25 AM

QUOTE (modom @ Nov 4 2005, 04:46 AM)

Hi,

I am having one little problem ...

In the admin when I put an image path in like:
http://www.designhosting.biz/assets/bg_body.jpg the image shows up in the store admin editor box plus on the website.

When I put an image path in like:
http://www.designhosting.biz/catalog/images/bg_body.jpg the image shows up in the store admin edit box but does not show up on the website ... there is just a blank image that shows up.
Example is here:
http://www.designhosting.biz/catalog/produ...&products_id=11

You will see that the dead image path excludes the "catalog" folder which was clearly put in the path in the admin editor box.

Any ideas on this?

Thanks!

If you using url=http://www.designhosting.biz/catalog/images/bg_body.jpg in admin page, after update, chose edit product, the picture url now will be: ../images/bg_body.jpg. Change it to ../catalog/images/bg_body.jpg.
This picture will not be displayed on admin page, but website will show it.
The problem may be the different of admin page and web site product page (difer from directory)

orviwan

Nov 13 2005, 11:42 AM

QUOTE (bibbli @ Nov 13 2005, 06:25 AM)

If you using url=http://www.designhosting.biz/catalog/images/bg_body.jpg in admin page, after update, chose edit product, the picture url now will be: ../images/bg_body.jpg. Change it to ../catalog/images/bg_body.jpg.
This picture will not be displayed on admin page, but website will show it.
The problem may be the different of admin page and web site product page (difer from directory)

Sounds like something to do with the Base HREF. I suggest searching the TinyMCE forums.

simeonfeng

Nov 14 2005, 05:20 AM

I got a small problem here.

The installation was fine and I can see the editor box and edited my "About us" info just for example. But to my surprise, the edited text is showing at the very starting line of the page and the whole shop template is squeezed at the bottom of the Text.
How come the text is jumping out of the box?????????

simeonfeng

Nov 15 2005, 09:04 AM

Why this topic is suddenly quiet down.....
Such a good tool (although with some yet to solved bugs)!!!!

Kristofor

Nov 18 2005, 01:50 AM

ok guys, welll after playing around I have figured out how to solve the problem with the editor going in areas it shouldn't, for those who had problems with the deselctor,

CODE

there must be a , after textareas" e.g,

CODE

However this is not the fix. The thing is that you need to have this display only in text areas that you want it to display in. To do this you need to use the editor selector rather then de-selector. However the text areas are drawn using a function. This means that you must duplicate the tep_draw.

in admin/includes/functions/html_output find this code

CODE

below this add

CODE

now to apply this new function e.g in your products description go to admin/categories.php
find

CODE

<td class="main"><?php echo tep_draw_textarea_field('products_description[' . $languages[$i]['id'] . ']', 'soft', '70', '15', (isset($products_description[$languages[$i]['id']]) ? stripslashes($products_description[$languages[$i]['id']]) : tep_get_products_description($pInfo->products_id, $languages[$i]['id']))); ?></td>

change to

CODE

<td class="main"><?php echo tep_draw_textarea_field_mce('products_description[' . $languages[$i]['id'] . ']', 'soft', '70', '15', (isset($products_description[$languages[$i]['id']]) ? stripslashes($products_description[$languages[$i]['id']]) : tep_get_products_description($pInfo->products_id, $languages[$i]['id']))); ?></td>

now in header.php we need to make the script use the editor selector,
so find

CODE

change to

CODE

That should be everything. Basically just change the tep_draw functions for the areas you want the editor in.

Hope this helps,

thanks
kris

Bozmium

Apr 2 2006, 07:35 AM

QUOTE (Kristofor @ Nov 18 2005, 12:50 PM)

ok guys, welll after playing around I have figured out how to solve the problem with the editor going in areas it shouldn't, for those who had problems with the deselctor,

CODE

there must be a , after textareas" e.g,

CODE

However this is not the fix. The thing is that you need to have this display only in text areas that you want it to display in. To do this you need to use the editor selector rather then de-selector. However the text areas are drawn using a function. This means that you must duplicate the tep_draw.

in admin/includes/functions/html_output find this code

CODE

below this add

CODE

now to apply this new function e.g in your products description go to admin/categories.php
find

CODE

<td class="main"><?php echo tep_draw_textarea_field('products_description[' . $languages[$i]['id'] . ']', 'soft', '70', '15', (isset($products_description[$languages[$i]['id']]) ? stripslashes($products_description[$languages[$i]['id']]) : tep_get_products_description($pInfo->products_id, $languages[$i]['id']))); ?></td>

change to

CODE

<td class="main"><?php echo tep_draw_textarea_field_mce('products_description[' . $languages[$i]['id'] . ']', 'soft', '70', '15', (isset($products_description[$languages[$i]['id']]) ? stripslashes($products_description[$languages[$i]['id']]) : tep_get_products_description($pInfo->products_id, $languages[$i]['id']))); ?></td>

now in header.php we need to make the script use the editor selector,
so find

CODE

change to

CODE

That should be everything. Basically just change the tep_draw functions for the areas you want the editor in.

Hope this helps,

thanks
kris

This works a treat Kris thanks for sharing. Makes it easy to define which text fields to apply the TinyMCE to. I have found an interesting fork on this great little WYSIWYG editor called TinyFCK - some clever chap has integrated the FCK file browser functions with TinyMCE which only has a paid file browser and sorely cries out for this addition.

See it here: http://p4a.sourceforge.net/tinyfck
or if you go here there is an updated Zip posted with the latest TinyMCE:
http://sourceforge.net/forum/forum.php?forum_id=528776

There is also a plethora of groovy plugins for TinyMCE here:
http://sourceforge.net/tracker/?atid=73874...281&func=browse

The iBrowser plugin rocks and i highly recommend getting it added onto your TinyMCE. It even caches your product thumbs via the GDLibrary!

My issue? I cant seem to get the FCK filemanager in tinyFCK to do anything but return a "cannot find callback function" error. Im sure its something to do with the way i am setting up my php connectors config.php file - probably something dumb like a path set wrong - if anyone has this running id love to hear!

While i have TinyMCE running a treat in my product edit window i wanted to be able to use it in the image url text field, much like my current HTMLArea 1.7 does now, whereby you can browse to a file on your server and it automatically adds the image URL - but without this filemanager addon working it doesnt seem to be making the callback properly and passing it into the textfield.

Enjoy and thanks for the additions & tips guys.

stevencortez

Apr 20 2006, 06:54 AM

PROBLEM! HELP.

I'm trying to edit the main page (index.php in Languages).... you know the "This is a default setup of the osCommerce project...\'); text information. All the middle text. Anyway when I load up the editor, the text shows up but the html shows up on the very bottom:

Question 1: What am I doing wrong? Why is the text looking scrambled at the end?

Question 2: When I edit the text and save it, it shows up on the header on the very top, and not in the middle?

CODE

This is a default setup of the osCommerce project...\');

The text highlighted in green may be modified - it is important to keep the define() of the TEXT_MAIN keyword. To remove the text for TEXT_MAIN completely, the following example is used where only two single quote characters exist:

define(\'TEXT_MAIN\', \'\');

More information concerning the PHP define() function can be read here.' . tep_image(DIR_WS_IMAGES . 'default/3.gif') . 'Securing The Administration Tool

It is important to secure the Administration Tool as there is currently no security implementation available.' . tep_image(DIR_WS_IMAGES . 'default/4.gif') . 'Online Documentation

Online documentation can be read at the osCommerce Knowledge Base site.

Community support is available at the osCommerce Community Support Forums site.
If you wish to download the solution powering this shop, or if you wish to contribute to the osCommerce project, please visit the support site of osCommerce. This shop is running on osCommerce version ' . PROJECT_VERSION . '.'); define('TABLE_HEADING_NEW_PRODUCTS', 'New Products For %s'); define('TABLE_HEADING_UPCOMING_PRODUCTS', 'Upcoming Products'); define('TABLE_HEADING_DATE_EXPECTED', 'Date Expected'); if ( ($category_depth == 'products') || (isset($HTTP_GET_VARS['manufacturers_id'])) ) { define('HEADING_TITLE', 'Let\'s See What We Have Here'); define('TABLE_HEADING_IMAGE', ''); define('TABLE_HEADING_MODEL', 'Model'); define('TABLE_HEADING_PRODUCTS', 'Product Name'); define('TABLE_HEADING_MANUFACTURER', 'Manufacturer'); define('TABLE_HEADING_QUANTITY', 'Quantity'); define('TABLE_HEADING_PRICE', 'Price'); define('TABLE_HEADING_WEIGHT', 'Weight'); define('TABLE_HEADING_BUY_NOW', 'Buy Now'); define('TEXT_NO_PRODUCTS', 'There are no products to list in this category.'); define('TEXT_NO_PRODUCTS2', 'There is no product available from this manufacturer.'); define('TEXT_NUMBER_OF_PRODUCTS', 'Number of Products: '); define('TEXT_SHOW', 'Show:'); define('TEXT_BUY', 'Buy 1 \''); define('TEXT_NOW', '\' now'); define('TEXT_ALL_CATEGORIES', 'All Categories'); define('TEXT_ALL_MANUFACTURERS', 'All Manufacturers'); } elseif ($category_depth == 'top') { define('HEADING_TITLE', 'What\'s New Here?'); } elseif ($category_depth == 'nested') { define('HEADING_TITLE', 'Categories'); } ?>

LenC

May 6 2006, 09:41 PM

QUOTE (orviwan @ Sep 20 2005, 05:36 PM)

http://tinymce.moxiecode.com/

I found this very easy to integrate into osCommerce 2.2-MS2.

Here's how:

1. Download TinyMCE (see above).

2. Extract the TinyMCE .zip file to a temporary location.

3. Copy the contents of the \tinymce\jscripts\tiny_mce\ folder from the temporary location to /admin/includes/javascript/tiny_mce/ on the web server.

4. Edit /admin/includes/header.php and insert the following lines before the <table> tag.

CODE

That's it, now every <TEXTAREA> within the Administration site will be automatically replaced with a powerful inline html editor.

You will see the editor when adding or editing a product, maybe in other places too.

See the TinyMCE readme or website for ways you can tweak the editor, the default settings don't do it justice.

Melinda Odom

May 6 2006, 10:09 PM

Thanks! I was wondering where to put this code for the email and newsletter area also. I added these values from what I already had because you can color the text and has a few more formatting values.

<script language="javascript" type="text/javascript" src="includes/javascript/tiny_mce/tiny_mce.js"></script>
<script language="javascript" type="text/javascript">
tinyMCE.init({
mode : "textareas",
theme : "advanced",
theme_advanced_buttons1_add_before : "save,separator",
theme_advanced_buttons1_add : "fontselect,fontsizeselect",
theme_advanced_buttons2_add : "separator,insertdate,inserttime,preview,zoom,separator,forecolor,backcolor",
theme_advanced_buttons2_add_before: "cut,copy,paste,separator,search,replace,separator",
theme_advanced_buttons3_add_before : "tablecontrols,separator",
theme_advanced_buttons3_add : "emotions,iespell,flash,advhr,separator,print",
theme_advanced_toolbar_location : "top",
theme_advanced_toolbar_align : "left",
theme_advanced_path_location : "bottom",
plugin_insertdate_dateFormat : "%Y-%m-%d",
plugin_insertdate_timeFormat : "%H:%M:%S"
});
</script>

demon_athens

May 10 2006, 06:37 PM

Ι have this problem. When I am writing Greek characters ( default charset=iso-8859-7) i get this as a resault in the HTML mode ( and in the DB ) : Ηχεία κολόνε&sigmaf;

The probliem is well known but I can't think of something. Tiny forum didn't help me. Any ideas?

orviwan

May 10 2006, 07:30 PM

Are you having this problem only with specific html enties?

This looks like your problem:

http://tinymce.moxiecode.com/punbb/viewtopic.php?id=640

QUOTE

TinyMCE also has another file called: tiny_mce_src.js that also has all the special characters, so if there is a need to eliminate some special characters, it has to be done on both files: tiny_mce.js and tiny_mce_src.js

Let me know how you get on.

demon_athens

May 11 2006, 10:48 PM

orviwan thanks for your reply. I found the answer to my problem! In tiny_mce.js there is a configuration option "entity_encoding" that must be changed to "raw" (default is "named").

Works like a charm.

muskokee

May 30 2006, 11:47 PM

Hi everyone,

So happy to discover this editor! I love it.

Thanks for bringing it to the community

My question is sort of~kind of related to this editor. Does anyone know what code within the osc base allows the html characters to be used within textareas?

I have added a few contributions that have not been coded properly and my new, shiny, fantabulous editor does nothing to these textarea's but have them display the html within the text

In anticipation

Sheri

muskokee

May 30 2006, 11:58 PM

QUOTE (muskokee @ May 30 2006, 07:47 PM)

Does anyone know what code within the osc base allows the html characters to be used within textareas?

Whoops...wish the edit post worked longer than a few seconds

"stripslashes" fixed the output.

Sheri

PerwiraUtama

May 15 2007, 09:46 PM

Wicked!!! God Bless Orviwan, for posting this contribution.

PerwiraUtama

May 18 2007, 12:18 PM

Hi All,

Is there any way that I can change the style/format of the paragraph? I would like to have single line spacing rather than the default double line spacing.

Does anyone know how to do it?

Thanks

danil0

May 28 2007, 05:55 AM

QUOTE (demon_athens @ May 11 2006, 10:48 PM)

orviwan thanks for your reply. I found the answer to my problem! In tiny_mce.js there is a configuration option "entity_encoding" that must be changed to "raw" (default is "named").

Works like a charm.

Thanxs A lot!!! I was hard looking for this ...

OSCOMMERCE SUPPORT CALL 702-453-3332