Forbedr blokeditorens UX med MRW Simplified Editor

Sådan viser du kun de muligheder og blokke, du har brug for i Gutenbergs blokeditor, hvilket gør arbejdet enklere for redaktører, forfattere og dig.

Sådan skjuler du indstillinger, som din redaktør ikke har brug for

Se på de to skærmbilleder af kernegruppeblokkens stilfane nedenfor.

Som standard kan du ændre farve, baggrund, typografi, margin, padding, blokafstand, min-højde og kantindstillinger.

Hvis du aktiverer MRW Simplified Editor, reduceres mulighederne til kun at omfatte farve og typografi.

Sådan viser du et kurateret udvalg af blokke

WordPress-kernen tilbyder mig sammen med mit tema i alt 106 blokke, hvoraf jeg bruger 22. Ved at deaktivere ubrugte blokke bliver arbejdsgangen med at indsætte blokke meget enklere. Desuden undgår jeg situationer, hvor en redaktør eller indlægsforfatter bruger blokke, der ikke er stylet korrekt, eller som jeg ikke kan understøtte.

For eksempel deaktiverer jeg vers, fodnoter og klassiske blokke, som kan forårsage alle mulige design- og tilgængelighedsproblemer, hvis de ikke implementeres omhyggeligt.

Ingen eksterne mønstre, der kan skade privatlivet.

Du ved sikkert, hvor det bærer hen.

WordPress tilbyder som standard en bred vifte af mønstre. Du kan bruge dem som inspiration, men det er ikke sikkert, at de fungerer til dit design. Mange af dem er afhængige af eksterne aktiver som billeder, hvilket potentielt kan forårsage problemer med ydeevne og privatliv.

Mønstre på WordPress er en fantastisk funktion, som jeg bruger på mange sider, men du bør helt sikkert skabe dem inden for din designguide ved hjælp af dine egne medier.

Men vent, der er mere! (som skal væk)

Du bruger sandsynligvis ikke flere H1’er på din side, standardgradienterne eller duotonerne. Det er heller ikke sandsynligt, at du ønsker inline-billeder, der flyder rundt mærkelige steder på forskellige enheder.

Så disse muligheder tager MRW Simplified Editor sig af ved at fjerne dem. Den komplette liste findes i plugin-beskrivelsen på WordPress.org.

Endelig er billedindstillingerne “Upload” og “Indsæt fra URL” fjernet for at tilskynde til brug af mediebiblioteket, hvor du alligevel bør overveje alt-tekster og billedtekster til hele siden.

Tilpas plugin’et, så det opfylder dine behov.

MRW Simplified Editor er et meningsfuldt plugin skrevet af Mark Root-Wiley til hans specifikke behov. Men alle sider er forskellige, så Mark har været så betænksom at levere et sæt filtre, som vi kan bruge til at tilpasse editoroplevelsen til vores egne projekter.

Jeg bruger inline-koden eller kbd-markeringen i nogle blogindlæg, så disse indstillinger bør forblive aktiveret. Jeg er også afhængig af lyd- og videoblokkene, så de skal også være tilgængelige.

På den anden side ønsker jeg ikke, at mine kunder indlejrer indhold fra Issuu eller TikTok. Hvis de har den slags behov, kan vi diskutere en løsning, der i det mindste sikrer et vist niveau af privatliv og tilgængelighed.

MRW Simplified Editor-tilpasningsfiltre

Her er den kodestump, jeg bruger til at tilpasse MRW Simplified Editor-pluginet her på oldrup.dk

<?php

// MRW Simplified Editor; Unhide specific inline options in the block editor

add_filter("mrw_hidden_block_editor_settings", "oldrup_unhide_inline");
function oldrup_unhide_inline($features)
{
    // Unhide the kbd and code html elements, I use those :)
    return array_diff($features, ["keyboard", "inline-code"]);
}

// MRW Simplified Editor; Unhide, and hide, selected blocks from the block-editor

