CKEditor Base Path

[ridexbuilder]

When inserting images within a CKEditor area, the image is referenced from the Admin directory, whereas it should be from the directory above.
The consequences are that putting in a relative filename path eg. images/thumbs/myproduct.jpg cannot be viewed whilst in Admin. (works fine on shop front, though)
Have been trying to find a method to resolve this, such as

config.baseHref = '../';

in /catalog/admin/includes/javascript/ckeditor/config.js to no avail.

I haven't yet tried:

config.baseHref = <?php echo CATALOG_DIR ?>;

as unsure if syntax is even close!

[michael_s]

Only if you don't enter in the correct path.

For instance, say my catalog is located in /shop_oscmax and I want to add an image. All I do is add the image to the URL box like this:

/shop_oscmax/images/thumbs/myimage.png

and it will properly show in both the admin and front end. Simple.

I think you can specify the base path as:
/shop_oscmax/images

Then all you would have to do is specify where in the images dir or subdir the file is.

/thumbs/myimage.png.


For v2.1, once I commit a file manager, all becomes irrelevant as the filemanager already properly handles this. It works really well too. Just have to get some of the kinks with security worked out.

[ridexbuilder]

/shop_oscmax

Not a relative path - absolute!

[michael_s]

I was just showing you the right way to do this.

A relative path cannot work because it will always be relative to either the catalog or the admin which are different. The relative path from the catalog is always going to be different from the relative path from the admin panel, so it cannot ever work if you use a relative path. Since you need it to work from two different locations that have two different relative paths, you must use and absolute path. No choice here.

You would need two different relative paths. From the admin it would be:

../images

but from the catalog if you use ../images it puts you up the tree one level too high, out of your catalog dir and into your home dir, so the path is wrong.

The correct relative path for catalog would just be:
./images

As you can see they are mutually exclusive relative paths. The solution? Use an absolute path.

That is where base_href comes in. Set that to absolute to your shop root:

/shop_oscmax/

Then you can use a relative path to the image in the editor:

images/myimage.png

then it should work.

[ridexbuilder]

As the Editor should always reference images with respect to the catalog directory (not Admin - no reason to), I have to agree to disagree on this subject.
It is bad practice to use absolute path names, except for key configuration values - which this isn't.
Your suggestion enforces a fixed directory structure.

[michael_s]

Your suggestion enforces a fixed directory structure.

My suggestion is to enter the absolute path or url into the URL box of the ckeditor to match your system when you are adding the image, not hardcode anything or change anything in the editor.

This allows the greatest flexibility as you can simply add the image based on whatever your system path is, whatever that may be. It will work on any server anywhere, no matter what the actual path is. As long as you type it in correctly, it works perfectly.

You are not locked into anything. You can then specify any path to anywhere on your server. If you want to specify an image outside of your catalog path, you can do that too. Or a remote url.

My primary point is that you cannot specify a relative path to the /catalog/images directory that works for both catalog and admin panel. It can't be done because the relative paths are different.

[ridexbuilder]

As the Editor should always reference images with respect to the catalog directory (not Admin - no reason to), I have to agree to disagree on this subject.

I stand on this point. There should (might be) a method to specify an image base to which the Editor refers.

[michael_s]

Yes, that is what the base.href is for.

As per the ckeditor documentation this is how it is set:

<static> {String} CKEDITOR.config.baseHref Since: 3.0
The base href URL used to resolve relative and absolute URLs in the editor content.
config.baseHref = 'http://www.example.com/path/';
Default Value:
'' (empty string)

Note that it is a Base URL.You have to work within the bounds of the software/environment you have a hand. This is just how it is with ckeditor. They have a single setting for the base.href, it must be a url or it will not work. Use it to set the base path to the catalog folder.

You can stand on principle and have your images not working as they currently are, or you follow ckEditors docs and specify the base.href and get your images working.