Installing TinyMCE (with img_assist) in Drupal 5.1
Each time I install this module, I have to go through several steps to get it to work properly. I have now finally decided to actually write those steps down somewhere, and what better place than my own blog :)
Versions used:
* TinyMCE module: tinymce-5.x-1.x-dev (2007-05-06)
* TinyMCE: 2.1.1.1 (2007-05-14)
* img_assist module: img_assist-5.x-1.x-dev (2007-05-17)
- extract module into its own folder
- extract tinymce-2.1.1.1 into the module folder, creating a new tinymce folder i.e. you should have the following folder structure: modules/tinymce/tinymce.
- activate the module in Drupal
- create a new input type that has no input filters checked (NOTE: (1) if you're using img_assist, then tick the "Inline images" option - see below for installation steps for this plugin
(2) if you're worried about security issues, then use Full HTML - you might have to add some extra elements to the allowable list) - go to access control and give at least one role the "access tinymce" rights
- go to the TinyMCE admin settings page and create a new profile
- in Basic setup check the following options:
- default state: enabled
- allow users to choose default: allow
- show disable/enable rich text editor toggle: true (default) NOTE: if you use the img_assist module, and set this to false, you will have the regular img_assist icon appear below your text areas, as well as an icon in the TinyMCE toolbar. By enabling this option, the img_assist is hidden from view until you click "disable rich text". Personally, I like it to work this way, so that I can still insert images, even if TinyMCE is turned off.
- in Visibility check "Show on only the listed pages." and enter "node/*" and "comment/*" into the box.
NOTE: if you are using i18n, then you must put "*/" in front of any URL to allow for the language path
NOTE 2:If you want to disable TinyMCE for specific textareas, you can. Check out this article. - tick the following buttons for a fairly simple interface:
- advanced link
- bold, italic, underline
- left, right center and justified alignment
- unordered and ordered list, indent and outdent
- create link, break link
- image, font color
- formatselect
The topic which you have
The topic which you have discussed is very informative as well as valuable for all...Thanks for providing this information for us....
Great article but I still
Great article but I still have a couple of issues.
First of all my operating conditions are:
TyniMCE 3.2.1 ( there are not available previous versions )
Drupal 6.6
and latest image_Assist and image modules
I followed you article and modules are installed BUT:
- icon "add image" is under textarea box and not on TinyMCE menu
- images are loosing their settings. it means: I import the image into text area, I set-up its own settings as position (float:right; for instance) margin border and so on .. it seems goo but at soon I go in preview OR I save the article/blog automatically all those settings are lost
- Import image window, is horribly RED with a difficult access menu at the top
Could you help me please ?
Well...
This article very well may not work in Drupal 6 - I haven't tested that out yet. That said:
Hope that helps.
i am having a weird behaviour
my img assist is not showing but when TinyMCE is on but when I toggle it off, the img_assist icon appears...I'd like to have both on. Any idea of what is happening?
Having issue with right click menu?
When in edit mode I right click the menu take up the entire width of the browser. Any ideas. I am really desperate to solve this problem. thanks
I had the same problem.
I had the same problem...
I couldnt do anything but disable some buttons on the toolbar.
Its the long toolbars which make timyMCE so wide...
More details
Er, which menu are you talking about? If its the browser menu that pops up when you right-click, then its your browser that's messed up, and doesn't have anything to do with Drupal or this article.
Thank you!
Just another grateful post.. thank you for the instructions.. my client is very happy that I solved the glitch with the missing img_assist icon in less than 10 minutes - thanks to you!
Thanks so much!
Just wanted to echo the other comments thanking you for posting this information. I'm so glad that I found your instructions - I would have been lost without them. I first downloaded TinyMCE 3 wanting the "best and latest" but am glad I read through the article telling me that TinyMCE 3 won't work with img_assist.
Don't show img_assist button
Hi. Excelent tutorial!!!
Like someone else, the TinyMCE toolbar doesn't show the img_assist button.
It shows the img_assist icon at the bottom of the textbox because the img_assist module is installed.
I need help, I spent a lot of time trying to resolve the problem. I installed the img_assist plugin in the right directory and I edited the plugin_reg.php without aparent errors.
Folder structure
You problery did the same mistake i did.
1. extract module into its own folder
2. extract tinymce-2.1.1.1 into the module folder, creating a new tinymce folder i.e. you should have the following folder structure: modules/tinymce/tinymce.
Notice the structure. The tinymce-2.1.1.1 should be one level further down - modules/tinymce/tinymce.
Hope it helps
Henrik
A mistake
No offence, but you've probably made a mistake somewhere in following the steps. Double-check the folder path, and that you added the code before the closing ?> in plugin-reg. Also make sure you actually enabled the button in the TinyMCE settings.
Solutioned
Yes, the problem was the tinyMCE version. The v3.0 doesn't work with img_assist because of the APIs. I installed the v2.1.3 and works great.
Thanks again
The problem could be the version
Hi
I think the problem could be that the tinyMCE version I installed is the 3.0.
Now I will try installing a previous version.
The img_assist version I installed is the 1.5 for Drupal 5.x
Thanks
default left justification
Nice article.
I have one config problem though. The editor defaults to center justification. I need left justification. I'm not talking about the justification buttons, but rather where the cursor is positioned at the start. Does anyone know how to change the default justification without having to click on the left justification button?
Thanks in advance.
Theme
its most likely your theme that's doing it, as I don't see that problem in any site I've done. In your stylesheet check for a textarea declaration that has align:center in it.
hi,i have followed your
hi,i have followed your tutorial and installed tinymce & other module.but when i try to edit a page,tinymce editor doesnot showup.i can access the tinymce settings and create profiles.the problem persists in all themes.
Two things you can check:
Two things you can check: firstly that you have allowed your role to access tinymce (step 5) and that you have installed the tinymce program (that you had to download from the moxiecode site) in the correct folder (step 2).
thanks
thanks,its working now.
Great
Thks, your tutorial helped me out of dispear! One full Sunday from early morning till midthnight, pluss this night. Found your step by step information on google, and followed it to the last bits.
Well now, my problem were partly theme, - It works in Garland now, so I shall sort out the theme problem later, partly I18N and partly versions of module (or more versions of information, realy).
One thing, though, - I18N. Your instructions didn't quite work. I tried the
*/node/*
*/comment/*
as well as
en/node/*
nb/node/*
etc., but despite I had the site set to "nb", the editor showed up first at a clean
node/*
comment/*
and the tinyMCE basic setup section, - Lanuage set to nb. This just if anyone else are fiddeling along with I18N.
Again, thks.
endre
Where am I going wrong? I
Where am I going wrong? I followed these instructions to the letter but I am not able to see the editor when I want to edit my site's text?
See above
See the above comment for things to double-check. Most of the time its one or the other. Also ensure that your user has been assigned a role that can use TinyMCE, even if you're the superuser.
Rollover Images
Thanks for the tutorial. It sounds like you have quite a bit of experience with setting up tinyMCE, so I wondered if you could shed some light on an issue I'm having...
It has to do with images that have been inserted into a page using the Advanced Image plugin and have an "alternative image" (i.e. mouseover swap image) defined.
If a user navigates to a page with a rollover image defined, and then highlights that image and clicks on the Insert/edit Image icon, all of the info on the Advanced tab is erased (i.e. the source of the rollover image).
Any ideas? You ever seen that before?
Thanks for any input you have.
Best
Sorry, no idea
I've never used those advanced options, I'm afraid, so I don't know what would be causing that. I would check the TinyMCE issue queue to see if anyone else has had the same problem. You could also look on the TinyMCE website for information.
thank you sooooo much....
.... you saved my day. i read a dozen tutorials - they all failed me. yours did not :-)
Great Article
Thanks Dave. You saved me lot of my time.
Is there a way so that I can align the image in a page using image_assist. I could do it using TinyMCE image but not able to in image_assist?
Before you insert the image
Before you insert the image into the page, you can select the alignment from the Alignment drop-down on the right hand side of the window (on the same level as the size options. You have left, right, center and none available to you.
I have gotten everything set
I have gotten everything set up. Now when I insert an image as a filter tag, it does not appear. I changed the Input format from filtered HTML to full HTML and still does not work. When I click insert as HTML code, it works but then I can't edit the picture again, which is useless
Check input formats
When you installed img_assist initially, did you enable it in the input formats? Otherwise, all you end up seeing is the filter tag code. Go to admin/settings/filters and configure each filter. Then tick the inline images filter (I think thats what its called).
THX
Thank you.. really was in need for that!
Filter Security
Does having the "create a new input type that has no input filters checked" create any form of security threat to the site when enabling the HTML button in the editor to allow other contributors to the site to past youtube/myspace style code to their posts using the OBJECT and EMBED tags (if I have those tags listed in the Allowed Tags section)?
The contributors to my site need to be able to insert such content but I am concerned that in providing them access to the HTML button that it will basically give them wide open access to my site and potentially cause terrible problems.
That is a possibility if
That is a possibility if you're allowing non-trusted people to post stuff to your site. If you're worried about that, use Full HTML instead. Some things will not be allowed, e.g. <b> and <i> elements, but simply add those to the Full HTML input format.
thanks for the
thanks for the tutorial....makes things much clearer.
...although I'm still a little confused, I've got the option to choose the drupal image plugin ....but no icon shows up?
Any thoughts?
None, I'm afraid
Some other people have mentioned the same problem, but I have never seen that myself. I did a new test install using more recent versions of these modules, and I still get the icon appearing in profile setup and when creating/editing content. The only thing I can suggest is to double-check that you have put the drupalimage plugin in the right folder (modules/tinymce/tinymce/jscripts/tiny_mce/plugins/), and have edited the plugin_reg.php file correctly - the plugin activation code must be above the
return $plugins;line.thanks...
thanks...
You Rock!
Great article. Saved me a ton of time. Thank you!! :)
mostly there
I have struggled with this combo a few times - just started upgrading a site of mine from Drupal 4.7 to Drupal 5.1 and sure enough - struggling again with this.
Adding the drupalimage folder to the tinymce js plugin folder allowed me to now see the correct icon in the profile setup for tiny - but, when i go to edit a page using tiny i see all the editor icons i have enabled EXCEPT for the img_assist one.
anyone stumble on this - as of Sept3/07 i have latest code for image and img_assist.
thanks,
peter...
Blank pop-up
Hello! I have been trying for DAYS to get drupalimage running with TinyMCE to no avail. I went step-by-step through your tutorial with a fresh install of drupal and still nothing.
Let me explain what is happening.
The TinyMCE menu appears fine and the drupalimage button is there. When I click it, it opens a pop-up just fine. However the pop-up is just a white page. I checked the source code for the pop-up and it appears like the proper code is there so I'm not sure where the problem lies.
Actually, I just checked the img_assist icon link under a non-tinyMCE field and it also showed up as a white pop-up. So I'm guessing the issue is with img_assist somewhere. Has anyone else ran into this?
Thanks
Haven't had this before
I haven't seen this problem myself, but it sounds like it could be a conflict between Drupalimage and another module - most likely one that uses javascript somewhere. Do you have modules like Lightbox or Thickbox installed?
I just noticed there is also a new dev version of img_assist out (Aug 30), so you should try that version too to see if solves the problem.
If all that doesn't work, it might be a bug in the version of img_assist that you are using, so I suggest posting an issue to the module.
Still nothing...
Thanks for the response Dave. I turned off the Thickbox module that I was using and also the "Javascript tools" module just in case. Still getting just a white pop-up.
I checked and I am using the Aug 30th version of img_assist.
When I open up the source code for the pop up, the only js scripts that are being loaded are:
In the 'node/add/page' source code, it is loading the following scripts:
as well as some inline scripts that appear to be generated by tinyMCE
Niftycube & niftylayout
Try disabling those modules too.
Out of Memory
I had this same problem at a company that I worked for, I had to up the PHP memory limit quite a lot for this problem to go away (64M I think), I suspect that it depends on the size of pictures you are uploading.
In general a blank white screen in Drupal points to an PHP out of memory error.
Images do not show in Posts
Hi,
I seem to have Tinymce working and Image_assist. I can insert an image into Tinymce editor with the toolbar icon. But it does not show as an Image it shows as a Square box with a picture of a camera in the middle.
When I Preview the post or submit it and view it on the site, I see the image titile but no Image.
Can you let me know what I have done wrong.
Thanks
Simon
Check input format
If you are still using Filtered HTML as the input format, it will not allow images to be displayed.
The square box with a camera is what you should see when you insert an image. Only when you Preview/Post the node, will you see the image.
Still can't view images
Hi Again,
Sorry to be a pain and thanks for the quick reply to my original question.
I am quite new to Drupal, so only assuming that I am doing things correct. I have checked the Imput Formats screen and gone thorugh each profile and remvoed HTML Filter from all of them.
I have found that I can veiw the pictures, but only if I dont select the option to insert the picture as a Thumbnail. I have to insert it as full size, however, I think that because of my settings restricting full size images, it still inserts as a Thumbnail.
This will cause problems though for my users, who will want to use the thumbnail option.
Any ideas of what may be wrong.
Thanks
Simon
image assist
I followed your instructions and I still didn't get the image assist icon in my tinymce, I also added advanced image from the tools menu but it is not showing up either.
Any ideas?
Thanks for a good tutorial.
/Chris
Make sure you put the
Make sure you put the drupal_image plugin the right folder. Also, check the plugin_reg file to ensure that you left in the closing code. There should be nothing after this code:
return $plugins;}
Unable to Add image
I managed to get the thru all and I have the Add Image icon both in the toolbar and below the text area. But when I click on the icon in the toolbar it gives me: 'Page cannot be found error'. While the icon can show my images and even upload, but when I click insert, it shows 'Error on page' in the status bar. Any idea to this prob? Thanks in advance.
Add image
I had the same problem. I did not have the "Image" module(s) installed. Ended up deleting the img_assist and drupalimage subdirectories, installing the Drupal Image module, enabled the Image module(s) and reinstalled the img_assist module. It worked! Note that I had to delete the img_assist and drupaleimage subdirectories first! I don't know why but it did not work until I did. After that, the instructions on this (extremely helpful) site worked like a charm. Good luck.
corrupted installation?
It sounds like your install might be corrupted somehow, or maybe you have some kind of pop-up blocker. You might also be blocking some javascript. First, try re-copying all the module and TinyMCE files to see if that fixes the problem. You should also check your browser - try Firefox if you're not using it yet.
Other than that - I don't really know.