Jetstack
Zpět na blog Blog

Editor formátovaného textu — obsah, který má trochu prostoru

Publikováno 1. listopadu 2021

Technická ilustrace k článku Jetstacku

Prostý text se hodí na předmět e-mailu nebo stavový kód, ale na většinu míst, kam lidé opravdu píšou, není ten pravý. Poznámky z porady, popisy úkolů, těla článků, komunikace se zákazníky, e-mailové šablony, odstavce na stránce v Canvasu — všem prospěje trocha struktury. Nadpisy, seznamy, odkazy, sem tam zvýrazněné slovo, obrázek v textu. Zároveň ale nechat uživatele vkládat libovolné HTML je bezpečnostní díra a nechat každé vložení přetáhnout s sebou i původní formátování je nejrychlejší cesta ke stránce, která vypadá jako tři různé weby sešité k sobě. Editor formátovaného textu je naše odpověď na tohle napětí.

Formátovaný text je plnohodnotný typ vlastnosti. Mít ho může kterýkoli typ v datovém modelu a jakmile existuje, chová se pole jako každá jiná vlastnost: objeví se ve formulářích, v pohledech, na stránkách v Canvasu i v API. Uživatelé píšou pomocí lišty nástrojů, která pokrývá to podstatné — nadpisy, zvýraznění, seznamy, citace, odkazy, obrázky — a nic víc. Text vložený z textových editorů se automaticky pročistí, takže kopie z dokumentu s sebou nepřinese písma, barvy ani mezery, které by se praly se zbytkem stránky.

Nejvíc nás těší nastavitelný seznam povolených značek. Každá vlastnost s formátovaným textem si určuje, které HTML značky a atributy povolí. Pole s popisem třeba dovolí jen základní formátování v textu; pole pro článek ve stylu redakčního systému může povolit obrázky, tabulky i vložené figury; ryze interní poznámky mohou dovolit skoro celou škálu. Vložený text se proti tomuto seznamu automaticky přefiltruje. Pravidla sestavíte ve vizuálním editoru, vyexportujete do JSONu a naimportujete do jiné vlastnosti nebo do jiného prostředí — o jednotný redakční standard v celé organizaci se tak snadno postaráte.

Nahrávání obrázků přímo v textu řeší editor sám. Obrázek přetáhnete z plochy, vložíte ze schránky nebo vyberete z knihovny médií. Nahrané obrázky se uloží do úložiště souborů vedle záznamu a automaticky se u nich vytvoří náhledy a použije komprese. Pokud používáte sdílenou knihovnu médií — což je běžné u marketingových a obsahových týmů —, obrázky vložené přes editor se z ní dají brát i do ní zpětně ukládat, takže jedno nahrání využijete na mnoha stránkách a záznamech.

Odkazování funguje tak, jak uživatelé čekají. Externí odkazy se v editoru chovají obvyklým způsobem. Interní odkazy — odkazy na jiné záznamy nebo stránky v rámci platformy — vybíráte z vyhledatelného seznamu a editor si je ukládá ve stabilní podobě, takže vedou správně i tehdy, když se název záznamu změní. U dlouho žijícího obsahu to má význam: odkaz na záznam zákazníka nebo na článek nápovědy napsaný před dvěma lety pořád míří tam, kam má.

Zmínky jsou chvíle, kdy editor přestává být jen nástrojem na obsah a stává se nástrojem na komunikaci. Napíšete @ a objeví se živý výběr. Zmíníte uživatele a odkaz na něj se uloží spolu s textem; při uložení záznamu dostane zmíněný uživatel oznámení s přímým odkazem na místo, kde jeho jméno padlo. Zmínky fungují v komentářích, v polích s formátovaným textem u běžných záznamů a — pokud si to implementace přeje — kdekoli, kde se v platformě píše formátovaný text. Ten drobný krok navíc, který propojí zprávu s konkrétním člověkem, uzavře spoustu situací, které dřív stály na tom, že si někdo vzpomněl přidat správného kolegu do kopie e-mailu.

Tvorba stránek v Canvasu používá pro odstavce stejný editor, takže kdo se s lištou nástrojů naučí pracovat na jednom místě, je hned jako doma i všude jinde. Ta jednotnost je nenápadná, ale sčítá se: nastavení lišty je jen na jednom místě, návyků se učíte jen jednu sadu a spoléháte jen na jeden čistič obsahu.

Přes API se formátovaný text ve výchozím stavu vrací jako pročištěné HTML, které respektuje seznam povolených značek dané vlastnosti. Systémy, které data odebírají — veřejný web, partnerský portál, generátor PDF —, tak dostanou obsah, který mohou rovnou zobrazit, aniž by ho musely znovu čistit nebo hádat, co editor povolil. Seznam povolených značek je jediný zdroj pravdy a těží z něj všechno, co je za ním.

Formátovaný text je sám o sobě drobnost, v praxi ale všechno propojuje. Ve spojení s články o zmínkách a komentářích a o úložišti souborů uvidíte, jak psaní navazuje na spolupráci a na sdílený obsah celého prostředí.