Tinklaraštis

Klientams saugus svetainės redaktorius: theme.json vadovas

Naudokite theme.json, kad nustatytumėte ribas WordPress Site Editor, kad klientai galėtų redaguoti turinį nesugadindami jūsų dizaino.

Santrauka

Kai klientas pirmą kartą atidaro WordPress Site Editor, galimybė redaguoti kiekvieną bloką, spalvą ir išdėstymą jam gali atrodyti kaip puiki funkcija — o jums — kaip grėsmė. Šiame straipsnyje paaiškinama, kaip naudoti theme.json, kad būtų nubrėžta aiški riba tarp turinio redagavimo ir dizaino kontrolės. Užuot kovoję su Site Editor, nustatote išankstinius nustatymus, numatytuosius parametrus ir ribas, kurios leidžia techniškai neišmanantiems klientams saugiai atnaujinti savo svetainę. Apžvelgsime, ką užrakinti, ką palikti atvirą ir kodėl per didelis užrakinimas yra reali rizika. Metodas pagrįstas dizaino tokenais ir šablonų lygmens apribojimais, todėl jis veikia nuosekliai visose jūsų prižiūrimose klientų svetainėse. Galiausiai turėsite pakartojamą darbo eigą, kaip perduoti Site Editor be jūsų dizaino sistemos raktų.

Ką pirmiausia darote, kai klientas atsiunčia el. laišką, sakydamas, kad „tik bandė atnaujinti antraštę", o visos svetainės tarpai subyrėjo?

Jei prižiūrite daugiau nei vieną WordPress svetainę, tikriausiai esate gavę tokią žinutę viena ar kita forma. Site Editor davė jūsų klientui automobilio su penkiomis pavaromis ir be stabdžių raktus. Jie mano, kad atlieka paprastą teksto pakeitimą, ir staiga pasimeta pasaulinė tipografika, pagrindiniame puslapyje herojaus bloke atsiranda neoninė spalva, kurios jūs nesirinkote, o du blokai dabar yra vienas virš kito, o ne vienas šalia kito.

Tuo tarpu jūs galvojate apie šešias kitas klientų svetaines, kurias palaikote, ir paskutinis dalykas, kurio jums reikia, yra priežiūros spąstai, kai kiekvienas „naudingas" kliento pakeitimas reikalauja atkūrimo iš atsarginės kopijos.

Atsakymas nėra atimti Site Editor. Reikia nustatyti ribas jo viduje naudojant theme.json. Remiantis WordPress Developer Resources, theme.json yra pagrindinis blokų redaktoriaus nustatymų ir stilių tiesos šaltinis — jis apibrėžia klientui rodomas spalvų paletes, tipografiką ir maketo parinktis. Tai reiškia, kad tas pats failas, kuris kontroliuoja jūsų dizainą, gali kontroliuoti ir tai, ką klientas gali ir ko negali redaguoti.

Apžvelkime, kaip apie tai galvoti, nes dauguma pamokų sutelkia dėmesį į tai, ką theme.json gali padaryti kūrėjams. Agentūrai klausimas kitoks: kaip jį naudoti, kad klientai būtų saugūs, bet jaustųsi nevaržomi?

Kodėl Site Editor atrodo toks pavojingas?

Jūsų klientas nesistengia sugadinti svetainės. Jie bando daryti tai, ko juos metų metus mokėte senajame redaktoriuje: pakeisti antraštę, pakeisti paveikslėlį, galbūt pridėti pastraipą. Pavojus ne jų ketinimuose — o tame, kad Site Editor toje pačioje vietoje rodo pasaulinius valdiklius ir turinio valdiklius.

Štai dažnas scenarijus. Klientas atidaro šabloną Site Editor ir mato antraštės bloką. Jis pakeičia jo spalvą, kad atitiktų naują prekės ženklo atspalvį. Tačiau kadangi ta antraštė yra šablone, pakeitimas taikomas visur, kur tas šablonas naudojamas. Klientui tai atrodė kaip vienas redagavimas. Svetainei tai buvo pasaulinis pakeitimas.

Bendras principas: kai kam nors duodate puslapio konstruktorių, jie ilgainiui ras „apsaugotus nustatymus" ir juos išjungs. Tačiau naudodami theme.json galite paslėpti pačius apsauginius turėklus. Užuot sakę klientui „nelieskite pasaulinių stilių", jūs tiesiog nerodote jam spalvų paletės, kuri galėtų sukelti blogą rezultatą. Apibrėžiate patvirtintų spalvų paletę, šriftų dydžių skalę ir tarpų išankstinių nustatymų rinkinį — ir klientas renkasi iš jų, o ne iš viso CSS spektro.

