Problem with tinymce and image assist - no camera icon
| Project: | TinyMCE |
| Version: | 6.x-1.x-dev |
| Component: | User interface |
| Category: | support request |
| Priority: | normal |
| Assigned: | Unassigned |
| Status: | closed |
I have found some issues in the past with tinymce and image assist but i never found a solution...
The problem i have is the following:
I installed tinymce 5.x-1.9 and installed tinymce 2.1.3 (because i read there are problems with 3.1.1 and image assist).
I followed the install for the image assist plugin (put the drupalimage in the plugin folder of the tinymce/tinymce/..../plugin folder.
I added the drupalimage code to the php file of the tinymce module (as described in the install).
When i go to the admin and edit the profile i see the camera in the list of buttons so i enabled it.
When i go to a page where the tinymce is enabled, i don't see the camera button. I do get a javascript error "object doesn't support this property or method"
I have found something about the tinyMCE.getEditorId function, that this could cause the problem?
THe javascript that gives the error is following snapshot:
img_assist = document.getElementById('img_assist-link-edit-body');
if (img_assist) {
var img_assist_default_link = img_assist.innerHTML;
if ('yes' == 'yes') {
img_assist.innerHTML = tinyMCE.getEditorId('edit-body') == null ? '' : img_assist_default_link;
}
else {
img_assist.innerHTML = tinyMCE.getEditorId('edit-body') == null ? img_assist_default_link : '';
}
}I also notice that no mather how i configure the tinymce, i always get an icon from the image assist underneath the tinymce. I read that when normally you shouldn't see that icon if the tinymce is enabled and if you disable it, the icon should appear... Well, i always see the icon, no mather how i configure the tinymce module.
But i never see the camera button in the tinymce toolbar.
Is there a solution for this or what can i do to make this work?
#1
Try to replace the TinyMCE module with the Wysiwyg module, it works with TinyMCE 2 as well. Download development snapshots of both Wysiwyg and Image Assist. Don't forget to read the Wysiwyg readme. Install and configure everything as wished (and as suggested in the readme), go to edit or create a node and don't forget to refresh the page. Now you should see the camera button in TinyMCE and no Image Assist icon under the text area. If some strange characters appear instead of text in TinyMCE popups, refresh the popups as well (Ctrl+R usually helps).
#2
Works for me in Mozilla FF2.
What is your browser ?
#3
jacker - Thanks for getting folks pointed in the right direction here. There were a few extra steps to get the whole thing working with tinyMCE and Drupal 6.x (in my case, 6.6) running on a LAMP stack:
1) Download and install the Wysiwyg and Image Assist modules as indicated above (don't forget that Image Assist requires the Image module), but don't install tinyMCE as indicated in the Image Assist instructions. Activate both modules and set up user access.
2) Download the most recent version of tinyMCE 2.x.x (NOT version 3), extract and place in the Wysiwyg module directory. It should now appear on the Wysiwyg module configuration page. Copy the drupalimage folder that is inside the Image Assist module directory to the tinyMCE plugins directory (tinymce/jscripts/tiny_mce/plugins).
3) Open the tinymce.inc file inside the wysiwyg/editors directory, and add the following lines to the plugins array before the final return statement near the bottom of the file:
'drupalimage' => array('path' => $editor['library path'] .'/plugins/drupalimage',
'buttons' => array('drupalimage' => t('Drupal Image')),
'extended_valid_elements' => array('img[class|src|border=0|alt|title|width|height|align|name|style]'),
'url' => 'http://drupal.org/project/img_assist',
'internal' => TRUE,
'load' => TRUE,
)
This loads the plugin when tinyMCE initializes.
4) Open the img_assist.module file inside the imgassist module folder. Change the tinymce_path inside the img_assist_loader function to:
$tinymce_path = drupal_get_path('module', 'wysiwyg');This fixes the path to tinyMCE in the Image Assist module.
5) Go back into the Wysiwyg editor configuration page and activate the Drupal Image button for each Input Format under configure > Buttons and plugins
You should now see the Drupal Image camera icon on all tinyMCE menu bars.
#4
To be honest I like the Wysiwyg better than TinyMCE.
That said I'm still having a problem with the Camera icon not showing up. There is a Drupal Image check box but no icon. When I choice the option and try to create content there is no icon or text to open image assist.
Any idea why the icon is not showing up?
#5
Insightdesigns,
Thank you for your instructions. I'm a little concerned with your comment
of Tinymce. I don't seem to be able to locate a non "3" version. Will 3.xx not work with WYSIWYG? If not, do you have a link for a version 2.xx?
Thanks,
Ben
#6
Current status on implementing WYSYWYG, Image Assist, and Tinymce
I've got WYSYWYG working with Tinymce, per your instructions (thank you very much :)
However, I was unable to add your snippet of code to tinymce.inc. I am no php'er, so I simply tried pasting the snippet before the various brackets prior to the final return without any luck. When I eliminated the snippet, the editor appears to be working. What does the snippet do? And if you can specifically direct me on where to paste it in to the code I'm sure that would help.
The Image Assist camera icon is there below the text field, but it won't insert an image. I have tried going with "HTML code" and Full HTML enabled, as well as Filtered Tag, without success.
The native "Insert Image" icon is there in the WYSYWYG toolbar, and it works as well, but only to reference images already uploaded to the server. I would like for my users to be able to add images to their pages without needing to know how to FTP and reference the file's location.
Perhaps the solution lies in getting your snippet properly implemented in tinymce.inc. Maybe it has to do with the fact that I'm trying to do all this with Tinymce 3.2.1, contrary to your direction, but I can't find a 2.x.x version. If your snippet is the answer, thank you very much for providing me with it. I wonder why it isn't there to begin with?
Again, thanks for your time in helping with this.
Ben
#7
Ben-
Have you gotten your answers yet?
In case not, links to tiny 2: here and here.
You can put the code snippet after a
),in the list toward the end of tinymce.inc, and add a comma after the last parenthesis. It should follow the pattern of the code above it.#8
Hello Anniekin,
I downloaded and installed TinyMCE 2.x.x, thank you. I have got it all working now with one exception - the buttons aren't showing up in the WYSIWYG tool bar, just text links (see attachment). I've been able to test the image insert function using the text links that are where the buttons should be, and it works. The buttons do show up in the WYSIWYG admin config area, so I know that I'm close.
Here is how I inserted insightdesigns code into tinymce.inc:
'table' => array('path' => $editor['library path'] .'/plugins/table',
'buttons' => array('tablecontrols' => t('Table')),
'url' => 'http://wiki.moxiecode.com/index.php/TinyMCE:Plugins/table',
'internal' => TRUE,
'load' => TRUE,
),
'drupalimage' => array(
'path' => $editor['library path'] .'/plugins/drupalimage',
'buttons' => array('drupalimage' => t('Drupal Image')),
'extended_valid_elements' => array('img[class|src|border=0|alt|title|width|height|align|name|style]'),
'url' => 'http://drupal.org/project/img_assist',
'internal' => TRUE,
'load' => TRUE,
),
);
if ($editor['installed version'] > 3) {
$plugins['safari'] = array(
'path' => $editor['library path'] .'/plugins/safari',
'extensions' => array('safari' => t('Safari compatibility')),
'url' => 'http://wiki.moxiecode.com/index.php/TinyMCE:Plugins/safari',
'internal' => TRUE,
'load' => TRUE,
);
}
return $plugins;
}
Thanks again for your help!
#9
Thanks for the step by step instructions... I followed everything but I still do not have a camera icon to choose from on the wysiwyg configure tab.
I noticed the following differences during my setup:
* Your Step 4 was already done on my file. I checked several times but this step was already completed.
* In step 5 the camera icon is not an option. I also see Teaser & Page Break icons but they will not show on the editor menu.
My Versions:
Drupal 6.9
TinyMCE 2.1.3
WYSIWYG 6.x-1.x-dev (2009-Jan-24)
Image Assist 6.x-3.x-dev (2009-Jan-18)
Image 6.x-1.0-alpha4
#10
When I add the code suggested in 3) to tinymce.inc I get the following error message:
Parse error: syntax error, unexpected T_CONSTANT_ENCAPSED_STRING, expecting ')' in /var/www/vhosts/syn.mur.at/cms/sites/all/modules/wysiwyg/editors/tinymce.inc on line 517
line 517 looks like this:
'path' => $editor['library path'] .'/plugins/drupalimage',any suggestions how to make amendments?
best,
chris
#11
the error was due to wrong character encoding on my mac. still there is no camera icon in my menu bar.
#12
This was a problem for me, I think because I had tried the latest 3.x version of img_assist and 2.x version of wysiwyg. However, now things are working fine with the following setup:
Drupal 6.9
WYSIWYG 6.x-1.0
Image Assist 6.x-2.0-ALPHA2
Image 6.x-1.0-alpha4
This is the "passive users" setup from http://drupal.org/node/358296
No editing of any files or creation of symlinks were necessary.
This setup has been tested with FireFox 2.x and 3.x on Linux.
If this setup works for people on Macs and Windows, I suggest this issue is marked as "Fixed".
#13
So any solution for this yet?
Using TinyMCE 2, Latest Image Assist and latest WYSIWYG API.
No camera icon in the tinymce editor.
#14
Update!
Worked when updating to the newest beta version of WYSIWYG API.
But Image Assist doesnt work in IE7 but works in Firefox 3.
And when inserting images after uploading nothing happens, no images gets inserted.
GAH!
#15
@JohnnyHa: please could you post the precise version numbers of Drupal, Image Assist, Image and wysiwyg that you are using?
If you are using the wysiwyg API you should be using tinymce 3.x, not 2.x.
Does the "passive users" setup from http://drupal.org/node/358296 work for you?
#16
Moved away from using TinyMCE and using Fckeditor instead which works great, except well you guessed it . Image Assist again. So many weird errors.
If i copy the content of image_assist_textarea.js into image_assist_fckeditor.js the image assist loads in a new pop up and works, except when i select insert and the image doesnt get inserted cause of an hover over an object that is invisible error. Ive spent 1 week now with every version of tinymce and fckeditor and image assist, and yet i dont have had an editor working 100% with image assist yet. I have moved away from wysiwyg api as well as it gives so many weird errors. So using the fckeditor module now but wont insert image with image assist.
#17
I'm closing this issue now, as I don't think the tinymce project is maintained any more, so no developers are likely to be taking note of this thread. If there are still people affected by this issue, I suggest they open an issue in the img_assist or wysiwyg queues.
#18
This module works with Excerpt but not with Img_Assist. And no more development.
WYSIWYG don't work with Excerpt and will probably not.
Bad news for me. I upgraded to Drupal 6. But now not usable. I thought I made all tests but there is always a tiny issue that breaks all.
I have to wait for a working WYSIWYG editor.