I've been searching this forum and the API for a couple of hours now, looking for a way to do this. I found a offtopic post about this, but no replies (probably because it is offtopic).
My custom image browser allways had the option to use the thumbnail and add a hyperlink to the original image. I did this in FCKeditor with the following code:
After some searching and trying I finally got my image browser for CKEditor working. (I used the documentation, which doesn't work, and then found the solution in the forums, adding window.opener)
So I already have the image in the CKEditor, but now I need to add the hyperlink. I could call the textbox directly using id "351_textInput", but since the id is dynamically assigned and can change when adding or removing plugins, this is no option.
I have been searching in the forums, and I found some posts on how to insert a html element directly into the editor. But I am confident that this is not the way to go. First of I can't find a way to see if there is already an existing link around the image. I also don't know if the image has already been created. Because if it hasn't yet been created then you will need to make sure that when you add the hyperlink the image will be inserted between the <a></a> tags.
Does anyone know of a function to directly access the hyperlink in the image properties window?
My custom image browser allways had the option to use the thumbnail and add a hyperlink to the original image. I did this in FCKeditor with the following code:
window.opener.sActualBrowser = 'Link';
window.opener.SetUrl( theImage.src );
window.opener.GetE('cmbLnkTarget').value = '_blank';
window.opener.GetE('txtBorder').value = '0';
After some searching and trying I finally got my image browser for CKEditor working. (I used the documentation, which doesn't work, and then found the solution in the forums, adding window.opener)
So I already have the image in the CKEditor, but now I need to add the hyperlink. I could call the textbox directly using id "351_textInput", but since the id is dynamically assigned and can change when adding or removing plugins, this is no option.
I have been searching in the forums, and I found some posts on how to insert a html element directly into the editor. But I am confident that this is not the way to go. First of I can't find a way to see if there is already an existing link around the image. I also don't know if the image has already been created. Because if it hasn't yet been created then you will need to make sure that when you add the hyperlink the image will be inserted between the <a></a> tags.
Does anyone know of a function to directly access the hyperlink in the image properties window?
Re: Add a hyperlink to an image from the custom image browser
The function that's passed gets executed. It checks if this is an image dialog and then it sets the border size to 0, the link url to the big image and the target combobox to "_blank".
window.opener.CKEDITOR.tools.callFunction( txtCKEditorFuncNum, thumb_url, function() { // Get the reference to a dialog. var element, dialog = this.getDialog(); // Check if it is an Image dialog. if (dialog.getName() == 'image') { // Get the reference to a field that holds the "border size". element = dialog.getContentElement( 'info', 'txtBorder' ); // Assign the new value. if ( element ) element.setValue( '0' ); // Get the reference to a field that holds the "url". element = dialog.getContentElement( 'Link', 'txtUrl' ); // Assign the new value. if ( element ) element.setValue( theImage.src ); // Get the reference to a combobox that holds the "target". element = dialog.getContentElement( 'Link', 'cmbTarget' ); // Assign the new value. if ( element ) element.setValue( '_blank' ); } });