itticherka@gmail.comZOOM worldwide

Gutenberg u poredjenju sa Elementorom

Gutenberg u poredjenju sa Elementorom

  • Gutenberg i Elementor: Što biste trebali znati
  • Život prije ere Elementara i Gutenberga
  • Za što su oboje dobri?
    • Osnove besplatne verzije Elementor
    • Osnove verzije Elementor Pro
    • Osnove Gutenberga
    • Gdje započeti s Gutenbergom, a nastaviti s Elementorom? 
  • Prednosti i nedostaci Elementara i Gutenberga
    • Gutenberg
    • Elementor
  • Gutenberg: Kamo je krenuo?
  • Sve je u brzini stranica
  • Više o mišljenju programera
  • Nekoliko riječi o SEO-u
  • Donja linija

Izvor

Svet se neprestano menja, zanemarujući konzervativne želje. Jedna od tih promena – izdanje VordPress 5.0 i ugrađeni Gutenbergov editor – izazvala je požar u celoj IT zajednici.

Možete se ponašati prema ovom izdanju onako kako želite, ali jedno je jasno: ne možete ga ignorisati.

Programeri su dočekali izdanje bez oduševljenja – u početku su Gutenberg i njegov neobičan interfejs, greške i sukobi sa nekim starim dodacima slomili srca mnogih. Ali ovde imamo spojler: Gutenberg će zauvek ostati s nama. Moramo se navići.

Postavlja se puno pitanja: zašto smo Gutenberg vs Elementor u našem članku stavili u isti rang, umesto da na primer stavimo Gutenberga i Divi? Za šta je Gutenberg sposoban i kakva ga budućnost očekuje? I zašto Gutenberg ima potencijal da istisne mnoge dotake/pluginove za kreiranje stranica (Page Builders).

Ali prvo, kratko odricanje odgovornosti: ne pokušavamo da uporedimo Gutenberg sa Elementorom. Naša misija je otkriti čemu se mogu suprotstaviti i videti može li Gutenberg dostići nivo kreatora stranica ili ne.

 

 
 

Šta treba da znate o Gutenbergu

Ukratko, Gutenberg (ver. 9.2.2) je ugrađeni VordPress editor, koji je postao glavni alat za kreiranje stranica i postova nakon objavljivanja VordPress 5.0. Možda ste i ranije sreli dodatak Gutenberg, ali razjasnimo sve: to nije ista stvar. Da, pre najnovijeg izdanja VordPress-a, mogli ste da ga dodatno preuzmete i instalirate. Sviđalo vam se ili ne, od sada je Gutenberg izvorni VordPress urednik.

Urednik se zove Johann Gutenberg, koji je stvorio prvu štampariju u Evropi i napravio revoluciju na polju štampe. Primarna ideja Gutenberg VordPress uređivača je stvaranje sadržaja uz pomoć blokova koji se koriste za svaku zasebnu stavku članka.

Gutenberg je zamenio Classic Editor, a to znači da korisnici više ne trebaju znati HTML ili CSS i primeniti gomilu kratkih kodova. To je neosporan plus za početnike. Ali imamo čitavu generaciju programera koji su mukotrpno kreirali stranice koristeći kod. Dobra vest je da će se bilo koji programer stare škole koji je upoznat sa CSS-om i temama nositi sa Gutenbergovim urednikom.? I, verovatno, poboljšajte njegovu funkcionalnost personalizovanim blokovima i dodatnim kratkim kodovima. Ali o tome više kasnije.

Gutenberg editor

Zauzvrat, šta znamo o Elementoru?

To je savremeni vizuelni dizajner bez ograničenja; možete ga koristiti i primeniti na bilo kojoj veb lokaciji izgrađenoj na VordPress-u. Intuitivno, multifunkcionalno i praktično – ovo su prve definicije koje vam padaju na pamet nakon upotrebe ovog drag-n-drop graditelja stranica za VP. Elementor radi i sa izvornim vrstama VordPress sadržaja i sa prilagođenim vrstama sadržaja.

Čak i ako imate nula znanja o kodiranju, možete da kreirate veb lokacije pomoću Elementor-a. Uredite stranicu i pogledajte kako istovremeno izgleda, zahvaljujući pogodnom front-end uređivaču. Elementor je gotovo savršen za izradu dinamičnih veb lokacija. Barem je njegova Pro verzija.

Elementor plugin

Život pre Elementora i Gutenbergove ere

Počnimo sa Gutenbergom.

Šta smo imali pre toga?

Da, imali smo Classic (Visivig) Editor zasnovan na TiniMCE. Svi su voleli stari uređivač zbog njegove jednostavnosti. Ali ova jednostavnost imala je i drugu stranu. Ne biste mogli da kreirate stranice sa nestandardnim izgledom bez uređivanja HTML koda. A rad sa Classic Editor-om zahtevao je više vremena i dublje znanje o kodiranju.

 

Source: GitHub.com

Stari VordPress urednik bio je jednostavan tekstualni prozor. Iako je to dobro funkcionisalo, morali ste da koristite različite pristupe za dodavanje slika, stvaranje galerija, kratkih kodova, video umetaka i drugih predmeta sadržaja. Stoga su programeri odlučili da naprave uređivač koji će biti dostupan ljudima bez posebnog znanja.

Novi Gutenberg VordPress urednik zamenio je prethodni pojednostavljenim postupkom pisanja, gde je svaka stavka sadržaja upakovana u blok. Možete ih premeštati po uređivaču, menjati njihova podešavanja i kreirati atraktivne izglede bez pisanja koda.

Elementor je zauzvrat bio nešto poput pronalaska novog točka, jer je Elementor tim pokušao da promeni način na koji ljudi koriste VordPress. ? Potrebe programera i dizajnera neprekidno su se sukobljavale, pa je bilo potrebno nešto svestrano što bi zadovoljilo i programere i dizajnere.

Pre je bilo teško VordPress koristiti efikasno i sveobuhvatno. Programerima je bio potreban čist interfejs i manje kontrola; ništa ih nije moralo odvratiti od kodiranja.

Istovremeno, dizajnerima je bilo potrebno što više kontrola kako bi primenili sva kreativna rešenja. Obojica su želela da naprave veb lokaciju koja će zadovoljiti različite kriterijume performansi i vizuelnih kriterijuma. I Elementor je dao takvu mogućnost.

S jedne strane, kreatori stranica i urednici olakšali su život mnogima koji žele da kreiraju veb lokacije. S druge strane, kodiranje nije postalo previše neophodno, što je izgleda nadoknadilo znanje mnogih ljudi koji su mnogo vremena posvetili proučavanju koda. Bez ravnoteže, možemo reći. Ali to nije tako tužno.

Za šta su oboje dobri?

Budite strpljivi, jer ćemo sada detaljno razmotriti funkcionalnost Elementora protiv Gutenberga.

Osnovna besplatna verzije Elementora

• Izaberite bilo koju vrstu sadržaja za prikaz.
• Uredite stranicu na prednjoj strani (blok za podešavanja vidite na levoj strani, a stranicu sa podešavanjima na desnoj strani. Sva podešavanja se primenjuju odmah, a rezultat se vidi odmah).
• Prilagodite svaki element na stranici.
• Primenite precizna podešavanja tipografije (možete primeniti sva moguća podešavanja na bilo koji element teksta, naime veličinu, zasićenost, transformaciju, stil, izgled, prored i razmak između znakova).
• Podesite prilagodljivost (Možete prilagoditi prikaz stranice pojedinačno na bilo kom uređaju. Pravo u uređivaču, prebacujte se između uređaja i postavite tačke za svaku platformu).
• Dodajte efekte pokreta.
• Koristite 30+ elemenata.
• Primenite svestrano podešavanje izgleda stranice.
• Primeni postavke elemenata, odeljaka i kolona
• Sačuvajte predloške (možete sačuvati pojedinačne odeljke ili stranice kreirane kao obrazac, zatim ih nalepiti i koristiti na drugim stranicama).

Osnovne informacije o verziji Elementor Pro

  • Prikazujete dinamički sadržaj.

  • Integriše se sa drugim uslugama/pluginovima (Elementor je kompatibilan sa mnogim nezavisnim pluginovima, tako da možete lako uspostaviti komunikaciju između njih).

  • Možete da poboljšajte funkcionalnost pomoću dodatnih vidžeta.

  • Dodavanje modalnih prozora (iskačućih prozora) Elementor ima mnoga podešavanja za kreiranje iskačućih prozora, integraciju sa drugim uslugama i uslove prikaza.

  • Galerija već ima više od 100 gotovih iskačućih opcija, koje možete odabrati i prilagoditi za svoj zadatke ili kreirajte u potpunosti od nule. u modalnom prozoru možete prikazati obrazac za pretplatu, obrazac za autorizaciju, promocije, najave, prodaje itd.).

  • Mođe se napraviti jedinstveno zaglavlje i podnožje i koristiti ih na celoj veb lokaciji ili samo na određenim stranicama, po želji.

  • Možete da dizajnirate lične teme (možete da dizajnirate sve potrebne elemente i stranice koje WordPress tema uključuje, a to su: Početna, Arhiva, Stranica 404, zaglavlje i podnožje itd.). Napravite Internet prodavnicu pomoću Woocommerce-a (Elementor takođe uključuje 15 vidžeta za stvaranje prodavnice. Kao i ostale stavke, možete ih u potpunosti prilagoditi i povezati).

  • Dodavanje efekata pokreta i paralakse – možete prilagoditi postavke pokreta za bilo koju stavku. Koristite 300+ šablona stranica. Dodajte lične fontove.

  • Primenite globalna podešavanja (sačuvaj pojedinačne elemente i postavi globalna podešavanja. Šta to znači? Ako uredite jedan element, promene će se primeniti na sve ostale povezane elemente).

