Začne se s skrbnim načrtovanjem. Če želite ustvariti spletno stran, se morate odločiti za njeno temo in izbrati dizajn, ki bo odražal to temo. Izdelava spletne strani na uCoz je enostavnejša, saj ima sam sistem že vgrajenih veliko zanimivih dizajnov, ki jih lahko preprosto spremenite po svojih željah.

Predloga spletnega mesta- nabor strani, grafičnih in storitvenih datotek, oblikovanih in postavljenih v HTML, ki jih je mogoče uporabiti za ustvarjanje standardne spletne strani katere koli vrste. Predloge spletnih strani so praviloma sestavljene iz grafičnih datotek v običajnih formatih (PNG, JPEG, GIF), ki so nameščene v ločeni mapi; statične html strani in datoteke slogov (CSS), v nekaterih primerih pa tudi Flash.

Preprosto povedano, predloga je videz (dizajn) vaše spletne strani, ki je enak na istovrstnih straneh. Zahvaljujoč obstoju predlog vam ni treba pisati iste kode na vsaki strani: vstavite logotip spletnega mesta, naredite naslove iste barve itd.

Predloga spletnega mesta je običajno sestavljena iz ogrodja in dejanskega dizajna. Okvir je osnova, kot okostje: bloki, črte, tabele, v katere bo nanizan dizajn. In dizajn je lepota vaše spletne strani (barve besedila, pisava, ozadje, slike itd.). Danes lahko prenesete veliko že pripravljenih predlog za katero koli spletno mesto, da ne bi znova odkrivali kolesa.

Spletna mesta uCoz – Upravljanje oblikovanja

Najprej bi rad omenil, da imate po izdelavi spletnega mesta možnost izbrati dizajn med ogromnim številom predlaganih.

Na vrhu se nahaja prvi Globalni blok. To je osnova vaše zasnove. Ta blok je sestavljen iz vsebnikov, njihovo število pa je odvisno od zasnove vašega spletnega mesta.

Vrh strani— glava spletnega mesta, grafike, risbe itd.

Spodnji del mesta— spodnji del spletnega mesta je urejen, tu lahko postavite števce.

Prva posoda (levo)— bloki, ki so na levi, so urejeni.

Druga posoda (desno)— bloki, ki so na desni, so urejeni.

Sploh nima smisla posegati v prvi in ​​drugi vsebnik, saj ju je veliko bolj priročno urejati s Konstruktorjem v skrbniški vrstici s samega mesta. (V članku "Upravljanje spletnega mesta. Prvo urejanje")

Predloge strani spletne strani Ucoz

Skoraj vsak uCoz spletni modul je sestavljen iz naslednjih predlog strani:

Glavna stran modula— stran, na kateri so prikazana gradiva vseh rubrik in kategorij (splošen seznam gradiv)

Stran s seznamom gradiva rubrike- stran, na kateri so prikazani materiali iz ene rubrike (koliko rubrik - toliko strani, morda na spletnem mestu uCoz ni niti enega razdelka)

Stran s seznamom materiala kategorije— stran, na kateri so prikazani materiali ene kategorije (mesto mora imeti vsaj eno kategorijo)

Vse zgoraj naštete strani imajo skoraj enak videz.

Stran gradiva in komentarji k njej— stran, na kateri se neposredno nahaja material, ki ste ga dodali (članek, datoteka, fotografija itd.)

Vrsta gradiva - kako bodo gradiva videti v seznamu gradiv na navedenih prvih treh straneh: Glavna stran modula, Stran s seznamom gradiv rubrike in Stran s seznamom gradiv kategorij.

Stran za dodajanje/urejanje materialov— oblika dodajanja materiala.

Vse te strani ustrezajo predlogam z istim imenom. Takoj razumete, kaj točno in kje želite spremeniti. In tudi če še vedno slabo razumete, kaj storiti z vsem tem. Naredite varnostno kopijo predloge in lahko eksperimentirate.

Zelo kmalu boste razumeli, kaj je kaj!

Tukaj je enostavna primer: Recimo, da želite, da je vaše ime napisano na VSEH straneh vašega spletnega mesta. Če želite to narediti, morate le napisati svoje ime v predlogo »Urejevalnik strani« in vaše ime se bo samodejno pojavilo na vseh straneh.

