Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Icon is not displayed when using additional plugins on CDN. #895

Closed
sin-to-jin opened this issue Jul 2, 2020 · 1 comment
Closed

Icon is not displayed when using additional plugins on CDN. #895

sin-to-jin opened this issue Jul 2, 2020 · 1 comment

Comments

@sin-to-jin
Copy link

sin-to-jin commented Jul 2, 2020

ENV

For example, use the plugin at this link (https://ckeditor.com/cke4/addon/youtube).

<!-- applition.html.erb -->
<head>
  <%= javascript_include_tag Ckeditor.cdn_url %>
  <%= javascript_include_tag 'application', 'data-turbolinks-track': 'reload' %>
</head>
<body>
  <%= form url: 'hogehoge', local: true, multipart: true do |f| %>
    <%= f.cktext_area :ck_sample_text %>
  <% end %>
</body>
// application.js
//= require_tree ./ckeditor

Current directory structure

├── app
   ├── assets
      ├── javascripts
         ├── application.js
         ├── ckeditor
            ├── config.js
            ├── plugins
               └── youtube
                   ├── images
                      ├── icon-hdpi.png
                      └── icon.png
                   ├── lang
                      └── en.js
                   └── plugin.js

The following error occurs when accessing the browser

ckeditor.js:101 GET http://cdn.ckeditor.com/4.11.3/standard/plugins/youtube/images/icon.png?t=J1QB 404 (Not Found)

CKEDitor is displayed normally and there is no problem in behavior, but the image of the added plug-in gives a 404 error.
I can hack the plugin I added and display the image, but I would like to know if there is a standard way.

To put it another way, I put an image that was not displayed in the image directory under Rails assets, and changed the loading path of the image on the plugin side to the image under the image directory under Rails assets.

Placement of images

// before
├── app
   ├── assets
      ├── javascripts
         ├── application.js
         ├── ckeditor
            ├── plugins
               └── youtube
                   ├── images
                      └── icon.png

// after
├── app
   ├── assets
      ├── images
         └── youtube-icon.png

Change the path of js plugin

(function () {
	CKEDITOR.plugins.add('youtube', {
// abridgement
			editor.ui.addButton('Youtube', {
				label : editor.lang.youtube.button,
				toolbar : 'insert',
				command : 'youtube',
				// icon : this.path + 'images/icon.png'
				 icon : '/assets/youtube-icon.png'
			});

Operationally, there are no errors and the image is displayed normally, but this method is not correct by nature, so please tell me if there is an accurate method.

@sin-to-jin
Copy link
Author

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant