Bloku redaktors

4. modulis: Satura veidošana · Lasīšanas laiks: 8 minūtes

Mācību mērķis: Pēc šīs nodarbības Jūs varēsiet izveidot lapu, izmantojot blokus un modeļus, un zināsiet, kā darbojas melnraksti, plānošana un versijas.

Galvenie jēdzieni: bloks, bloka iestatījumi, rīkjosla, saraksta skats, grupa, slejas, modelis, sinhronizēts modelis, melnraksts, privāts, plānošana, versijas, priekšskatījums

Viss ir bloks

Kopš WordPress 5.0 (2018. gada beigas) saturu veidojat bloku redaktorā (dēvētā arī par Gutenberg, pēc projekta nosaukuma). Lapa sastāv no atsevišķiem blokiem: virsraksts, rindkopa, attēls, poga, saraksts, tabula, iegults video. Katram blokam ir savi iestatījumi. Blokus Jūs varat novietot vienu zem otra, blakus (slejās) vai vienu otrā (grupā).

Kāpēc bloki? Vecajā redaktorā lapa bija viens liels teksta lauks. Ja vēlējāties divas slejas vai pogu, bija nepieciešams lapu veidotājs, shortcodes vai HTML. Ar blokiem to var izdarīt pašā WordPress, un rezultāts ir pārskatāms HTML, ko noformē tēma.

Aizkulisēs WordPress saglabā blokus kā HTML ar komentāru zīmēm pirms un pēc tiem:

<!-- wp:heading -->
<h2 class="wp-block-heading">Darba laiki</h2>
<!-- /wp:heading -->

<!-- wp:paragraph -->
<p>Mēs esam atvērti no otrdienas līdz sestdienai.</p>
<!-- /wp:paragraph -->

To ir noderīgi zināt: saturs paliek lasāms HTML, arī tad, ja vēlāk nomaināt tēmu vai kāds bloks vairs nepastāv. To varat redzēt, izvēloties kādam blokam opciju "Rediģēt kā HTML" vai koda redaktorā (Ctrl+Shift+Alt+M).

Redaktors trīs daļās

1. Vidusdaļa (canvas): Jūsu lapa aptuveni tāda, kāda tā izskatīsies.
2. Rīkjosla virs izvēlēta bloka: treknraksts, slīpraksts, saite, līdzinājums un bloka pārveidošana citā tipā (rindkopa kļūst par sarakstu, attēls kļūst par galeriju).
3. Sānjosla labajā pusē ar divām cilnēm: Lapa (vai Ziņa) ar iestatījumiem visai lapai, un Bloks ar izvēlētā bloka iestatījumiem, piemēram, krāsu, atstarpi un fonta lielumu.

Divi rīki, kas ievērojami atvieglo darbu:

• Saraksta skats (ikona ar trim svītriņām kreisajā augšējā stūrī): Jūsu lapas uzbūve koka veidā. Ar to varat precīzi izvēlēties vēlamo bloku, pat ja tas atrodas grupā kādā slejā.
• Slash komandas: tukšā rindā rakstiet / un bloka nosaukumu (/heading, /button, /image) un nospiediet Ievadīt.

Veidošana ar grupām un slejām

Labai lapai ir skaidra struktūra. Tam izmantojat trīs pamatelementus:

• Grupa: rāmis ap vairākiem blokiem, ar savu fonu vai atstarpi. Piemēram, krāsains bloks ar virsrakstu, teikumu un pogu.
• Slejas: bloki blakus. Tālrunī tie parādās cits zem cita.
• Rinda un Kaudze: grupas varianti, kas kārto blokus horizontāli vai vertikāli.

Izmantojiet virsrakstus pareizi: viens H1 (lapas nosaukums, ko parasti izveido pati tēma), zem tā H2 nodaļām un H3 to apakšdaļām. Neizvēlieties virsraksta līmeni pēc fonta lieluma, to pielāgojat bloka iestatījumos. Ekrāna lasītāji un meklētājprogrammas izmanto virsrakstus, lai saprastu lapas struktūru (nodarbība 9.2).

Modeļi: nav jāsāk katru reizi no jauna

​Modelis ir gatava bloku grupa: virsraksts ar tekstu un attēlu, cenu tabula, trīs slejas ar ikonām. Jūs tos ievietojat, izmantojot pievienošanas pogu (plusiņu), cilni Modeļi. Jūsu tēma bieži piedāvā vairākus no tiem, un wordpress.org modeļu bibliotēkā ir pieejami simtiem.