Osnove Gutenberga

  • Napravite personalizovane stranice i predloške za postove.
  • Dodajte nove blokove, glatko ih pomerajte i poravnajte.
  • Primeni posebne karakteristike:


Pregled sadržaja:

  • Usidrenja (Anchor) sidrene oznake vam omogućavaju da se uputite na određeni deo dokumenta. Zaglavljima možete dodeliti sidra i umetnuti veze u sadržaj stranice. Ako na bočnoj traci izaberete blok sa naslovom, pojaviće se polje HTML sidro u koji treba da ubacite željeni tekst veze. Ekvivalentno je davanju bilo kog HTML elementa ID-om i vezivanjem za njega dodavanjem URL-a # name-of-id);
  • Dodatni CSS stilovi (ova funkcija vam omogućava da dodelite klase koje se potom mogu stilizovati u CSS. Dakle, možemo stvoriti kostur HTML stranice u Gutenbergu, a zatim sve to zasebno stilizovati u CSS datoteku. Na isti način, možete zameni bilo koji zadati stil za Gutenbergove blokove);
  • Dodajte galeriju (kao u starom uređivaču WordPress-a, možete dodati galerije slika u Gutenbergu. U postavkama bloka galerije možete odrediti broj kolona (od 1 do 8) i obrezati ili ne obrezati slike);
  • Slika na naslovnici / slika heroja (WordPress Gutenberg vam omogućava da dodate blok slike sa tekstualnim poljem centriranim vodoravno i vertikalno. U postavkama bloka možete postaviti sliku da potamni radi bolje čitljivosti i zaključati pozadinsku sliku tako da ostane lepljiva kao prelistavate stranicu);
  • Označite citate i blok citate (uz pomoć ovog bloka istaknite važan deo teksta. Blok citata ima dodatne stilove i metode poravnavanja teksta. Možete se prebacivati između dva stila prikaza klikom na traku sa alatkama);
  • Prilagođeni HTML (ovaj blok vam omogućava da dodate bilo koji HTML kod koji je obično napisan u uređivaču teksta ili datoteci predloška direktno u vizuelni uređivač. Prilagođeni HTML blok ima dugme za pregled koje prikazuje bilo kakve promene bez potrebe za njihovim čuvanjem ili pritiskom na WordPress dugme za pregled);
  • Кlasični blok teksta (ovaj blok simulira podrazumevani WordPress editor i prikazuje celu TiniMCE traku sa alatima umesto bilo kojih Gutenbergovih dugmadi. Jedina razlika od TiniMCE je opcija „Dodatna CSS klasa“ u meniju podešavanja bloka. Кlasični tekst se koristi kao zadati blok tip koji se dodeljuje kada Gutenberg ne može automatski odrediti tip bloka (pri umetanju teksta u editor) i pomaže u prelazu između starog i novog uređivača. Blok možete da premestite i izbrišete pomoću Gutenbergovih kontrola. Кada pređete na prikaz teksta Režim, ovaj blok izgleda kao čisti HTML i nije zatvoren u HTML komentaru, kao drugi blokovi);
  • Stih (takvi blokovi su namenjeni poetskim ili književnim odlomcima i uglavnom se koriste za strogo određivanje preloma redova i intervala između znakova. Na levoj strani teksta nalazi se i malo uvlačenje. Кada u bloku pasusa pritisnete enter, WordPress editor dodaje novi pasus. Opcije za uređivanje teksta su ograničene na podebljano, kurziv i precrtano);
  • Tekstualne kolone (blok Кolone omogućava vam da dodate bilo koji broj ugrađenih blokova u seriju. Pomoću klizača možete odabrati između 2 i 6 kolona, ali možete uneti bilo koji broj u polje za tekst pored nje. Možete umetnuti druge blokovi u ove kolone, uključujući ugneždene kolone);
  • Dugmad (uređivač ima blok koji omogućava umetanje dugmadi. Za dugme možete odabrati stil (ravni uglovi, zaobljeno dugme i uokvireno) i poravnati ga sa ivicama ili sredinom. Na traci sa alatkama možete odrediti boju pozadine teksta dugmeta. U uređivaču boja možete odabrati režim RGB, HEКS ili HSL);
  • Integracija dodataka (lista blokova sadrži i 5 korisnih dodataka za prikazivanje liste nedavnih unosa, komentara, arhiva, svih kategorija i prilagođenih kratkih kodova koji inače neće funkcionisati kada se ubace u bilo koji drugi Gutenberg WordPress blok).

Gde početi sa Gutenbergom, a nastaviti sa Elementorom?

Glavne stvari koje možete da uradite sa Gutenbergom su dizajniranje personalizovanih izgleda, stvaranje novih blokova, obogaćivanje stranica tekstom i medijskim sadržajem, dodavanje dugmadi i primena osnovne stilizacije.