michaelfrank/dynamicphoto

Dynamic photo package for blog posts and other features, integrating CKEditor Smart WYSIWYG

v1.5.0 2020-03-23 22:51 UTC

MIT

• Michael Frank

README

Dynamic Photo is a package to assist in integration with CKEditor, a powerful WYSIWYG. With the package it is possible to send photos dynamically to the server and display them.

✔️ Installing Dynamic Photo

❗️ Attention ❗️

this package is exclusive for Framework Laravel, So you will also need Composer.

composer require michaelfrank/dynamicphoto

...Then publish the provider package.

php artisan vendor:publish --tag=config

✔️ Instalando CDN CKEditor

In your VIEW in the script file, paste!

<script src="https://cdn.ckeditor.com/ckeditor5/16.0.0/classic/ckeditor.js"></script>

👇🏼 Now paste the code below

ClassicEditor.create( document.querySelector( '#editor' ), {
  ckfinder: {
    uploadUrl: '{{$siteRoot}}/api/uploud-photo',
  }
} ).then( editor => {
  console.log( 'Editor was initialized', editor );
  myEditor = editor;
})
.catch( error => {
  console.error( error.stack );
});

❗️ Attention ❗️

in uploadUrl, just modify your route url if you create a different route.

👇🏼 With that, just create a div with the id = "editor" that will be initialized!

<textarea name="" id="editor"></textarea>

Now you just need to create an Api route to send the image data that will be automatically displayed!

=======================

✔️ Creating controller and API route.

You now need to create your API route. Paste this code in your "api" file.

Route::post('/uploud-photo', 'APIs\UploudImages@uploud');

👇🏼 With the route created, run the command below to create the Controller.

php artisan make:controller APIs/UploudImages

Navigate to the created APIs / UploudImages.php file, Open the file.

Now just instantiate the class.

use michaelFrank\dynamicphoto\config\CkeditorUploud;

✔️ How to use

Paste this function into your class.

public function uploud(Request $req){
  $file =  new CkeditorUploud();
  $saved = $file->uploadAction($req, 'Album01');
  return $saved;
}

The uploadAction function expects two arguments. the first is the request file, ie the image. The second will wait for the path, where 'Album01' will be the path where you will save your image

========== Help me, any value will be great for my work. This is your way of thanking. Thanks!