Kako napraviti izbornik za odabir stranice u joomli. Izrada jelovnika. Ručno prilagođavanje stilova izbornika BM Coll

Za mjesto bilo koje razine od velike je važnosti koliko je dobro stilski uređen, kako je sve "zalijepljeno". Ali u sljedećoj minuti dizajn prelazi na drugi plan, jer postaje mnogo važnije koliko je prikladno organizirano sučelje resursa, kako su materijali raspoređeni, koliko je vjerojatnije da pomoću izbornika možete doći do bilo kojeg odjeljka. A onda bi sam vlasnik projekta već trebao razmisliti o tome je li ponuda programera predložaka stvarno tako zgodna, je li ispravno i udobno raditi s pretraživanjem materijala, postoji li podjela istih članaka u kategorije? Ako se ovaj aspekt ne dovede do idealnog u početku, možete izgubiti one posjetitelje koji bi vam stvarno mogli donijeti profit, ali jednostavno nisu htjeli imati posla s neprofesionalnim resursom, jer bi u suprotnom organizacija navigacije na web mjestu bila na potpuno drugoj razini . Ali ne treba misliti da samo oni koji su predviđeni u Joomla predložak izbornika alati postaju granica s kojom morate raditi. Kako biste poboljšali strukturu i navigaciju svog projekta, možete jednostavno koristiti proširenja kao što su Joomla modul izbornika sposobni napraviti vrlo značajne promjene u ovom segmentu.

Konkretni prijedlozi za poboljšanje jelovnika

Što nam mogu ponuditi proširenja koja se nalaze u ovoj kategoriji? Prije svega, to je raznovrstan jelovnik. Najzanimljivije je to što programeri brinu ne samo o praktičnom postavljanju i radu ovih rješenja, već io tome kako izgledaju. Da biste to učinili, koristi se animacija, nude se odabiri boja, različiti fontovi za izbornik, a za njih su pripremljeni i setovi ikona. Još bolje, ovdje ćete pronaći opcije s podrškom za različiti broj razina, a to već otvara put stvaranju ozbiljnih navigacijskih sustava zahvaljujući kojima možete Joomla stavka izbornika, uđite u bilo koji odjeljak stranice ili čak u neku kategoriju. Još su zanimljivije opcije koje koriste slike koje simboliziraju svaku stavku izbornika, takvi su dodaci već na popisu koji imamo. izabrati Joomla padajući izbornik, posebni mega - izbornici, s velikim mogućnostima, kao i harmonika - Joomla 3 izbornici, koji simuliraju presavijanje obične harmonike za postavljanje sadržaja. Ali osim takvih prijedloga, ova kategorija ima još mnogo zanimljivih događaja.

Stvorite kategorije i više

Razumije se da je korištenjem različitih tematskih područja posjetiteljima potrebno omogućiti izravan pristup potrebnim materijalima, štoviše, poželjno je svaku kategoriju prilagoditi svom sadržaju. Ako vam se ne sviđa format u kojem vaše standardno sučelje prikazuje kategorije, možete koristiti odgovarajuća proširenja. Da bismo to učinili, imamo rješenja koja prikazuju kategorije u obliku sličnom padajućem izborniku, ona koja su posebno instalirana za suradnju s K2 ili jednostavno organiziraju praktičan pristup zbirkama sadržaja koji odgovaraju određenoj temi. Kao rezultat toga, čak će i vama biti ugodnije raditi sa svojim projektom, u početku raspoređujući nove pristigle na "police", jer i pretraživanje i ispravljanje takvih materijala postaju praktičniji.

Olakšajte navigaciju svojom web stranicom

Kada je projekt opremljen prikladnim izbornikom, kada su kategorije jasno raspoređene na stranici, pa čak i bez korištenja pretraživanja možete pronaći zanimljive materijale za sebe, želite raditi s takvim resursom. Osim toga, kao što je gore spomenuto, sva trenutna događanja također imaju za cilj privući pozornost svojim stilom izvedbe, jer bez toga je također nemoguće. Dakle, ako niste zadovoljni standardnim rasporedom glavnih navigacijskih elemenata na stranici, koristite proširenja iz ove kategorije za napraviti Joomla izbornik savršeno za tebe.

