Web Yurt TinyMCE Image Uploader and Manager Plugin

COMMENTS

1. Davide
   February 28, 2021, at 4:31 pm REPLY

   This is the best free script, very well coded and easy to personalize...Thanks so much for this.I will send you some add-on to the script (different directory in the folder root) and compatibility with bootstrap library.

1. Stéphane Rousset
   March 7, 2021, at 6:41 pm REPLY

   This looks great and the demo is quite nice. However, here comes the dumb question of the day: how do you "hook" that plugin to TinyMCE in WordPress? When I click on the "Insert/edit image" button in TinyMCE, or I used the Insert menu and I choose Image, I see nothing of the Web Yurt Image Uploader.

   I've put the wy_image_manager folder in public_html, the images folder is at the top level within wy_image_manager (exactly as it is in your Zip file), I haven't changed config.php

   But how can TinyMCE know that it should invoke your plugin?

   Best regards, Stéphane

   P.S.: I warned you: it's probably a pretty basic/trivial/dumb question! Sorry for that.

• Babar
  March 14, 2021, at 6:19 pm REPLY

  You will need to tell TinyMCE where the external plugin is located. Here is the plugin location:

  webyurt_image_manager/js/tinymce5/external_plugins/wyimagemanager/plugin.js

  TinyMCE code to invoke the plugin is provided in index.php file.

  tinymce.init({
  ........
  	external_plugins: {
  		'WYImageManager': '/wy_image_manager/webyurt_image_manager/js/tinymce5/external_plugins/wyimagemanager/plugin.js'
  	},
  	file_picker_callback: function (callback, value, meta) {
  		OpenWYImageManager(callback, value, meta);
  	}

  so you need to change the external_plugins path within tinymce.init({ code in wordpress for TinyMCE to recognise the plugin.

  I hope this helps.

1. Bamk
   April 6, 2021, at 12:25 am REPLY

   It work fine , but when i change editor language, i get an error

1. Ata
   February 23, 2022, at 8:39 pm REPLY

   hi all,thanks for the plugin, this is currently the only one that does what i need, nothing more.however, i have a weird situation, which i cannot solve.

   where i'm initializing tinymce (v5), although i give the "external_plugins" init option it's correct value (i can see the plugin.js loaded in network tab), whenever the file picker is triggered, i will receive a js error saying "OpenWYIMageManager is not a function".i could only circumwent this, when i copied the function definition from plugin.js to the page where i'm initializing tinymce. however, the rest of the plugin.js IS WORKING, as the shortcut is registered to the editor... so, any thoughts on this maybe?

• Babar
  March 12, 2022, at 2:39 pm REPLY

  Try changing the function name to OpenWYImageManager with lower case 'm' instead of upper case 'M'

1. Reynald MOREL
   March 4, 2022, at 10:46 am REPLY

   Hello,

   Great work!

   It works very well but I have a problem after adding the French language for tinyMCE.

   I can't resize the image before inserting it.

   If you have an idea ....

   Thanks a lot

1. Mohamed abdel Moaty
   March 23, 2022, at 10:39 pm REPLY

   how to insert image to text input not TinyMCE

1. Gordon
   January 17, 2023, at 11:50 am REPLY

   Hi Just came across this and it's excellent, thank you. Is there any chnace of having different folders in to hold the images?

1. Chad
   September 4, 2024, at 2:25 pm REPLY

   Late to the game, it's still amazing MCE doesn't have this built in even in late 2024.This still available to download - the link doesn't work.Thanks! Chad

• Babar
  September 4, 2024, at 8:51 pm REPLY

  Thanks for pointing that out! I’ve updated the link, so you should be able to download it now.

1. Joe
   September 21, 2024, at 11:35 pm REPLY

   I am sure its a great plugin if you know how to install it.

   The demo is exactly what I am looking for but unfortunately it's been no fun for me.

   One person said "You will need to tell TinyMCE where the external plugin is located. Here is the plugin location:..."

   What????

   Can someone explain in laymen's terms how to install this?

• Babar
  September 22, 2024, at 12:22 pm REPLY

  The demo works out of the box, but make sure the 'wy_image_manager' folder is placed in the root directory of your website (e.g., yourwebsite.com/wy_image_manager/).

  Also, ensure the TinyMCE config includes this line:

  external_plugins: {'WYImageManager': '/wy_image_manager/webyurt_image_manager/js/tinymce5/external_plugins/wyimagemanager/plugin.js'}

  This ensures the plugin loads from the correct path.

1. Joe
   September 22, 2024, at 2:17 pm REPLY

   Hi Babar, Thank you so much for responding to my issues. I have installed the 'wy_image_manager' folder in the root directory but there is no config file in TinyMCE that I am using. Maybe I am using a different version of TinyMCE. I am using the Advanced Editor Tools that is pointed to when you search to download TinyMCE. I can't find any config file in this version. Where can I download the version you are using?

• Babar
  September 22, 2024, at 5:48 pm REPLY

  Hi Joe,

  Did you download the plugin from the link above? If not, you can download it from this link. The config.php file is included in the download.

  You can refer to this tutorial as well for additional guidance. How to Add an External Plugin to TinyMCE v5