Ali pa želite, da se vse datoteke prenesejo s pritiskom na določeno tipko, to morate le enkrat registrirati na ustreznem mestu (Imenik datotek - Vrsta gradiva in komentarji k njemu) in se nikoli več ne vrniti na to temo.

Toda to so preprosti primeri; v resnici so te možnosti veliko, veliko širše. Poleg tega je na internetu že veliko pripravljenih primerov, kjer preprosto kopirate kodo in jo prilepite v svojo predlogo in vaše spletno mesto lahko pridobi želene funkcije.

Pravzaprav je zelo priročno. In takoj, ko poskušate nekaj spremeniti in začnete uspevati, mislim, da se bo kmalu vaše spletno mesto hitro spremenilo do neprepoznavnosti, na primer, to spletno mesto je predelana standardna zasnova uCoz št. 839.

Če želite biti prvi obveščeni o novih člankih na spletnem mestu!!!

Minimalistično in prefinjeno, barvno in preprosto, temno in svetlo - predloge za uCoz, široka izbira izdelave spletnih strani. Izdelovalec spletnih strani uCoz je postal priljubljen zaradi svoje preprostosti, dostopnosti in vsestranskosti. Praviloma so uporabniki tega motorja začetniki, ki se ne želijo učiti vseh vrst programskih jezikov, ampak želijo le ustvariti preprost portal. Spletne strani, ustvarjene v sistemu uCoz, so običajno igralniški portali, spletni kinematografi in Varez. Večina predlog na spletnem mestu je namenjena njihovim temam. Res je, da so v zadnjem času z razvojem pametnih telefonov mnogi začeli posvečati resno pozornost mobilnim različicam spletnih mest, tako PDA predloge- tudi ne bo ostalo neopaženo.

Predloge za uCoz lahko razdelimo ne samo po "žanrih" - igre, filmi, programi, trgovine itd. Toda tudi v bolj globalnih razdelkih, in sicer: Brezplačno, Plačano, Edinstveno, Prilagoditve. Prilagoditve bi rad izpostavil posebej, ker je to zelo priljubljena tema, saj bi si mnogi želeli videti predloge za nekatere motorje na uCoz ali celo predloge za nekatera spletna mesta. Predvsem sem v procesu prilagajanja predlog, posameznih elementov in skriptov iz motorjev in spletnih mest tretjih oseb - za uCoz.

Niso vse (razen moje) predloge za uCoz opremljene z navodili za namestitev, zato vam bom tukaj na kratko in na splošno povedal, kako se to naredi. Nekatere predloge tudi nimajo oblikovalca, to pomeni, da se namestijo ne z namestitvijo glavne predloge - ki nastavi zasnovo za strani vseh modulov hkrati, temveč z namestitvijo predloge za vsako določeno stran posebej. Za vse ostale bo to navodilo pomembno.

Kako namestiti predloge na uCoz?

1. Prenesite arhiv s predlogo in ekstrahirajte vse datoteke iz njega. Pojdite na nadzorno ploščo in naložite potrebne datoteke v koren mesta prek upravitelja datotek ali FTP.

2. Namestitev okvirja. Kopirajte kodo žične konstrukcije in jo prilepite v graditelj predlog.

3. Nastavitev slogov. Če so datoteke slogov CSS v upravitelju datotek, vam v predlogo CSS ni treba ničesar vstaviti. To na primer počnem, ker pri uporabi posebne slogovne predloge obstaja možnost, da bo uCoz kaj "pokvaril" v okviru, na primer tak sistemski zastoj. Če pa prenesena predloga še vedno uporablja predlogo »CSS style sheet«, poiščite ustrezen dokument v svojem arhivu, kopirajte njegovo vsebino in jo prilepite v to slogovno predlogo.

Čeprav bi v tem primeru še vedno priporočal ustvarjanje, na primer, datoteke style.css in vanjo prilepite vse sloge, samo datoteko pa naložite v upravitelj datotek v mapi css in nato zapišite to datoteko s slogi v predlogo ali predloge med oznake torej .

O sistemu uCoz

UCoz je brezplačno gostovanje in ustvarjalec spletnih mest, ustvarjen leta 2005. Trenutno ima sistem več kot 20 modulov, ki vam omogočajo ustvarjanje popolne spletne strani za najrazličnejše namene. uCoz je hitro pridobil priljubljenost zaradi svoje preprostosti in dostopnosti, čeprav ga mnogi zaradi tega ne marajo, vendar pa slabosti ne zavračajo prednosti. Nekaj ​​statistike: uCoz je eden izmed 20 najbolj priljubljenih internetnih virov v Rusiji in na njem je bilo ustvarjenih že več kot milijon spletnih mest!

Danes bi rad z vami delil svojo izkušnjo implementacije graditelja oblikovanja na spletno mesto. Ker uporabljam nestandardno zasnovo, moram narediti spremembe, da bom lahko delal s spletnim mestom z oblikovalcem.

Kaj mi bo to dalo?
Prvič- priročen način za upravljanje oblikovanja spletnega mesta in blokov, ne da bi morali iti na nadzorno ploščo.
Drugič- hitro dodajanje blokov, ki jih potrebujem, ki bodo že oblikovani v dizajnu, ki ga potrebujem.
Tretjič- zmožnost uporabe zmogljivosti, ki jih zagotavlja sistem v blokih - na primer pripomočkov in pripomočkov.
Četrtič- najpomembnejša prednost. Pri ustvarjanju ogrodja bo sistem sam ustvaril vse predloge za vse module - in mi jih ne bo treba ročno spreminjati za vsak modul, ki ga uporabljam. Uporabnost je očitna – oborožite se s potrpljenjem in začnite s spremembami.

Najprej se morate prepričati, da je oblikovalnik aktiviran - to lahko preverite tako, da odprete Nadzorna plošča, Domov » Splošne nastavitve. Če želite možnost aktivirati, nadaljujte z nastavitvijo dizajna. Če želite to narediti, pojdite na Nadzorna plošča, Upravljanje oblikovanja » Graditelj predlog in uporabite pozive za pravilno oblikovanje prihodnjega okvirja. Načelo ustvarjanja okvirjev je preprosto - obstoječa struktura strani je razdeljena na določene cone glede na njihov pomen in namen. Na primer, moj dizajn s tremi stolpci, razdeljen na podobna območja za ustvarjanje okvirja, bi shematično izgledal takole:

Torej, kot lahko vidite na sliki, je okvir sestavljen iz naslednjih glavnih delov:
- v tem bloku bom postavil zgornji del (glavo) spletnega mesta.
- tukaj bo celoten srednji del strani, vključno z levim in desnim stolpcem ter srednjim delom, v katerem bo prikazana glavna vsebina. - tukaj bo spodnji del strani - števci, avtorske pravice itd. Ločeno bi se rad osredotočil na opis kode
Pri uporabi te kode obstajajo določene nianse, ki jih morate poznati. Zlasti je to posledica uporabe modula Forum. V mojem primeru, če moram uporabiti ta modul, moja struktura ogrodja predvideva, da bo modul nameščen po celotni širini strani, saj so moji vsebniški bloki vključeni v srednji blok. Pri ustvarjanju predloge za modul "Forum" sistem pogleda, kako se nahaja srednji blok, in dodeli celotno površino, ki jo zaseda, za izpis foruma. Če premaknem kodo vsebnika desnega stolpca izven meja srednjega bloka, bo forum prevzel mesto levega in osrednjega stolpca, desni pa bo ostal na mestu. Če srednje kode sploh ne uporabim, bo forum postavljen na isto mesto, kjer je prikazana ostala vsebina.

Rezultat: dizajn je razdeljen na tri velike dele, od katerih ima vsak svoj pomen. Ampak – da lahko upravljam bloke in ustvarjam predloge za vse module, moram sistemu povedati, kako bodo bloki izgledali in kje se bodo nahajali.
Ker se glavni del mesta (stolpci) nahaja v bloku
- mu dodajte potrebne kode.
Uporaba kode V svoji zasnovi določim območje, ki bo vsebovalo bloke, kot so ankete, koledar, iskanje in drugi. S temi kodami sistemu natančno povem, kje je dovoljeno postaviti nove bloke. V mojem primeru sta to levi in ​​desni stolpec srednjega dela strani. V dizajn vpišemo kode, na primer takole:
Zdaj moram sistemu nekako sporočiti, kako bo izgledal moj prihodnji blok. Pri generiranju predlog bo sistem generiral predloge ob upoštevanju teh informacij in vsi novi bloki bodo takoj dodani v dizajn, ki ga potrebujem. Odlična stvar pri tem je, da moram zasnovo bloka opisati samo enkrat - ostalo bo sistem naredil sam. Vsebniku dodam blok:

NASLOV

VSEBINA

Če je zasnova blokov v vseh vsebnikih enaka, potem je dovolj, da oblikujete samo en blok in ustvarite drugi vsebnik prazen. Blok ima dve rezervirani kodi" NASLOV"in" VSEBINA«, kar pomeni »Naslov« in »Vsebina« bloka.

Ločeno bi se rad osredotočil na rezervirane okvirne kode. Več jih je - tukaj so:
- : naslov strani
- : pot do datoteke s slogi css
- : glavni del strani
- : avtorske pravice sistema uCoz

Moja pojavna okna bodo po slogu enaka kot bloki - zato dodam naslednjo kodo:

Priporočljivo je, da to kodo postavite na sam konec kode, na primer za zaključno oznako- to bo pomagalo preprečiti nepotrebno zmedo pri ustvarjanju okvirja.
Upoštevajte tudi to v pojavni kodi je zapisan v oglatem oklepaju, medtem ko je v kodi bloka NASLOV zapisano brez oklepaja. To je bilo narejeno namenoma, da bi lahko razlikovali med tema dvema kodama.
Ko bo vse pripravljeno, si bom ogledal rezultat dela. Vse je videti v redu – zato bom shranil, kar sem naredil, s klikom na gumb »Ustvari predloge«. Sistem bo ustvaril predloge za vse trenutno aktivne module.
Naj povzamem. Izpopolnitev vašega unikatnega dizajna, tako da način oblikovanja deluje na spletnem mestu, je dokaj preprosta in hitra naloga, ki pa lahko v prihodnosti prinese veliko udobja. Že ustvarjanje lastnega ogrodja mi je prihranilo veliko časa pri nastavljanju zasnove za vse module, ki jih potrebujem.

Naj vas spomnim, da je ta članek govoril o nestandardnih dizajnih (ki ste jih ustvarili vi). Način oblikovanja podpirajo vsi standardi

Namestitev predloge po meri

Najboljši način za namestitev predloge po meri je uporaba navodil za namestitev, ki so priložena predlogi. Če ga ni, uporabite naša univerzalna navodila.

Namestitev predloge je sestavljena iz več korakov:

Nalaganje datotek na spletno mesto

Prvi korak je nalaganje datotek, ki so priložene predlogi, na spletno mesto. Pomembno je opazovati gnezdenje datotek v mapah. Torej so lahko vse slike v mapi img, in skripti - v js.

Za ustvarjanje mape uporabite gumb »Dodaj mapo«:

Povlecite in spustite datoteke v območje za nalaganje in počakajte, da se konča. Ko so vse datoteke predloge naložene na spletno mesto, lahko nadaljujete z naslednjim korakom.

Namestitev ogrodja spletne strani

Omogoča ustvarjanje enotne strukture za vse razdelke spletnega mesta. Običajno je na voljo v datotekah .txt in ima lahko poljubno ime ("Framework.txt", "Template Builder.txt" itd.).

V nekaterih primerih predloga morda nima ogrodja spletnega mesta, potem lahko nadaljujete na naslednji korak.

Ogrodje spletnega mesta ima svoje edinstvene spremenljivke, ki ga bodo pomagale razlikovati od drugih datotek predloge:

Poskusite poiskati niz oz . Če jih najdemo v besedilu, potem je najverjetneje datoteka z žično strukturo.

Če želite namestiti okvir, pojdite na razdelek »Design«, v meniju na levi izberite »Framework«, prilepite kodo iz besedilne datoteke, kliknite gumb »Namesti« in potrdite dejanje:

Videli boste sporočilo, ki nakazuje, da je bila operacija uspešna. Tako lahko nadaljujete na naslednji korak.

Namestitev predlog spletnega mesta

Vsak modul spletnega mesta vsebuje svoje edinstvene predloge, ki so odgovorne za prikazovanje strani. Glede na nabor povezanih modulov se lahko število predlog, potrebnih za namestitev, razlikuje.

Predloge so na voljo v besedilnih datotekah in če jih želite postaviti na spletno mesto, morate samo kopirati vsebino datoteke v urejevalnik predlog ustreznega modula. Pojdite v razdelek »Oblikovanje«, v meniju na levi izberite »Urejevalnik«. Poiščite predlogo, katere kodo želite dodati, in jo kopirajte v urejevalnik. Shranite spremembe.

Ta korak ponovite za vse besedilne datoteke, ki so priložene predlogi. Ko končate, nadaljujte z naslednjim korakom.

Naj vas ne odvrne, če v priloženi predlogi manjka datoteka. To lahko pomeni, da je razvijalec predlogi priskrbel žični okvir za njeno prilagajanje.

Nastavitev modulov in razširitev

Pri namestitvi predloge tega koraka ni treba vedno ponoviti. Lahko se tudi zgodi, da je na tej stopnji predloga v celoti nameščena in namestitev lahko dokončate.

Ta vnos sem napisal leta 2011. V tistih časih so bila drevesa visoka in dolar je stal manj kot 40 rubljev. Od takrat je minilo veliko časa in marsikaj se je spremenilo. Imejte to v mislih, ko berete.

Odločil sem se, da napišem nekakšen priročnik o ustvarjanju lastno oblikovanje na uCoz. Sestavljen bo iz 2 delov. Drugi del govori o sami postavitvi predloge.

Ne pozabite prebrati o težavah, na katere lahko naletite, ko ustvarite svojo prvo predlogo.

Kje začeti pri ustvarjanju predloge za uCoz?

Kaj je predloga za uCoz? To je le opis lokacije elementov spletnega mesta in grafični prikaz spletnega mesta.

Kakšna naj bo predloga spletne strani?? Predloga mora biti zasnovana tako, da »okvirja« vsebino spletnega mesta in nikakor ne moti uporabnikov. Poskusite ustvariti predlogo, ki je edinstvena po svojem konceptu, da si bodo uporabniki zapomnili vaše spletno mesto. Na primer, obstaja ogromno število na videz različnih, a navzven zelo podobnih predlog iger (vse temne, črtaste). Ko uporabnik odpre takšno stran, se mu bo zdelo, da je tu že bil. Pridi z nekaj žara.

Obstajajo predloge guma in fiksno. Guma—šablona se razteza čez širino zaslona. Fiksno—širina predloge je nastavljena in ostane nespremenjena ne glede na širino uporabnikovega zaslona. Moja predloga spletnega dnevnika, na kateri ste trenutno, je popravljena.

Svetujem vam, da svojo prvo predlogo popravite, ker ... Med postavitvijo vam bo veliko lažje.

Najprej si predstavljajte, kako bo na splošno izgledala vaša prihodnja predloga. Nato vzemite list A4 in s svinčnikom narišite skico prihodnje zasnove. Tako vam bo veliko lažje, poleg tega pa se vam med risanjem pogosto porodijo čudovite ideje. Na vaši skici bi morali razmisliti o oblikovanju predloge.

Po tem lahko varno vklopite Photoshop. Izberite velikost datoteke, ki je enaka ločljivosti vašega zaslona (moja je 1280 x 1024 slikovnih pik). Pametno izberite barvno shemo prihodnje predloge. Za osnovo morate vzeti 2-3 barve, ki morajo biti v harmoniji med seboj. Barve naj bodo po možnosti naravne. Fotografija je odlična za izbiro naravnih barv. Odprite ga v Photoshopu in s kapalko poglejte barvne kode.

Pri izbiri barv vam lahko pomaga posebna storitev Color Wizard. Vnesite posebno polje barvne kode in pritisnite »set«.

Če nimate dovolj idej za oblikovanje spletne strani, potem preprosto odprite prvo spletno stran z lekcijami Photoshopa in si oglejte vse. Včasih so njihovi deli zelo uporabni.

Ne pozabite dobro razmisliti o navigaciji. Biti mora priročen in intuitiven

P.S. Naletel sem na zanimiv blog o optimizaciji/promociji. Všeč mi je, da avtor eksperimentira z iskalniki.