Super Sale Limited Time 50% OFF for All-Access Plans
Save 50% Now

Quill JS: How to add module for Quill Image Resize


I am trying to add a module for Quill JS to enable resize on the images imported editor. I am using the Quill Image Resize module.

Anyone has a sample working code?


Text formatting options
Submit
Click any option to insert into your comment. Select text first to wrap it.
  • **text** to make things bold
  • *text* to emphasize
  • ### Heading to make headings
  • [link text](url) for links
  • ![alt text](image-url) to paste in an image
  • - item to make a list
  • 1. item to make an ordered list
  • > quote to quote somebody
  • `code` for single line of code
  • ```js ... ``` for JS code block
  • ```html ... ``` for HTML code block
  • ```scss ... ``` for SCSS code block
  • ```php ... ``` for PHP code block
  • --- for a horizontal rule
  • happy  :)
  • shocked  :|
  • sad  :(

Replies (6)


Hi Joer John

In Metronic v8 Laravel, the Quill already included.

You can find the quill path in /starterkit/resources/mix/plugins.js

When you run "npm run dev" command, the assets should build into this folder:
public/assets/plugins/global/plugins.bundle.js

The plugins.bundle.js file will be imported globally.



Hi Faizal,

I am encountering error saying "Quill Image Resize module not loaded".

How do I make the ImageResize available on global scope?

I am installing the Node Module via Yarn.



Hi Joer John

Sorry for the delay. Please check this example implementation.



Hi Faizal,

Yes, I am using Metronic Laravel v8. I don't have any problems on how to use Quill. I wanted to have image resize module on Quill.

Do you have any sample that has image resize module for Quill?



Hi Joer John

May I know if you are using Metronic Laravel v8? You can find example quill usage in this file. Quill already included in the package.

/starterkit/resources/_keenthemes/src/js/custom/apps/ecommerce/catalog/save-product.js

Thanks



How to I import the Quill Image Resize module package on my custom page script?


Text formatting options
Submit
Click any option to insert into your comment. Select text first to wrap it.
  • **text** to make things bold
  • *text* to emphasize
  • ### Heading to make headings
  • [link text](url) for links
  • ![alt text](image-url) to paste in an image
  • - item to make a list
  • 1. item to make an ordered list
  • > quote to quote somebody
  • `code` for single line of code
  • ```js ... ``` for JS code block
  • ```html ... ``` for HTML code block
  • ```scss ... ``` for SCSS code block
  • ```php ... ``` for PHP code block
  • --- for a horizontal rule
  • happy  :)
  • shocked  :|
  • sad  :(
Text formatting options
Submit
Click any option to insert into your comment. Select text first to wrap it.
  • **text** to make things bold
  • *text* to emphasize
  • ### Heading to make headings
  • [link text](url) for links
  • ![alt text](image-url) to paste in an image
  • - item to make a list
  • 1. item to make an ordered list
  • > quote to quote somebody
  • `code` for single line of code
  • ```js ... ``` for JS code block
  • ```html ... ``` for HTML code block
  • ```scss ... ``` for SCSS code block
  • ```php ... ``` for PHP code block
  • --- for a horizontal rule
  • happy  :)
  • shocked  :|
  • sad  :(