Demo: EBT Blokovi

25/05/2025, by Ivan

Korišćenjem EBT modula lako možete da podesite landing stranice bez ikakvog znanja HTML/CSS-a.

Lako za korišćenje sa Layout Builder-om i Drupal blokovima

EBT moduli kreiraju tipove blokova koje možete koristiti u Layout Builder-u:

EBT Layout Builder

Tako možete dodati novi blok u nekoliko klikova na bilo kojoj stranici sa layout builder-om.

Evo više informacija o Layout Builder modulu:

https://www.drupal.org/docs/8/core/modules/layout-builder

Sadržaj bloka i Podešavanja

Na formi za uređivanje bloka pronaći ćete dve kartice – Content i Settings. Kartica Content sadrži polja: naslovi, tekstovi, slike itd. Kartica Settings sadrži zajednička EBT podešavanja "Design Options", na primer DOM Box, i podešavanja specifična za modul: podešavanja javascript dodatka, unapred definisani stilovi:

Drupal EBT block settings

DOM Box: margine, ivice, unutrašnja odstojanja

Svaki EBT blok ima DOM Box podešavanja za definisanje razmaka ispod i iznad bloka i unutrašnjih odstojanja unutar bloka:

EBT Design Options

Možete postaviti ivicu samo na jednoj strani, na dve strane ili na svim stranama. Ne zaboravite da unesete veličinu ivice u DOM Box-u, bez toga ivica se neće pojaviti.

Pozadinska boja, slika ili video

Svi EBT tipovi blokova imaju podešavanja pozadine. Podržavaju pozadinsku boju, slike i udaljene video snimke bazirane na Media modulu.

EBT background image

Igrajte se sa DOM Box podešavanjima da biste blokove učinili vizuelno boljim, probajte da dodate dodatna unutrašnja odstojanja, margine ili ivice. Evo primera EBT Accordion/FAQ modula:
https://www.drupal.org/project/ebt_accordion

Pozadinski video

EBT blokovi trenutno podržavaju samo YouTube pozadinske video snimke.

ČPP

Gde se programeri okupljaju?

U Stack Overflow lounge-u.

Možeš li mi dati notu programske muzike?

U polju Background Image Style možete izabrati ponašanje za pozadinsku sliku. Ako je vaša slika premala, pokušajte da izaberete "Cover" ili "Parallax" kako biste uklopili pozadinsku sliku u ceo blok:

Background Image Style

Blokovi od ivice do ivice

Vrlo često na landing stranicama potrebno je imati pozadinu pune širine i centriran sadržaj. U EBT podešavanjima imate opciju "Edge to Edge" kojom možete da podesite blok da zauzima punu širinu spoljnog kontejnera:
Edge to Edge setting

Rezultat:

ČPP

Koje je značenje života?

Koji je najpopularniji problem u programiranju?

Nedostaje tačka-zarez.

Koje dve reči je svaki programer prvo naučio da ispiše u kodu?

„Hello, world.”

Gde su programeri naučili da programiraju?

Na Stackoverflow univerzitetu.

Koje je zlatno pravilo u programiranju?

Ako radi, ne diraj ga.

Container Max Width pomaže da podesite širinu sadržaja unutar Edge to Edge bloka. Pošto blok postavljamo na punu širinu, potrebno je da definišemo širinu za tekst. Ponekad imamo različite širine za različite blokove. Možete promeniti vrednosti za Container Max Width klase, a podrazumevano EBT nudi sledeće širine kontejnera:

Auto (100%) - puna širina za tekst kontejner
xxSmall - 280px
xSmall - 480px
Small - 780px
Default - 960px
Large - 1120px
xLarge - 1320
xxLarge - 1600

Unapred definisani stilovi

Obično EBT moduli imaju niz unapred definisanih stilova. To pomaže da uštedite vreme pri stilizovanju novog komponenta na vašoj landing stranici. Takođe možete kreirati sopstveni stil i dodati ga u EBT modul.

Predefined styles

Rezultat:

ČPP

Kao programer, gde vidiš sebe za 10 godina?

Sedim ispred računara, verovatno programiram.

Možeš li sažeti život programera u četiri reči?

Jedi. Spavaj. Programiraj. Ponavljaj.

Kako programeri uživaju u životu?

Kada vide da njihov kod radi bez greške.

Koja je najveća laž u računarskom programiranju?

HTML je programski jezik.

Unapred definisani stilovi verovatno neće odgovarati vašem sajtu, tako da ih možete prepisati u prilagođenoj temi. Ako pronađete grešku ili želite da predložite unapređenje za stilove ili funkcionalnost EBT modula, slobodno otvorite tiket na drupal.org za odgovarajući EBT modul.