# Integrating CKEditor 5 with Laravel from CDN You can add CKEditor 5 to a [Laravel](https://laravel.com/) application by loading the editor from the CKEditor 5 CDN and including it on the page. There is no official Laravel integration, but because the CKEditor 5 HTML editor is a pure JavaScript/TypeScript library, it runs in any environment that serves such assets, including the PHP-based Laravel. > **Create your own CKEditor 5** > > Check out our interactive Builder to quickly get a taste of CKEditor 5. It offers an easy-to-use user interface to help you configure, preview, and download the editor suited to your needs. > > * editor type, > * the features you need, > * the preferred framework (React, Angular, Vue or Vanilla JS), > * the preferred distribution method. > > You get ready-to-use code tailored to your needs! > > [Check out our interactive Builder](https://builder.ckeditor.com/?redirect=docs) ## Setting up the project This guide assume you have a Laravel project. You can create a basic Laravel project using [Composer](https://getcomposer.org/). Refer to the [Laravel documentation](https://laravel.com/docs/10.x/installation) to learn how to set up a project in the framework. ## Using from CDN > **Note** > > To use our Cloud CDN services, [create a free account](https://portal.ckeditor.com/checkout?plan=free). Learn more about [license key activation](../../licensing/license-key-and-activation.md). The folder structure of the created project should resemble the one below: ``` ├── app ├── bootstrap ├── config ├── database ├── public │ ├── .htaccess │ ├── favicon.ico │ ├── index.php │ └── robots.txt ├── resources │ ├── views | ├── welcome.blade.php | └── ... ├── routes └── ... ``` First, modify the `welcome.blade.php` file in the `resources/views` directory to include the CKEditor 5 scripts and styles. All necessary scripts and links are in the HTML snippet below. You can copy and paste them into your template. Open-source and premium features are in separate files, so there are different tags for both types of plugins. Add tags for premium features only if you use them. ```html CKEditor 5 - Quick start CDN

Hello from CKEditor 5!

``` Both previously attached scripts expose global variables named `CKEDITOR` and `CKEDITOR_PREMIUM_FEATURES`. You can use them to access the editor class and plugins. In our example, we use object destructuring (JavaScript feature) to access the editor class from the open-source global variable with a basic set of plugins. You can access premium plugins from the other variable the same way. Then, we pass the whole configuration to the `create()` method. Be aware that you need a proper [license key](../../licensing/license-key-and-activation.md) to use premium features. ```html ``` Now, we need to put our script in the previous template. We need to put the script under the `
` element, so the editor can attach to it. Your final template should look like this: ```html CKEditor 5 - Quick start CDN

Hello from CKEditor 5!

``` Finally, in the root directory of your Laravel project, run `php artisan serve` to see the editor in action. ## Next steps * See how to manipulate the editor’s data in the [Getting and setting data](../../setup/getting-and-setting-data.md) guide. * Refer to further guides in the [setup section](../../setup/configuration.md) to see how to customize your editor further. * Check the [features category](../../../features/index.md) to learn more about individual features. --- Full index of the CKEditor 5 documentation: [llms.txt](../../../../llms.txt)