Okvir je područje na web-mjestu (prozoru) u kojem je vidljiva druga web stranica. Webmasteri koriste ovu priliku da pokažu početnu stranicu web-mjesta svojih prijatelja ili partnera. Ista tehnika se koristi za prikaz obrasca za pretraživanje u okvirima s rezultatom pored njega, itd.
No uglavnom se okviri koriste u izradi velikih web portala, gdje je potreban znatan broj stavki izbornika i podizbornika. Za takve obično kažu: "web stranica na okvirima". Za stvaranje takvog resursa potrebno je dobro poznavanje HTML-a.
Izrada okvira u alatu za izradu web stranica
Neki graditelji web stranica omogućuju automatsko generiranje takvog koda. Obično se gumb za dodavanje okvira nalazi u glavnom izborniku programa. Prvo morate postaviti pokazivač na pravo mjesto na stranici, zatim kliknite gumb, otvorit će se prozor (kao što je prikazano na snimci zaslona). U njemu možete postaviti adresu stranice koja će se otvoriti u okviru, te prilagoditi dimenzije: širinu i visinu.
No uglavnom se okviri koriste u izradi velikih web portala, gdje je potreban znatan broj stavki izbornika i podizbornika. Za takve obično kažu: "web stranica na okvirima". Za stvaranje takvog resursa potrebno je dobro znanjeHTML jezik.
Uz pomoć ove "usluge" moguće je kreirati nekoliko okvira na stranici, ali na ovaj način nećete dobiti međusobno povezane elemente.
Okviri u CMS-u
U mnogim programima za izradu web stranica moguće je instalirati odgovarajući modul. Na primjer, za Joomla, okvir je "Wrapper" modul.
Može se pronaći i kreirati na Joomla CMS upravljačkoj ploči: "Proširenja" - "Upravitelj modula" - "Kreiraj" (okrugli narančasti gumb sa znakom plus unutra). U skočnom prozoru, na popisu, vidjet ćete modul "Wrapper".
Ako nije ovdje, nije uključeno. Da biste ga koristili, prvo ga trebate aktivirati ovdje: kartica "Proširenja", zatim "Upravitelj proširenjima", zatim kartica "Upravljanje". I tražimo na popisu koji se otvori, za brzo pretraživanje u polje "Filter" unesite riječ: Wrapper. Nasuprot ovog modula trebala bi biti zelena ikona s kvačicom iznutra. Crveni krug s točkom unutar znači da je ovaj dodatak onemogućen.
Nakon ovog postupka, možete se vratiti na "Upravitelj modula", kreirati okvir i postaviti njegove parametre.
Kao što možete vidjeti na slici, modul vam omogućuje postavljanje: naslova iznad okvira, položaja modula, odabir stranica stranice na kojima će se prikazati. I također prilagodite širinu, visinu; dodati okvir i zapravopoveznica na web stranicu. Ako u okviru želite prikazati glavnu stranicu web-mjesta u punoj širini, tada 100%, postavljeno prema zadanim postavkama, neće biti dovoljno. Možete odmah sigurno staviti 400%. Visina od 200 obično je dovoljna za prikaz gornjeg izbornika stranice. Sav ostali sadržaj bit će vidljiv ako korisnik (posjetitelj web stranice) koristi traku za pomicanje.
Evo primjera što je okvir u Joomli.
Jumla modul za izradu okvira vrlo je zgodan i jednostavan za korištenje. Međutim, njegove su mogućnosti ograničene, kao i mogućnosti konstruktora.
Povijest i stvarnost
U praksi izrade web stranica iz okvira, ova oznaka (njena primjena) odavno je izblijedjela u pozadini. Mogli su ih zamijeniti moduli, postavke u konstruktorskim programima koji generiraju kod za web stranicu bez sudjelovanja graditelja web stranica. Međutim, u nekim slučajevima to nije dovoljno. Na primjer, kada je okvir holistička složena struktura područja prikazanih u pregledniku. Tako to vide vlasnici kompleksno strukturiranih stranica. Njegova se izrada koristi samo u ekstremnim slučajevima, budući da se okvirne stranice stvaraju isključivo uz pomoć specijaliziranih oznaka.
Složeno strukturirane web-lokacije
Za njih je stvaranje nekoliko međusobno povezanih okvira najbolje rješenje za organiziranje sadržaja na stranicama resursa. To su u pravilu veliki portali koji svake godine postaju sve jači.
Kako postići isti rezultat? Kako se stvara struktura okvira?
Kakoumetni okvir u kod stranice
Okviri u HTML-u se dodaju pomoću oznaka:
- okvir (za zasebni prozor);
- frameset (koristeći ga za stvaranje cijele strukture);
- iframe ("plutajući" okvir);
- noframes (u slučaju da okvir nije prikazan u korisničkom pregledniku).
Prva navedena oznaka uvijek stane u par i. I zamjenjuje i. A uz pomoć odgovarajućih atributa možete prilagoditi karakteristike svakog elementa: naziv (name=), veličinu (cols=i rows=), prisutnost obruba (bordera), izgled trake za pomicanje i, naravno, poveznica na web stranicu za prikaz.
Varijacije dizajna
Cijela stranica stranice može se podijeliti na područja. Na primjer, ovako:
| Lijevo | Gornji okvir |
| desno |
Takva struktura (zove se ugniježđena) može se dobiti pisanjem atributa cols unutar oznake, što znači položaj okvira vodoravno, a redaka - okomito. Zatim se stavlja znak=i propisuju dimenzije. Na primjer, 60%, 40% - postotak (jedan prozor će zauzeti 60% prostora preglednika, drugi, odnosno 40%). Ili 100, 200 - omjer slike u pikselima. Veličina jednog od okvira uopće se ne može postaviti (postavit će se prema zadanim postavkama). Da biste to učinili, nakon ili prije zareza morate navesti simbol.
Ugniježđenjesvako novo područje je označeno novim okvirom.
Primjer koda:
Napominjemo da su u našem primjeru, za drugi i treći okvir, veličine navedene samo jednom.
Mnoge ideje omogućuju vam da dovršite okvire. Primjeri njihovog položaja u prozoru preglednika mogu se navoditi beskonačno (shodno tome mijenjajući kod). Međutim, ove informacije već dugo nisu našle praktičnu primjenu. Okviri, ako se danas koriste prilikom izrade web stranica, samo su u obliku modula u besplatnom CMS-u ili u obliku iframea.
Plutajući okvir
Čudno zašto je dobio takav naziv, ovdje je prikladnija riječ "ugrađeni". Ovaj okvir je stvoren za prikaz sadržaja datoteke. Prenesete bilo koji dokument ili datoteku u bazu podataka, napišete put do njega pomoću iframe oznaka - i posjetitelji će vidjeti tekst datoteke (videozapis ili sliku). Nažalost, preglednici ne prikazuju uvijek sadržaj. Da bi to učinili, graditelji weba unose frazu između početne i završne oznake: "Vaš preglednik ne prikazuje sadržaj."
Na primjer, Seopult.ru je dobro poznata usluga za majstore promocije. Samo ne njegova glavna stranica, već ogledalo I.seopult.pro, kreirano za klijente portala. Iframe kod je napisan ovdje na sljedeći način:
Upute
. Gdje je oznaka
-
je stvoren za definiranje stavke popisa. Podržavaju svi preglednici.
Na samoj stranici ogledala možete vidjeti riječ "Uputa" u obliku gumba. Klikom na nju u sredini prozora preglednika otvara se prezentacija.
Sve velikoweb-mjesta za gledanje filmova i serija izrađuju se pomoću iframe-a (na primjer, "Imhonet"), kao i društvenih mreža. Čak i glavna stranica "Yandexa" sadrži ovu oznaku i više od jednog para.
Kako napisati iframe
Možete prenijeti dokument u obliku prozora s trakom za pomicanje na bilo koje mjesto na stranici. Obično se oznake postavljaju unutar tijela. Iznad standarda
i, kao što je prikazano u gornjem primjeru, može se koristiti i oznaka popisa -
-
Atributi se dodaju u iframe:
- širina (širina) i visina (visina=);
- poravnanje rubova;
- uvlake koje se mogu ili ne moraju specificirati: zadana vrijednost je 6 - ovo je sasvim dovoljno;
- koristeći dopusti transparentnost, možete postaviti transparentnost područja okvira tako da se vidi pozadina stranice;
- plus poznati scr, naziv, pomicanje, obrub.
Navigacija pomoću iframea
Najzanimljivija vještina uokvirivanja je pisanje koda koji vam omogućuje otvaranje sadržaja u prozoru putem linka, što su i napravili kreatori ogledala Seopult, samo s nekoliko veza odjednom (istovremeno dostupnih korisniku na ista stranica).
Za to se uzima iframe, u njega se dodatno upisuje ime kroz name=. Na primjer, zaglavlje. Nadalje, ispred nje se u tagovima i poveznicama upisuje preko HREF=uz obaveznu naznaku atributa iza njih. Prije upotrebe završne oznake a označava se natpis koji će služiti kao link-gumb. Oznake "a" otvaranje i zatvaranjenalaze se u oznaci p.
Možete napisati nekoliko takvih redaka u kodu kako biste na kraju dobili nekoliko gumba veza u jednom redu na web-mjestu, klikom na koji će se različit sadržaj prikazati u prozoru ispod.
Kôd će izgledati ovako:
Objavi oglas
Pogledajte oglase
Image Kako će izgledati na web stranici:
Kako umetnuti iframe u Joomla stranicu
Kao standard, Joomla upravljačka ploča ima omogućen (spreman za korištenje) modul "HTML-code". Pomoću njega možete umetnuti bilo koji kod bilo gdje na stranici. Međutim, on tvrdoglavo ignorira kod s oznakom iFrem. Stoga ćemo koristiti poseban Jumi modul.
Prije svega, trebate ga preuzeti s Interneta i instalirati putem Joomla administrativne ploče: "Extensions" - "Extension Manager" - "Select File". Navedite put do preuzete arhive i kliknite "Preuzmi".
Nakon uspješne instalacije idite na "Upravitelj modula" i kreirajte novi. Odaberite vrstu Jumija. U prozoru koji se otvori, u polje "Custom Code" unesite pripremljeni iFrem, kao što je prikazano u prethodnom stavku članka. Modulu dajte naslov, odredite položaj položaja i stranice web-mjesta. Kliknite spremi i provjeri.
Preglednici i okviri
Svi popularni preglednici dobro prikazuju sadržaj prozora okvira: Chrome, Safari, Firefox, Android, iOS. Internet Explorer i Opera imaju posebno visoku stopu u tom pogledu. A opet nema jamstvada će posjetitelj vaše stranice vidjeti sadržaj svih prozora. U tom slučaju trebate ostaviti poruku pomoću oznake noframe (otvaranje i zatvaranje). U njega možete unijeti sljedeće: "Vaš preglednik je zastario. Ažurirajte verziju za prikaz sadržaja stranice." Ako korisnikov preglednik ispravno generira okvire, neće vidjeti ovu poruku.
Dakle, okvir je područje ili prozor web-mjesta koji ima vlastiti URL. Koristi se za prikaz nekoliko web stranica ili neovisnih dokumenata u jednom polju preglednika odjednom, koji također imaju vlastiti URL. Unatoč činjenici da vam okviri omogućuju dobro organiziranje složenog web mjesta, oni se već dugo ne koriste, osim iframea. Korištenje ove oznake i dalje je relevantno za učitavanje prezentacija, video playera, tekstualnih dokumenata u određenom prozoru. Aktivno ga koriste veliki i dobro poznati web resursi.
-