Tai pirmasis poslinkis: nustokite galvoti apie taisykles ir pradėkite galvoti apie gamyklas. theme.json yra jūsų gamybos linija. Konfigūruojate kliento matomas parinktis, o apribojimus įgyvendina pati sąsaja, o ne instrukcijų rinkinys perdavimo dokumente.

Ką iš tikrųjų turėtumėte užrakinti?

Ne viską. Jei per griežtai užrakinate turinio sritį, klientas arba kiekvieną kartą, kai reikia pridėti pastraipą, skambins jums, arba ras būdą jus apeiti — dažnai įdiegdamas vienkartinį įskiepį arba kopijuodamas HTML iš senosios svetainės.

Štai praktinė lentelė, ką užrakinti, ką palikti ir kodėl:

Redagavimo sritisUžrakinti?Kodėl
Šablono struktūra ir blokų maketaiUžrakintiApsaugoma nuo atsitiktinio pagrindinių maketo blokų pašalinimo arba pertvarkymo
Pasauliniai stiliai (spalvos, šriftai, tarpų išankstiniai nustatymai)Užrakinti su išankstiniais nustatymaisKlientai renkasi iš patvirtinto rinkinio, o ne iš atsitiktinių reikšmių
Turinio tekstas ir paveikslėliaiPalikti atvirąTai jų darbas; leiskite jiems tai daryti be leidimo prašymo
Tarpai tarp blokųIš dalies užrakintiSuteikite tarpų išankstinius nustatymus, kad jie galėtų koreguoti ritmą nesugadindami lygiavimo
Kuruojami blokų raštaiPalikti atvirą, jei juos patikrinoteSaugus būdas klientams pridėti naujų sekcijų be kūrimo nuo nulio

Svarbus niuansas yra „užrakinti su išankstiniais nustatymais", o ne „uždrausti". Kalbant apie pasaulinius stilius, jūs neslepiate nustatymų skydelio; sumažinate pasirinkimų skaičių iki kuruojamo rinkinio. Kalbant apie šablono struktūrą, galite užrakinti tam tikrus blokus, kad jų nebūtų galima pašalinti, bet vis tiek leisti klientams redaguoti juose esantį tekstą.

Vienas įspėjimas: bloko užrakinimas šablone skiriasi nuo užrakinimo konkrečiame puslapyje. Šablono užraktai veikia visą turinį, kuris naudoja tą šabloną. Jei skirtingiems puslapiams reikia skirtingų užrakinimo lygių, turėsite dirbti blokų lygiu redaktoriaus viduje, o tai yra trapesnis sprendimas. Pakartotiniam agentūros darbui sukurkite šablonus taip, kad užrakintos sritys būtų nuoseklios.

Kaip nustatyti ribas, kad redaktorius neatrodytų kaip spąstai?

Metodas yra apibrėžti dizaino tokenus theme.json ir paskui nesinaudoti jokiais kitais CSS sprendimais.

Pavyzdžiui, užuot leidę klientui nustatyti savavališką mygtuko spalvą, apibrėžiate mygtuko stilių theme.json, kuris naudoja konkrečią jūsų paletės spalvą. Klientas vis tiek gali pasirinkti mygtuką ir pakeisti jo tekstą, bet spalvų parinkiklis rodys tik jūsų patvirtintus atspalvius. Tas pats taikoma šriftų dydžiams, eilučių aukščiams ir tarpams.

Tas pats principas taikomas šablonams. Galite naudoti „užrakinti" funkciją konkretiems blokams šablone — pavyzdžiui, užrakinti atsiliepimų bloko stulpelių struktūrą, kad klientas galėtų pakeisti citatos tekstą, bet ne paversti trijų stulpelių dviem. Jei dar nenaudojote blokų užrakinimo, jis pasiekiamas redaktoriaus įrankių juostoje; kai užrakinote bloką, galite pasirinkti, ar klientas gali redaguoti turinį, jį perkelti, ar abu. Tai netgi galite pritaikyti theme.json blokų lygmens numatytiesiems nustatymams.

Jūsų tikslas — redaktorius, kuriame klientas niekada nemato valdiklio, galinčio sugadinti dizainą. Tai nereiškia, kad jie negali padaryti nieko negerai; tai reiškia, kad blogiausia, ką jie gali padaryti, yra pakeisti antraštės tekstą, o ne visos svetainės išvaizdą.

Jei naudojate pasirinktinius įrašų tipus, tie patys principai taikomi ir už numatytųjų šablonų ribų — žr. mūsų vadovą kaip išplėsti theme.json pasirinktiniams įrašų tipams ir įskiepių išvestims.

