tinymce text editor upload image issue

0
votes

I have integrated TinyMCE text editor into a blog I am using. It is coded using PHP and HTML. The blog works, but I noticed that when I upload a image, it displays in TinyMCE but on the front end the image and text underneath does not display. Looking at the source code it looks like the images are being encoded as I see the following in the source code: 

<img src="data:image/jpeg;base64,/9j/4QAYRXhpZgAASUkqAAgAAAAAAAAAAAAAAP/sABFEdWNreQABAAQAAABkAAD/4QMraHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wLwA8P3hwYWNrZXQgYmVnaW49Iu+7

Can anyone help please?

1
tinymce
How are you inserting these images into the content? - Michael Fromin
I am not sure to be honest as just click browse server button and added the image from my computer I have changed to ckeditor and elfinder but having a issue with that now - Ian Haney

1 Answers

0
votes

If you are using a local file picker to insert images into TinyMCE you get a Base64 encoded reference to that local image when its inserted into the editor. You typically don't want to keep that Base64 image due to size and performance issues when rendering such images at runtime. This documentation explains how to have TinyMCE process these images and turn them into "regular" images in real time when the image is inserted:

https://www.tinymce.com/docs/advanced/handle-async-image-uploads/

That process would get triggered as soon as you insert the image. You can also look at tools like MoxieManager that have a UI built to handle this entire process for you.