Image

Must Have Drupal 8 CKEditor Modules

Now that Drupal 8 has a CKEditor WYSIWYG editor built into Drupal, core developers can remove the “Install and configure the WYSIWYG module and CKEditor library” from their initial site setup to do list. If you were not aware, a WYSIWYG is short for What You See Is What You Get. This is what provides the bold and bulleted list buttons above text areas when editing content. Without it, content editors would have to use basic HTML in order to apply any styles to the articles they write.

Below is a list of Drupal 8 modules that allow us to improve the content editing experience by adding features to the built-in CKEditor.

Linkit

The Linkit module adds the ability to add a link to other content on the site. Without it, content editors can still add links by using the standard in link button. However, this module adds some wonderful improvements over the built-in link button.

This module provides an autocomplete search to allow the content editor to search through the content on the site. This avoids the task of searching for the content manually to find the URL.

The Linkit module allows the user to select their content from an autocomplete search, this enforces the use of internal URLs instead of full URLs. This avoids the issue commonly seen when a content editor is managing content on the staging site and finding that their links are broken when the site is migrated live because their links used the content’s full URL as it appeared on the staging site.

The links that this module creates are “smarter”. If the title or URL path of the linked to content are updated in the future the link’s href and title attributes are updated respectively. This means that you can avoid broken links when you update content in the future. In addition, this works very well with translated content on multilingual sites.

D8 Editor File upload

The D8 Editor File upload module allows content editors to upload any file and link to it within their content. What I like most about this module is its simplicity for the content editors. This solution is quite eloquent compared to other solutions, like IMCE which completely ignores Drupal 8’s new file entities.

D8 Editor Advanced link

D8 Editor Advanced link expands upon the link button giving the content editor the ability to add additional attributes to the links they create. These attributes include the title, CSS classes, an ID, and the ability to open the link in a new window (tab for modern browsers). This module also works very well with the Linkit and D8 Editor File upload modules.

Video Embed Field

The Video Embed Field module allows content editors to embed YouTube and Vimeo videos into content by providing just the URL to the video. The alternative to this module is changing the Text Filter to allow the content editor to include the third party JavaScript directly into the content. This is not ideal because this opens up potential security concerns. It would require the content editor to understand the implications of adding JavaScript into content and be able to identify and avoid adding malicious code. The Video Embed Field makes this whole process easier and more secure. It also provides features for autoplaying the video, opening the video inside of a lightbox, video thumbnail retrieval, as well as other. Out of the box, the Video Embed Field supports YouTube and Vimeo videos. However, over a dozen other video sources are supported via additional modules, including Instagram, Hulu, and Facebook. Other video providers are listed on the module's project page.

Entity Embed

Entity Embed allows content editors to include and render other Drupal entities within the content. Because almost everything (Users, Images, Nodes, Media, Taxonomy Terms) are an entity in Drupal 8, this is very powerful. This can be useful for allowing content editors to reference and include Media assets, a related commerce product, or a taxonomy term definition within the main body content of their article. The possibilities and scenarios where this module can be leveraged are endless.