Hi, I know this has been requested before, but I would like to know if there exists some way of making image-captions using fck-editor?
Right now I'm using FCK with IMCE and this module does not support captions. My client really needs that functionality, and I have been trying to find some workaround for this without luck.

Thing is, I can make a caption with css if i hardcode it into the the textarea, but my client is not css/html-savvy so I need to find a way to make her able to write an image-caption in a simple way.

Any ideas? Maybe by using fck with some other plugin?

cheers!

Comments

ontwerpwerk’s picture

ontwerpwerk commented

FCKeditor at the moment cannot do this.

Have you considered doing this in the content creation kit with a node type that has an image field?

robotjox’s picture

robotjox commented

I just submitted another support request about modifying the html output, because that might solve my problem, but feel free to close it, if that seems to much like a dublicate request -sorry if that is the case!

Yeah, I have tinkered a bit with cck, and that might be a solution, but it just seems a bit like overkill to make a new content type just because you need a little caption beneath each picture - oh well, if that is the only way, so be it :)

thanks for answering, though!

ontwerpwerk’s picture

ontwerpwerk commented
Status: Active » Closed (works as designed)

I believe it will be even more overkill to make a FCKeditor plugin to do the same - especially when drupal is alreay capable of it. (making a plugin for FCKeditor is a complicated process, and will surely take more time than implementing a cck solution)

robotjox’s picture

robotjox commented

Oh, I completely agree - I'm not suggesting a new plugin.

It's just that adding images with IMCE through FCK works extremely well, and my clients love it. If I were to build a new CCK content type (which I already have btw) the image upload would be separated from the FCK textarea and it would also not be possible for editors to place their image to their liking. This is a pretty big inconvenience in my opinion, and I would rather have the great FCK/IMCE-combo handle the images.

I just can't believe that there is no way to cheat the editor into using maybe the alt-tag ot the title-tag as an image caption.

Please don't take this as a critique of this excellent module!

ontwerpwerk’s picture

ontwerpwerk commented

modifying the IMCE output might be a better idea then

if you make IMCE output HTML with an image, title and caption you would have the result you need (as long as your HTML filter is set to accept all codes)

robotjox’s picture

robotjox commented
Status: Closed (works as designed) » Closed (fixed)

hehe, and the IMCE maintainer says that FCKeditor output needs to be changed ;)

anyhow, somebody found a solution using unobtrusive javascript. Take a look: http://lab.arc90.com/2006/07/image_caption_1.php

very nice, I think - thanks for listening to my rambling, though :)

skchow’s picture

skchow commented

I tried using the arc90 script provided from the followup above and it seemed to work quite well. Besides the instructions listed on the webpage, some configuration steps in TinyMCE in addition to some changes in the script provided by arc90 were necessary to be made to make everything work out.

1. Turn on Advanced Images on TinyMCE.
2. TinyMCE > CSS add Image = imgcaptions as a new class to be shown. At this point, inserting an image through TinyMCE and selecting "imgcaptions" as the class will give the image a caption when rendered.
3. However, aligning the image through TinyMCE either left or right will throw off the formatting. I added the following code to translate the align attribute into the floatl or floatr class used by the script:

function arc90_imgcaption() {
var O = document.getElementsByTagName('P'); // For safari???
for (var i = 0, l = O.length; i < l; i++)
  O[i].appendChild(arc90_newNode('span'));

var O = document.getElementsByTagName('IMG');
for (i = 0, l = O.length; i < l; i++) {
  var o = O[i];
  if (o != null && o.className && o.className.indexOf('imgcaption') >= 0) {
  try {
    /* In case the image has a left or right align.  If so change to float[l|r] */
    if (o.align != ""){
      if (o.align == "right"){
        o.className = o.className + ", floatr";
      }
      if (o.align == "left"){
        o.className = o.className + ", floatl";
      }
      o.align = "";
    }
 ...

Hope this helps.

davidwhthomas’s picture

davidwhthomas commented

See my Image Caption module at:

http://drupal.org/project/image_caption

:-)