Komponente znotraj razdelkov Container Elements in Table & Lists v urejevalniku SiteKreator omogočajo napredno vizualno in strukturno razporeditev vsebin na spletnem mestu. Z uporabo predpripravljenih vsebinskih blokov (kot so stolpčne postavitve, predstavitve ekipe in citati) ter interaktivnih elementov (kot so harmonike, označeni seznami in stisljive vrstice) lahko bistveno izboljšate uporabniško izkušnjo (UX) ter pregledno organizirate večje količine informacij.
1. Dodajanje postavitvenih elementov na spletno stran
Vsebinske komponente dodate na poljubno mesto znotraj osrednjega vsebinskega območja podstrani s sledečim postopkom:
V levem stranskem meniju kliknite ikono Dodaj vsebino (Build).
V meniju za izbiro komponente poiščite razdelek Container Elements ali Table & Lists.
Želeno komponento ali element s funkcijo povleci in spusti (drag-and-drop) premaknite na ustrezno mesto na podstrani. Modri pravokotniki bodo označili veljavna mestna področja za vgradnjo.
Po namestitvi kliknite na naslov ali vsebinski panel posameznega elementa, da prilagodite njegove specifične nastavitve ali vsebino.
2. Pregled kategorije Container Elements
Kategorija Container Elements ponuja predpripravljene večkomponentne bloke, ki združujejo besedila, slike in gumba za hiter vnos vsebin:
Stiki (Contacts): Dodatni razdelek z vgrajenim zemljevidom ter kontaktnimi podatki.
Pet stolpcev (Five Columns): Razdeli vsebinski prostor na pet enakovrednih navpičnih stolpcev.
Štirje stolpci (Four Columns): Razdeli vsebinski prostor na štiri navpične stolpce.
Mreža slik (Image Grid): Postavitev za predogled večjega števila slik v mrežni strukturi.
Slika levo in besedilo (Left image & text): Razdelek v polni širini s poravnavo slike na levi ter besedilom na desni strani.
Citat (Quote): Oblikovan blok v polni širini s poudarjenim izsekom besedila ali izjavo.
Slika desno in besedilo (Right image & text): Razdelek v polni širini z besedilom na levi ter sliko na desni strani.
Mreža prodajnih artiklov (Sale Items Grid): Mrežni prikaz izdelkov ali storitev, namenjen predstavitvi ponudbe.
Ekipa in slike (Team & Images): Dva stolpca, namenjena predstavitvi članov ekipe s sliko in opisom.
Ekipa in predogledne sličice (Team & Thumbs): Predstavitev ekipe z manjšimi predoglednimi sličicami.
Besedilo in gumb (Text & Button): Vsebriski razdelek v polni širini z besedilnim opisom ter gumbom za poziv k dejanju (Call to Action).
3. Pregled kategorije Table & Lists
Kategorija Table & Lists združuje dinamične interaktivne elemente in strukturne postavitve za strnjevanje informacij:
1. Harmonika (Accordion)
Navpični prikaz, pri katerem je lahko naenkrat odprta le ena sekcija. Ob kliku na poljubno sekcijo se vse ostale samodejno zaprejo z animiranim prehodom. Ob nalaganju podstrani se privzeto odpre prva sekcija.
Najmanjša višina v pikslih (Minimum Height in pixels): Določi fiksno spodnjo mejo višine v pikslih (
px), kar preprečuje premikanje višine spletne strani ob preklapljanju med sekcijami z različno količino besedila.
2. Označen seznam (Bulleted List)
Oblikovan seznam vsebinskih točk z uporabo oznak (bullets).
3. Stisljive vrstice (Collapsible Rows)
Vrstični prikaz, pri katerem se lahko posamezni vsebinski panel s klikom razširi ali stisne.
Privzeto stanje: Za vsako posamezno vrstico lahko v nastavitvah določite, ali naj bo ob nalaganju podstrani razprta ali stisnjena.
Animiraj prehode sekcij (Animate section transitions): Omogoča gladko animacijo razpiranja in krčenja vrstic.
4. Stolpci (Columns)
Odprte navpične vsebinske strukture, zložene vodoravno druga ob drugi.
Prikaži naslove sekcij (Display section headers): Določi prikaz naslova sekcije.
Uporabi enakomerno širino stolpcev (Distribute width equally across columns): Ohrani enako širino vseh stolpcev ne glede na dolžino vsebine znotraj njih.
Izenači višino vsebinskih panelov (Equalize height of column content panels): Samodejno izenači višino vseh stolpčnih panelov glede na najvišji stolpec znotraj elementa.
5. Mrežni stolpci (Grid Columns)
Dopolnjena različica stolpčne postavitve z natančnejšim poravnavanjem vsebin na mrežo.
4. Urejanje možnosti in nastavitve posameznih panelov
S klikom na naslov ali vsebinski panel znotraj vgrajene komponente odprete nastavitveno okno z naslednjimi parametri:
Naslov sekcije (Section Caption): Vnesite primarni naslov panela.
Podnaslov sekcije (Sub-caption): Vnesite sekundarno besedilno vrstico pod naslovom.
Povezava naslova (Link Caption): Naslov v elementih Columns ali Rows lahko povežete z notranjo podstranjo, zunanjim URL-naslovom ali odpiranjem v pojavnem oknu (Lightbox). Omogočite lahko tudi nastavitev Iskalniki nofollow (Search Engines nofollow).
Fiksna širina (Fix Width): Omogoča ročno določitev širine posameznega panela v odstotkih (npr.
25%za štiri enake dele). Če vrednost ni določena, se širina prilagaja dolžini naslova ali vsebini.Slika sekcije (Image Source): Dodajte grafični element ali ikono ob naslovu:
Privjeta slika (Default image): Slika, vidna v osnovnem stanju.
Slika ob preletu z miško (Mouse-over image): Slika, ki se prikaže, ko obiskovalec premakne kazalec miške nad naslov.
Izbrana slika (Selected image): Slika, vidna, ko je panel aktiven ali odprt (pri interaktivnih elementih Accordion in Collapsible Rows).
Položaj slike (Image Location): Določi položaj ikone ali slike glede na naslov.
5. Dodajanje, kopiranje in brisanje panelov
Za dodajanje novih panelov znotraj že ustvarjene komponente ali upravljanje obstoječih sledite postopku:
Pomaknite se s kazalcem miške nad celotni gradnik.
Na desni strani se prikaže orodna vrstica. Za dodajanje novega panela kliknite ikono + (Dodaj nov element). Odprlo se bo novo nastavitveno okno.
Preko orodne vrstice so na voljo tudi funkcije za podvajanje (Duplicate), skrivanje ali trajni izbris posameznega panela ali celotnega gradnika.
Vsebinske elemente (besedilo, slike, gumba) znotraj vsebnikov uredujete s klikom na posamezno področje ali pa v panel povlečete dodatne gradnike iz levega menija Dodaj vsebino (Build).