Pozdrav prijatelji! Zaur Magomedov je u kontaktu. U ovoj bilješci želim vam predstaviti lijepi vertikalni harmonikaški izbornik za web mjesto na Joomla 2.5 - 3.0. Ovaj izbornik je vrlo jednostavan i ne zahtijeva puno koda, na što često obraćam pažnju. Kao što izreka kaže, "Manje je bolje."

Već smo u prethodnim postovima razmatrali izradu horizontalnog izbornika i izradu horizontalnog višerazinskog izbornika za joomlu 2.5. Sada smo došli do vertikale.

Za početak pogledajte demo, kako sve izgleda, ako želite, zatim preuzmite paket s izvornim datotekama.

Pronašao sam ovaj izbornik na internetu i odlučio ga prilagoditi za Joomla cms stranicu, jer. Meni se osobno jako svidio ovaj jelovnik, kako izgledom, tako i lakoćom spajanja. Malo dotjerujući skriptu samog izbornika i css stilovi, dobio takav rezultat kao u .

Povezivanje izbornika u joomla 3.x.x

Prije svega, raspakirajte arhivu u određenu mapu na računalu. Sljedeće što ćemo učiniti jest kopirati slike iz mape slika u mapu slika vašeg predloška. Obično je u mnogim predlošcima ovo mapa sa slikama, ako je zovete drugačije, na primjer, img, tada morate promijeniti staze do slika u datoteci stilova - vmenu.css. Također moramo spojiti jednu od skripti izbornika. Predlažem da napravite mapu "js" u korijenu vašeg predloška i da u nju stavite datoteke skripti - menu.js ili menu-collapsed.js. Zašto dvije datoteke? Stvar je u tome, ako primijetite, postoje dvije opcije prikaza na demo stranici ovaj izbornik. Možete pobliže pogledati kako se razlikuju jedni od drugih. Povezujemo verziju skripte koja nam se sviđa menu.js ili menu-collapsed.js. Opcija 1 je skripta menu-collapsed.js, a opcija 2 je menu.js. Da biste to učinili, na samom početku datoteke index.php predloška umetnite sljedeće retke:

$doc = JFactory::getDocument(); // dohvati parametre
$doc->addStyleSheet(JUri::base().'/templates/'.$this->template.'/css/vmenu.css'); // uključi datoteku stila
$doc->addScript(JUri::base().'/templates/'.$this->template.'/js/menu-collapsed.js'); // spojite skriptu izbornika, u ovom slučaju to je opcija 1
?>

Potrebna nam je i biblioteka jQuery, ali u joomla3 je uključena prema zadanim postavkama, jer. koristi se okvir.

Dakle, css datoteka sadrži sljedeći kod:

/********************************
Okomiti padajući izbornik harmonika
************************************************************/
ul.vmenu(


margina: 0;
ispuna: 0;
list-style:nema;
}
ul.vmenu li(
margina: 0 0 2px;
}
ul.vmenu li a (

rub: 1px puni #D5D5D5;
-moz-border-radius: 3px;
-o-border-radius: 3px;
-webkit-border-radius: 3px;
-ms-border-radius: 3px;
rubni radijus: 3px
boja: #515151;
prikaz: blok;
ispuna: 5px 8px;
tekst-ukras: nema;
}
ul.vmenu li > a: lebdjeti, ul.vmenu li.active > a, ul.vmenu li >
ul.vmenu li.parent > a:after (

prikaz: blok;
sadržaj:"";
float:desno;
margina:8px 5px 0 0;
visina:3px;
širina:6px;
}
/* Padajuće stavke */
ul.vmenu li ul (
težina fonta: normalna
margina: 10px 0 10px 15px;
list-style:nema;
}
ul.vmenu li ul li (
pozadina: ništa;
margina:0 0 5px
}
ul.vmenu li ul li a (

granica: srednja nema;
ispuna: 0 0 0 15px;
}
ul.vmenu li ul li a:lebdjeti (color:#29719E;text-decoration:underline)
ul.vmenu li ul li.active a (color:#29719E;font-weight:bold)

/*********************
Okomiti padajući izbornik harmonike - opcija 2
************************************************************************/
ul.vmenu2(
font: bold 12px Arial,Helvetica,sans-serif;
list-style: nijedan izvan nijedan;
margina: 0;
ispuna: 0;
list-style:nema;
}
ul.vmenu2 li(
margina: 0 0 2px;
}
ul.vmenu2 li a (
pozadina: url("../images/vmenu-li-bg.jpg") lijevo dolje ponovi-x;
rub: 1px puni #D5D5D5;
-moz-border-radius: 3px;
-o-border-radius: 3px;
-webkit-border-radius: 3px;
-ms-border-radius: 3px;
rubni radijus: 3px
boja: #515151;
prikaz: blok;
ispuna: 5px 8px;
tekst-ukras: nema;
}
ul.vmenu2 li > a:hover, ul.vmenu2 li.active > a, ul.vmenu2 li > a:focus (background-color:transparent; color:#0088CC)
ul.vmenu2 li.parent > a:after (
pozadina:url("../images/arrow-dropdown.png") bez ponavljanja;
prikaz: blok;
sadržaj:"";
float:desno;
margina:8px 5px 0 0;
visina:3px;
širina:6px;
}
/* Padajuće stavke */
ul.vmenu2 li ul (
težina fonta: normalna
margina: 10px 0 10px 15px;
list-style:nema;
}
ul.vmenu2 li ul li (
pozadina: ništa;
margina:0 0 5px
}
ul.vmenu2 li ul li a (
pozadina: url("../images/vmenu-arrow.png") pomicanje bez ponavljanja 5px centar proziran !važno;
granica: srednja nema;
ispuna: 0 0 0 15px;
}
ul.vmenu2 li ul li a:lebdjeti (color:#29719E;text-decoration:underline)
ul.vmenu2 li ul li.active a (color:#29719E;font-weight:bold)

NA dana datoteka sadrži stilove obje opcije i možete izbrisati stilove opcije izbornika koja vam nije potrebna.

Sada kada imamo sve stvorene stavke, možemo kreirati modul s kojim ćemo prikazati naš izbornik na jednoj ili drugoj poziciji modula predloška. Izabrao sam lijevi stupac. Idite na upravitelj izbornika i kliknite na vezu "Dodaj modul za ove vrste izbornik" nasuprot našem stvorenom izborniku. Modul izbornika možete kreirati i na sljedeći način - idite na upravitelj modula: Proširenja -> Upravitelj modula -> Kreiraj -> Izbornik (odaberite tip modula).

Idi na karticu " Dodatne mogućnosti". Ovdje UNESITE RAZMAK i umetnite sufiks klase izbornika - vmenu. Čemu služi? Uostalom, na stranici može postojati više od jednog jelovnika, a kako se njihovi stilovi ne bi presijecali, uvodimo alternativnu klasu nenumeriranom popisu jelovnika. Ako vam se svidjela druga opcija za prikaz izbornika, tada kao sufiks također unesite kroz razmak - vmenu2.

Sve, nakon što su postavke napravljene, spremite modul. Ako ste sve napravili kako treba, na vašoj će se stranici pojaviti izbornik koji izgleda kao onaj na.

Da vas podsjetim još jednom! Na demo stranici postoje dvije opcije izbornika i sigurno ćete izabrati jednu od njih. U ovom slučaju nema potrebe uključiti obje datoteke skripte, dovoljna je samo jedna.

• Datoteka menu-collapsed.js. - ovo je naša opcija 1 - Harmonika meni - opcija 1
• Datoteka menu.js je naša opcija 2 - Accordion izbornik - opcija 2
• Sufiks klase izbornika (odvojen razmakom) za opciju 1 je vmenu
• Sufiks klase izbornika (odvojen razmakom) za opciju 2 je vmenu2

Na temelju toga spojite datoteku koja vam je potrebna. Također u css datoteci možete ukloniti stilove za opciju koja nam nije potrebna, kako ne biste ponovno učitavali dodatne kilobajte.

Povezivanje izbornika u joomla 2.5.x

Povezivanje izbornika u joomli 2.5 ne razlikuje se od povezivanja u joomli 3, osim što dodatno moramo spojiti jQuery biblioteku. Da biste to učinili, dodajte sljedeći redak gornjem kodu:

$doc->
?>

Dobit ćemo nešto poput ovoga:

$doc = JFactory::getDocument(); // dohvati parametre
$doc->addScript('http://code.jquery.com/jquery-latest.min.js'); //uključuje najnoviju verziju jQuery biblioteke
$doc->addScript(JUri::base().'/templates/'.$this->template.'/js/menu-collapsed.js'); //spojite skriptu izbornika, u ovom slučaju to je opcija 1
?>

I još nešto. U joomli 2.5 ne postoji vrsta stavke izbornika System Links -> Header, postoji samo vrsta separatora teksta - Separator, ali ova vrsta stavke nam neće odgovarati, jer. naslov stavke izbornika neće biti uokviren vezom. U ovom slučaju trebate odabrati vrstu "Vanjski URL" i umetnuti stub - # kao url. Sve ostalo je isto.

To je sve što sam htio reći. Ako nešto ne uspije (možda sam negdje pogriješio u tekstu), postavite pitanja u komentarima. Pozdrav svima, vidimo se u sljedećim postovima!

Pozdrav drugovi! U ovom članku ćemo završiti ono što smo započeli u prethodnom postu, odnosno omogućit ćemo prikaz materijala na stranici. Danas ćemo kreirati stavke izbornika u Joomli 3.6. Upravo su stavke izbornika najvažnija komponenta bilo kojeg internetskog izvora jer igraju značajnu ulogu u glavnoj navigaciji stranice.

Početnici, neiskusni graditelji stranica dugo vremena ne mogu shvatiti odnos koji se vidi između stvaranja materijala, stvaranja kategorija i stvaranja izbornika. Ali s vremenom ćete shvatiti čemu služi i kako s njim raditi. Kao što sam ranije spomenuo za CMS Joomla 3.6, materijal koji stvarate mora biti povezan s kategorijom. Ali to nije sve, kako bi se članak prikazao na stranicama stranice, potrebno je izraditi izbornik.

Programeri su osigurali veliki izbor izlaznih stavki izbornika. Dodajmo stavke u postojeći Joomla glavni izbornik.

Stvorite osnovnu stavku izbornika

1. U administrativnoj ploči Joomla na vrhu nalazimo odjeljak - Menu / Main Manu / Create menu item.

2. Na sljedećoj stranici napišite "Naslov izbornika". Ostavite polje Alias ​​​​prazno. To je zbog činjenice da će nakon kreiranja naziva izbornika sustav automatski napisati sve što vam je potrebno u njemu. Ovo se također odnosi na materijale i kategorije za koje pišete naslov.

3. Vrsta stavke izbornika- ovo je važan dio odgovoran za izlaz materijala. Kliknite za odabir.

U prozoru koji se otvori nalazimo "Materijali", gdje trebamo odabrati jednu od prikazanih opcija. Na svojoj web stranici 99% vremena koristim "Popis kategoriziranih materijala".

4. Sada kada ste se odlučili i odabrali gornju vrstu izbornika, trebate napraviti " Odabir kategorije". Prema zadanim postavkama, sustav će prikazati Nekategorizirano. Ovdje trebate odabrati kategoriju koja će biti povezana s izbornikom. U budućnosti je moguće promijeniti uvez. Dakle, ako ste greškom priložili nešto što niste željeli, to uvijek možete popraviti odlaskom na Joomla izbornik.

5. U desnom dijelu prozora nalaze se postavke koje se odnose na zaslon. Status - odaberite "Objavljeno". Glavna stranica - mislim da je sve jasno. Ako je odabrano, sav sadržaj kategorije bit će prikazan na glavnoj stranici. Također možete postaviti nadređeni element. Zadana postavka je stavka glavnog izbornika. Ovaj odjeljak ima važnu ulogu jer vam omogućuje stvaranje podizbornika glavnog izbornika odabranog na traci. Ali budući da zasad imamo samo jednu stavku jelovnika, nema se što posebno vezati.

6. Kao rezultat toga, stavka izbornika koju smo kreirali mora biti "Spremi" klikom na jedan od odgovarajućih gumba u gornjem lijevom dijelu ekrana.

Stvaranje stavke izbornika s jednim prikazanim materijalom

Ako želite da izbornik prikazuje jedan artikl, morate se vratiti na Vrsta stavke izbornika/Materijali/Materijal. I u stupcu "Izbor materijala" odaberite odgovarajući materijal. Nadalje, sve je identično gornjoj metodi.

Sada možete otići na glavnu stranicu web-mjesta i provjeriti postoji li i radi li svježa Joomla stavka izbornika i sadržaj koji se nalazi u njoj.

Nadam se da sam vam uspio pomoći. Ako imate pitanja, postavite ih u komentarima.

Hvala vam na pažnji i vidimo se uskoro na stranicama Stimylrosta.

Pronašli ste gramatičku grešku u tekstu? Obavijestite administratora o tome: odaberite tekst i pritisnite kombinaciju tipki prečaca Ctrl+Enter

U ovoj lekciji o Joomla modulima, pokazat ću vam odličan modul za prikaz izbornika na stranicama web mjesta.

Gdje leži?

Direktorij modula "Izbornik" nalazi se u /modules/mod_menu direktoriju korijenske mape web mjesta. Direktorij sadrži standardne datoteke za module sustava:

• tmpl imenik;
• helper.php datoteke;
• mod_menu.php
• mod_menu.xml.

Zašto je to potrebno?

Modul Izbornik na Joomla stranici potreban je za prikaz bilo kojeg prethodno napravljenog izbornika stranice na bilo kojoj odabranoj poziciji modula.

Ovaj modul ne preuzima stil padajućeg izbornika i prikazuje stavke izbornika kao popis. To znači da korištenje ovog modula na poziciji predloška za glavni izbornik NEĆE dati padajući izbornik, već će prikazati stavke izbornika na popisu.

Podsjetit ću vas da za izradu padajućeg izbornika web mjesta morate u postavkama predloška navesti koji ste izbornik odabrali kao glavni.

Kako stvarati?

Za izradu modula izbornika morate imati odgovarajuća prava. Prema zadanim postavkama, samo super administrator može kreirati ovaj modul.

• Iz glavnog izbornika administrativne ploče idite na karticu Moduli;
• Na alatnoj traci kartice kliknite gumb "Stvori";
• Iz popisa vrsta modula odaberite vrstu Izbornik;
• Ispunite postavke modula izbornika na 4 kartice. štedimo;
• Cijeli izbornik je kreiran, nakon brisanja predmemorije, stranica će se pojaviti na stranici.

Postavke modula izbornika Joomla

Pogledajmo 4 kartice postavki modula izbornika.

Kartica 1 - Modul

Glavna kartica postavki. Ovdje

Obavezno ispunite naziv modula;

Ako želite sakriti naziv modula, odmah ga sakrijte u postavci desno "Prikaži naslov";

U poljima postavki potrebno je: odabrati sam izbornik koji želite prikazati (1), odabrati osnovnu stavku izbornika (2), odrediti početnu (3) i završnu stavku izbornika (4) te odlučiti o prikazu podtočaka izbornika (5).

Postavkom (2) možete pomicati izbornik unutar osnovnog izbornika sa složenom strukturom stranice. Ako uzmete preporučenu trenutnu stavku izbornika, tada će najbliža starija aktivna stavka izbornika biti odabrana kao osnovna.

Određivanje početne (3) i završne (4) stavke izbornika omogućuje vam da skratite dugačke izbornike složene strukture web mjesta. Slična namjena postavka za prikaz stavki podizbornika (5).

U desnom dijelu kartice obavezno popunite prikaz naslova (6), stanje (8) i poziciju u predlošku (7). Ostale postavke nisu obavezne.

class="eliadunit">

Zanimljiva su polja "Redoslijed", ovdje možete odmah rangirati modul koji se kreira u modulima ove pozicije. To se također može učiniti u tablici modula povlačenjem modula.

"Napomena" je kreirana za administratore stranice i vidljiva je u tablici modula.

"Započni objavljivanje" omogućit će vam planiranje izdavanja modula po datumu.

Kartica 2 - Uvez

Ovdje morate odabrati na kojim će se stranicama stranice ovaj modul prikazivati. Zadana postavka je "Sve stranice".

Odabir stranica za prikaz provodi se prema stavkama izbornika iz filtra “Na svim ...”, “Ništa”, “Samo na navedenim”, “Na svim osim navedenim”.

Na primjer, želite prikazati modul koji kreirate samo na glavnoj stranici. Da biste to učinili, u filtru odaberite "Samo na određeno" i na popisu izbornika označite samo izbornik početna stranica(odabrani materijali).

Kartica 3 - Napredne postavke

Ovdje možete postaviti jedinstveni izgled modul ako vaš predložak ima dodatne stilove modula ili ste sami izradili takve stilove modula.

Možete učiniti suprotno. Ovdje navedite bilo koji od vaših “Sufiksa klase izbornika” i “Sufiksa CSS klase modula”, a zatim dodajte vlastito CSS pravilo u ovaj modul.

Za razliku od postavki ostalih modula, postoji promjena u stilovima padajućeg izbornika Java Script (Destination position).

Kartica 4 - Prava

Ispuniti za višekorisničke stranice s više od jednog administratora.

Nakon popunjavanja svih polja potrebno je spremiti modul izbornika na Joomla stranici i nakon brisanja predmemorije pogledati stranicu.

Izlaz

U ovom vodiču pogledali smo modul Izbornik na Joomla stranici. Vrlo je koristan za stvaranje potpunog podnožja web stranice s dodatnim izbornicima za tehničku i informativnu navigaciju.

Stavke izbornika u Joomli iznimno su važne. oni čine cjelokupnu strukturu stranice. Stavke izbornika određuju što će se učitati na stranicu i kako. I sve je to određeno u jednom od odjeljaka Joomle - izborniku.

Postoje mnoge varijante ispisa po stavkama izbornika, ali se, naravno, sve rijetko koriste. Sada će se raspravljati o najpopularnijim.

Dodat ćemo stavke jelovnika gotovom Glavni izbornik Joomla, koja se prezentira odmah nakon instalacije.

Osnovna stavka izbornika

1. Idite na stvaranje stavke izbornika za jedan izbornik (Glavni izbornik).

2. Prva stvar unesite ime predviđena stavka izbornika. Dalje, prelazimo na odabir vrste stavke izbornika, gdje je odabrano njegovo odredište.

3. Pred nama je cijeli popis termina. Najčešći dio popisa je "Materijali". Izvodi jedan ili više materijala, tj. glavni sadržaj stranice.

Sada izvodimo jedan materijal.

4. Ostaje odabrati Najvažniji je sam materijal. Prolazimo novi gumb: "Odaberi".

5. Prikazat će se popis apsolutno sve materijale koje smo ikada stvorili u Joomli. Odaberite sadržaj koji želite prikazati.

6. Najvažnija stvar je učinjena! Limenka ustrajati.

7. Na stranici u postojećem "Glavnom izborniku", pojavit će se nova stavka gdje možete ići i uvjerite se da radi.

Još jedna opcija stavke izbornika

1. Stranica na koju smo došli, nakon prolaska kroz stavku izbornika, može biti potpuno drugačiji, kao npr blog kategorije.

2. Za kategorije blogova pojavljuje se novi gumb gdje je potrebno odabrati jednu od kategorija. Kategorije su potrebne jer oni su ti koji dijele svu raznolikost materijala. Na primjer, možete uzeti standardnu ​​kategoriju u koju su svi materijali podijeljeni prema zadanim postavkama.

3. Na stranici je sada dostupna nova stavka izbornika, kada kliknete na njega, prikazuje se nekoliko materijala odjednom. su zapravo izlaz svi materijali kategoriju koju smo odabrali i čak su podijeljeni na stranice.

Ovo je samo mali dio mogućnosti Joomle da prikaže sadržaj stranice. Možete prilagoditi svaku sitnicu i otkloniti pogreške u stranicama prema svojim zahtjevima: prikazati kontakte, vanjsku vezu, vezu za preuzimanje i još mnogo toga.

Ako želite skrenuti okomiti izbornik uhorizontalnazatim pogledajte tutorial: