Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

...

CKEditor 5 and Basic HTML Filter

  1. Modularity: CKEditor 5 is more modular and modern. It allows for easy integration with various filters, including the Basic HTML Filter.

  2. Security: CKEditor 5, when used with the Basic HTML Filter, offers enhanced security features, making it more robust against security threats by filtering out potentially harmful code by default.

  3. Customization: CKEditor 5 provides a flexible configuration system, enabling users to customize the editor's toolbar and behavior. This makes it easier to tailor the editor to specific needs.

  4. Accessibility: CKEditor 5 has improved accessibility features out of the box, making it a better choice for ensuring that content created is accessible to all users.

...

CKEditor 5 and Full HTML Filter

  1. Advanced Editing: CKEditor 5 can be integrated with the Full HTML Filter for users who need advanced content editing capabilities. It allows the use of complex HTML, but with enhanced security features.

  2. Security Enhancements: CKEditor 5, when combined with the Full HTML Filter, maintains a higher level of security. It mitigates security risks by providing better filtering and validation of user input.

  3. Customization: CKEditor 5 offers extensive customization options for the Full HTML Filter, allowing administrators to define which HTML elements and attributes are allowed, further enhancing content control.

...

Inserting Bootstrap Icons and Font Awesome Icons

  • Before you begin. Make sure to check Use Bootstrap icons for Bootstrap and select Font Awesome for the Icon set to use Font Awesome icons under the Appearance section for your college theme.

    2024-04-25_16-31-15.png
  • When inserting icons, you should hard code the icons by switching to Source mode (Full HTML) in the CKEditor5 toolbar.

  • Once you are in Source mode. You can now hard code any Bootstrap Icon and Font Awesome Icon by wrapping them with an <p> tag and <em> tag. See below for an example.

    2024-04-25_16-26-57.png

...