Kas atsitinka, kai užrakinama per daug?

Štai prieštaringas požiūris: per didelis užrakinimas yra toks pat žalingas kaip ir per mažas. Klientas, kuris negali pakeisti antraštės dydžio ar pridėti tarpą tarp sekcijų, ilgainiui paprašys „tik padaryk, kad atrodytų gerai" — ir tada vėl nemokamai atliksite smulkius pakeitimus. Blogiau, jie gali nuspręsti, kad Site Editor yra nenaudingas, ir grįžti prie trečiosios šalies puslapio konstruktoriaus, kuris vėl suteikia per daug kontrolės.

Kompromisas yra realus. Užrakinti redaktoriai sukelia mažiau avarinių skambučių, bet taip pat daugiau prašymų „ar galite tik pakelti šį mygtuką penkiais pikseliais". Atviri redaktoriai sukelia priešingą efektą. Jūsų darbas — kiekvienam klientui rasti pusiausvyrą, o ne taikyti vieną konfigūraciją visiems.

Gera pradinė taisyklė: užrakinkite viską, kas veikia visus tam tikro dalyko atvejus (pasauliniai stiliai, šablono struktūra), ir palikite atvirą viską, kas veikia vieną atvejį (vieno puslapio tekstą ir paveikslėlius). Jei klientas sugadina vieną puslapį, tai 5 minučių pataisymas. Jei sugadina pasaulinį stilių, tai 20 minučių pataisymas ir saugumo problema.

Kaip tai padaryti pakartojamai visiems klientams?

Čia įsitraukia agentūros darbo eiga. Turėtumėte turėti pagrindinį theme.json, kuris apibrėžia jūsų dizaino tokenus — spalvų paletę, tipografijos skalę ir tarpų išankstinius nustatymus — ir tada kiekvieno kliento perrašymo failą, kuris išplečia arba pakeičia konkrečias reikšmes.

Pradėkite nuo „pradinės" blokinės temos. Štai kaip sukurti pasirinktinę blokinę temą su theme.json — kai ją sukursite ir aprašysite, naujam klientui ją nukopijuoti reiškia tik pakeisti prekės ženklo spalvas ir šriftus. Jūs ne iš naujo kuriate ratą; jūs keičiate tokenus. Tai būtent nustokite iš naujo kurti kiekvieną WordPress svetainę mentalitetas, taikomas redaktoriui, o ne administracinei daliai.

Kadangi theme.json yra vienas failas, jį taip pat lengva versijuoti ir diegti keliose aplinkose. Galite peržiūrėti pakeitimus, matyti, ką klientas pakeitė pasauliniuose stiliuose, ir palyginti tuos pakeitimus su pagrindiniu failu. Tai suteikia stiprų audito pėdsaką palaikymo užklausoms.

Jei prižiūrite kelias svetaines ir dar nesukūrėte pagrindinės temos, tai jūsų proga. Tai vienintelis pasirinktinis WordPress darbas, kuris atsiperka kiekvieną kartą, kai klientas atidaro redaktorių.

O kaip klientai, kurie nuolat prašo „dar vienos spalvos"?

Jūsų paletė yra pažadas. Jei apibrėžiate penkias prekės ženklo spalvas, o klientas prašo šeštos, atsakymas nėra „ne" — tai „taip, bet ji atsiras kaip apgalvotas paletės papildymas, o ne kaip vienkartinis hex kodas antraštėje". Kai pridedate spalvą prie theme.json, ji tampa nuosekliai prieinama visoje svetainėje. Tai tinkamas būdas tvarkyti tokius prašymus.

Čia taip pat turite bendrauti su klientu. Paaiškinkite, kad Site Editor jiems rodo tik tas spalvas ir šriftus, kurie atitinka jų prekės ženklo standartus. Jei jie nori išplėsti tuos standartus, jūs tai sutvarkysite dizaino sistemoje, ir tada kiekviena nauja spalva bus prieinama visur — įskaitant būsimus puslapius, kurių jie dar nesukūrė. Tai daug geresnis atsakymas nei „mes to nedarome".

Tuo pačiu metu nekaupkite keturiasdešimties spalvų paletės. Peržiūrėkite ją kas ketvirtį ir pašalinkite viską, kas buvo vienkartinis atsitiktinumas. Tikslas — nedidelis, apgalvotas parinkčių rinkinys.

Jei užrakinsite maketą, bet paliksite turinį, ir padarysite paletę gyva klientų santykių dalimi, Site Editor nustos būti grėsme. Jis tampa būdu suteikti klientams tikrą savarankiškumą neaukojant dizaino standartų, kuriuos esate samdomi apsaugoti.

Sources (5)