Jūs varat arī paši veidot modeļus: izvēlieties dažus blokus, rīkjoslā izvēlieties trīs punktiņus un Izveidot modeli. Pēc tam izvēlieties, vai modelis ir sinhronizēts:

• Nav sinhronizēts: katru reizi, kad to ievietojat, iegūstat atsevišķu kopiju. Ja Jūs to pielāgojat, mainās tikai šī kopija. Noderīgi kā paraugs.
• Sinhronizēts: visur, kur tas atrodas, tas ir vienāds. Ja Jūs to pielāgojat vienā vietā, tas mainās visur. Noderīgi, piemēram, blokam "Kontakti un darba laiks", kas atrodas desmit lapās. (Agrāk tie tika saukti par "atkārtoti izmantojamiem blokiem".)

Viens slazds: sinhronizēts modelis, ko Jūs "vienkārši" pielāgojat vienā lapā, mainās arī visās citās lapās. Ja vēlaties kaut ko mainīt tikai vienā vietā, pārveidojiet šo vienu kopiju par parastu grupu (atsaistiet to).

Saglabāšana, publicēšana un plānošana

Lapai ir statuss:

Izmantojiet Priekšskatīt, lai apskatītu lapu tā, kā to redzēs apmeklētājs, arī mobilajā tālrunī un planšetē, pirms publicēšanas.

Versijas: atpakaļ laikā

Katru reizi, kad Jūs saglabājat, WordPress saglabā versiju: šī brīža stāvokli. Sānjoslā pie lapas redzams, cik versiju ir. Noklikšķiniet uz tās, un ar slīdni varat redzēt atšķirības starp divām versijām, kā arī atjaunot kādu agrāku versiju.

Versijas ir Jūsu pirmais drošības tīkls kļūdas gadījumā ("es nejauši izdzēsu pusi lapas"). Tomēr tās visas tiek saglabātas datubāzē. Tīmekļa vietne ar tūkstošiem versiju kļūst lielāka un dažkārt lēnāka. Jūs varat ierobežot to skaitu failā wp-config.php:

define( 'WP_POST_REVISIONS', 20 );

Nodarbība 6.3 ir veltīta veco versiju sakārtošanai.

Kur redaktora darbība beidzas

Bloku redaktors veido lapas saturu. Tas, kas atrodas ap saturu (tīmekļa vietnes galvene, izvēlne, kājene), pieder tēmai. Bloku tēmas gadījumā to rediģējat Vietnes redaktorā (Izskats > Redaktors), izmantojot tos pašus blokus; klasiskas tēmas gadījumā to darāt Tēmas pielāgošanā un pie Logrīkiem (nodarbība 5.1). Ja izmantojat lapu veidotāju, piemēram, Elementor vai Divi, strādājat šajā programmā, nevis bloku redaktorā; tā trūkumus aplūko nodarbība 5.1.

Kopsavilkums

• Lapa sastāv no blokiem, ko Jūs novietojat vienu zem otra, blakus un vienu otrā; WordPress tos saglabā kā HTML ar komentāru zīmēm.
• Saraksta skats un slash komandas padara veidošanu ātru un precīzu.
• Izmantojiet virsrakstus struktūrai (H2, H3), nevis fonta lielumam.
• Modeļi ietaupa darbu; sinhronizēts modelis mainās visur vienlaicīgi.
• Melnraksts, plānošana, privāts statuss un versijas dod Jums kontroli pār to, kas un kad ir redzams, kā arī ceļu atpakaļ.

Tests (quiz)

Uzdevums

Uzdevums D4.1: Izveidojiet lapu ar blokiem. Izveidojiet melnraksta lapu "Par mums" ar: H2 un H3, vismaz divām rindkopām, attēlu ar alt tekstu, slejas bloku ar divām slejām, pogu ar saiti un modeli no bibliotēkas. Pārveidojiet vienu grupu par savu sinhronizēto modeli un ievietojiet to otrā melnraksta lapā. Pēc tam pielāgojiet to vienā vietā un apskatiet, kas notiek citās lapās. Visbeidzot, atjaunojiet kādu iepriekšēju versiju. Atzīmējiet katru soli un divos teikumos aprakstiet, kad izmantotu sinhronizētu modeli un kad ne.

Papildu lasāmviela

Par darbu pašā WordPress vēl nav mūsu pašu rakstu; WordPress oficiālā dokumentācija ir plaša.

• Bloku redaktors (wordpress.org, angļu valodā): https://wordpress.org/documentation/article/wordpress-block-editor/
• Modeļi (wordpress.org, angļu valodā): https://wordpress.org/documentation/article/block-pattern/
• Versijas (wordpress.org, angļu valodā): https://wordpress.org/documentation/article/revisions/