Pasting Images into Drupal: A Practical CKEditor 5 Setup

Illustrated infographic summarizing: Pasting Images into Drupal: A Practical CKEditor 5 Setup

By Greg Nowak. Reviewed 19 July 2026.

Pasting a screenshot directly into Drupal can remove several small steps from publishing a support article, procedure, or internal guide. For a busy editorial team, that convenience adds up. But a partially configured editor creates a different kind of work: images disappear after saving, files become difficult to reuse, or oversized screenshots quietly make pages heavier.

On a modern Drupal site, this is primarily a CKEditor 5 and text-format configuration task. Core can handle clipboard image uploads; the more important decision is whether an image should remain a quick inline file or become a reusable Media item.

The short answer

For Drupal 10 or 11, start with core. The old Image from Word project is marked obsolete and explicitly says its functionality is provided by Drupal core with CKEditor 5 from Drupal 9.3 onward. The older CKEditor Upload Image module belongs to the CKEditor 4 ecosystem and has no supported stable release.

That does not mean every Drupal installation is ready without configuration. The text format must use CKEditor 5, the Image button must activate the image plugin, and image uploads must be enabled in that plugin’s settings. Drupal then uploads the clipboard image as a file instead of storing a large image blob in the body field.

Content need Recommended route Operational reason
One-off support or process screenshot Paste through CKEditor 5 image upload Fast to create and unlikely to require reuse.
Logo, campaign image, product photo, or shared diagram Media Library Provides a reusable asset with centralized metadata and display rules.
Image requiring consistent crops or view modes Media Library Keeps presentation decisions out of individual body fields.
Custom or decoupled editing interface Upload adapter and server endpoint Drupal’s standard editor integration does not automatically carry into a bespoke UI.
Drupal site still using CKEditor 4 add-ons Upgrade review first Legacy clipboard modules are not a sound basis for a current editorial workflow.
Use direct paste for disposable working images; use Media Library when the asset has value beyond one page.

Configure direct image pasting

  1. Find the real text format. Visit /admin/config/content/formats and identify the format used by ordinary editors. It may be Basic HTML, but confirm this on the content form rather than assuming.
  2. Select CKEditor 5. Edit that format and confirm CKEditor 5 is the configured text editor.
  3. Activate the Image button. Add the Image button to the active toolbar. Toolbar configuration also determines which CKEditor plugins Drupal enables.
  4. Enable image uploads. In the CKEditor 5 Image plugin settings, enable uploads and review the destination directory, file-size limit, and maximum dimensions. Choose limits that reflect real editorial needs rather than accepting full-resolution desktop screenshots indefinitely.
  5. Review the filters. Drupal validates the editor output against the text format when content is saved. Keep the image-related markup and file-reference handling expected by the current plugin. Do not copy old lists of data-cke-* attributes from CKEditor 4 tutorials.
  6. Test with an editor account. Site administrators often have broader format access and permissions. A successful administrator test does not prove that the publishing team has the same experience.

Paste an operating-system screenshot, wait for the upload to finish, save the page, reopen it, and check the published result. The complete save-and-reopen cycle matters: an image visible inside the editor may still be removed by a filter or fail to resolve on the front end.

When Media Library is the better choice

Direct image upload creates a Drupal file, but it does not automatically give the team a well-governed, reusable media asset. Media Library is the stronger route when an image will appear on several pages, needs structured metadata, or must use a controlled display mode.

Enable the core Media and Media Library modules, add the Media Library button to the relevant CKEditor 5 toolbar, and enable the Embed media filter. Drupal’s documentation recommends placing that filter last so other filters can process alignment, captions, and allowed HTML first. Also review which media types and view modes editors may select.

A simple publishing rule is usually more effective than a long manual: screenshots made for one article may be pasted; brand and reusable assets must enter through Media Library.

Test the clipboard sources your team actually uses

Clipboard contents vary by application. A screenshot copied from the operating system is not necessarily handled like an image copied from a web page, Word document, or Google Doc. A browser may place an external URL on the clipboard, which can produce a hotlinked image rather than an uploaded file.

  • Test Windows and macOS screenshot tools used by the team.
  • Paste from Word and Google Docs if those are common drafting tools.
  • Check the rendered image URL to confirm it belongs to your Drupal site.
  • Verify PNG, JPEG, and WebP behavior against the configured limits.
  • Confirm that editors can add meaningful alt text after pasting.
  • Test public and private file delivery if the site uses both schemes.

Avoid solving upload problems with Base64 images stored inside HTML. CKEditor’s documentation warns that Base64 content increases database and transfer size and cannot benefit from normal browser image caching. Uploaded files or Media items are a better production architecture.

Useful checks for a configuration-managed site

These commands provide a quick view of the enabled modules and the configuration behind the common basic_html format. Substitute the actual format machine name if your site uses another one.

drush pm:list --status=enabled --type=module | grep -E 'ckeditor5|editor|filter|media|media_library'
drush config:get editor.editor.basic_html
drush config:get filter.format.basic_html

After the change has been tested with the correct role and content type, export it through the team’s normal configuration workflow:

drush cex -y
drush cr

Where implementations usually go wrong

If the image disappears immediately, inspect the upload request and Drupal logs. If it survives editing but vanishes after saving, review the text format and filters. If administrators succeed while editors fail, compare roles, formats, and file permissions. If the image renders from another company’s domain, the clipboard supplied a URL rather than an uploadable image.

The technical fix is usually modest. The lasting improvement comes from agreeing which route editors should use, setting sensible upload limits, and testing the workflow as the people who publish every day.

If clipboard images are unreliable or your team has no clear boundary between quick screenshots and managed assets, Greg can review the CKEditor, Media Library, permissions, and publishing setup without turning it into a larger rebuild than necessary. Talk to Greg about your Drupal workflow.

Related on GrN.dk

Need help with this kind of work?

Discuss your Drupal publishing workflow Get in touch with Greg.

Sources

Seneste artikler

Få en ugentlig marketingrapport fra GA4 og Google Ads med kontrollerede beregninger, tydelige dataforbehold og et kort AI-udkast, der hjælper jer på mandagsmødet.

Brug AI til webshoppens alt-tekster med en overskuelig pilot: kortlæg billederne, få danske forslag, og kontrollér resultatet i WordPress og WooCommerce.

AI-baseret ticketanalyse kan afsløre gentagne klager, produktfejl og huller i dokumentationen – uden at virksomheden behøver endnu en chatbot.

OpenSSH 10 fjerner DSA og advarer om nøgleudveksling, der ikke er post-kvantesikker. Her får du en metode til at afgrænse SFTP-oprydningen uden at svække alle SSH-forbindelser.

Botforespørgsler overstiger nu menneskelig webtrafik. Lær at auditere AI-crawlere, fastsætte regler på stiniveau, håndhæve robots.txt og måle det forretningsmæssige afkast.

Cloudflares Tunnel-opdateringer fra 2026 forbedrer kortlægning, overvågning af replikaer, logstreaming og overdragelse – men synliggør samtidig svagt ejerskab og mangelfuld praksis for failover og logging.

Sådan bruger du AI til mødenoter og opfølgning, mens faste regler beskytter CRM-data, kundematch og pipeline mod fejl og forhastede ændringer.

Drupal 10 når end of life den 9. december 2026. Brug denne praktiske kortlægning til at afgrænse arbejdet med Drupal 11-parathed, Composer-efterslæb, moduler og custom code.

Apache 2.4.67 tydeliggjorde risikoen ved overtagne reverse proxies. Læs, hvordan du opgraderer til 2.4.68, gennemgår HTTP/2, AJP og .htaccess og tester ændringerne sikkert.

WooCommerce-blokke er standarden, men ikke alle webshops er klar. Brug denne praktiske gennemgang, testplan og rollback-procedure til at beskytte omsætningen i checkout.

Anmeld Greg på Google

Greg Nowak Google-anmeldelser

 

Skriftlige anbefalinger fra Trafik og Veje, Aarhus Kommune (2011) og AgroTech (2010) — læs dem på LinkedIn.