add_filter("mrw_hidden_blocks", "oldrup_unhide_and_hide_blocks", 10, 2);
function oldrup_unhide_and_hide_blocks($blocks, $context)
{
    // Unhide the following blocks (which are hidden by default)
    $blocks = array_diff($blocks, [
        "core/audio",
        "core/code",
        "core/details",
        "core/preformatted",
        "core/table",
        "core/video",
    ]);

    // In addition to the defaults, hide the following blocks
    $additional_blocks_to_hide = [
        "core/comment-author-name",
        "core/comment-content",
        "core/comment-date",
        "core/comment-edit-link",
        "core/comment-reply-link",
        "core/comments-title",
        "core/embed",
        "core/file",
        "core/html",
        "core/latest-posts",
        "core/template-part",
        "core/social-links",
    ];

    return array_merge($blocks, $additional_blocks_to_hide);
}

// MRW Simplified Editor; Hide specific embeds in the block editor
// Note: Don't hide core/embed above, if you want to use embeds

add_filter("mrw_hidden_embeds", "oldrup_hide_embeds", 10, 2);
function oldrup_hide_embeds($hidden_embeds)
{
    // In addition to the defaults, hide the following unused embeds
    $new_embeds_to_hide = [
        "flickr",
        "imgur",
        "issuu",
        "kickstarter",
        "pinterest",
        "reddit",
        "screencast",
        "scribd",
        "slideshare",
        "soundcloud",
        "speaker-deck",
        "spotify",
        "ted",
        "tiktok",
        "tumblr",
        "twitter",
        "wordpress",
    ];
    return array_merge($hidden_embeds, $new_embeds_to_hide);
}

// Plugin: https://wordpress.org/plugins/mrw-web-design-simple-tinymce/
// Full core block list: https://www.wpexplorer.com/wordpress-core-blocks-list/

Mønstre påvirkes ikke

Hvis du spekulerer på, om du kan indsætte mønstre, der indeholder blokke, som ikke er tilgængelige i blokindsætteren, så kan du absolut. Det er det smukke ved denne kombination. Du kan f.eks. oprette et tabelmønster med tilgængeligt pladsholderindhold og styling, og en forfatter kan bruge det mønster, selvom den tomme tabelblok er skjult.

Ved at begrænse en indholdsskaber til velafprøvede og selvbeskrivende mønstre, hjælper vi dem med at fokusere på indholdet i stedet for skrivemaskinemekanik.

Opret forskellige regler for forskellige roller

Har din redaktør brug for adgang til et andet sæt blokke og muligheder end din administrator eller forfatter? Hvis det er tilfældet, kan du oprette forskellige regelsæt og anvende dem afhængigt af den indloggede brugers rolle. Du kan gøre det med et par linjer kode eller ved at bruge “betingelser”-funktionen i de fleste kodestykke-plugins.

This code snippet is run only in the admin area and users having the editor role.
Denne kodestump køres kun i administratorområdet og af brugere, der har redaktørrollen.

Kompatibilitet og konklusion

Jeg bruger MRW Simplified Editor på en håndfuld sider, og indtil videre er oplevelsen, især med veludformede mønstre, helt fantastisk.

Siderne kører WordPress 6.4 og PHP 8.1+.

Processen med at skabe tilpassede snippets kan kræve lidt tid, men den er meget tilpasningsdygtig. Ved at bruge ovenstående kode som udgangspunkt kan man på få minutter skabe en mere brugervenlig og forenklet blokeditor-oplevelse.

Hvordan kan blokeditoren blive mere tilgængelig for den almindelige bruger? Lad mig det vide i kommentarerne nedenfor.

Bjarne Oldrup

Bjarne Oldrup

Bjarne er webudvikler med en stor forkærlighed for det bæredygtige, inkluderende og respektfulde internet.

Med en baggrund som datatekniker i 1992, har han arbejdet som programmør, sysadmin og netværksspecialist. I dag fokuserer han på hjemmesiders klimaaftryk, webtilgængelighed og GDPR-compliance.

WordPress, HTML, CSS og LiteSpeed webservere er Bjarnes foretrukne redskaber, og open source-fællesskabet hans komfortzone.

Bjarne bor i Sønderborg i et lille hus med en vild have og en doven kat.

Efterlad et svar

Din e-mailadresse vil ikke blive publiceret. Krævede felter er markeret med *