Recimo da smo otvorili novu i do sada praznu Powerpoint prezentaciju. I šta vidimo?
I imate korporativne boje i fontove koje morate mijenjati svaki put. Šablon će vam omogućiti da to učinite jednom za svagda.
I 1. slajd u vašoj prezentaciji će automatski izgledati ovako UVIJEK bez dodatnog napora.
![](https://i2.wp.com/etutorium.ru/images/shablon-2.png)
Šablon uključuje:
- Boje
- Fontovi
- Čuvari mjesta (odjeljci u koje ubacujemo tekst, sliku, grafikon, itd.)
Ispod ćete pronaći upute korak po korak za kreiranje vlastitog Powerpoint predloška.
1. Kreirajte novu datoteku u Powerpointu.
2. Odaberite "Slide Master" u gornjem meniju na kartici Prikaz.
![](https://i0.wp.com/etutorium.ru/images/shablon-3.png)
Standardni master slajdova pojavljuje se na lijevoj strani.
Ovdje ćemo raditi s njim. I napravićemo nestandardne od standardnih.
3. Odaberite željenu temu fonta ili kreirajte novu.
Tema fonta je vrsta fontova koje koristite u svojoj prezentaciji. Vjerujte mi, osim Calibrija, postoji još mnogo dobrih fontova. Navedite ih samo 1 put i oni će se automatski zamijeniti u cijeloj prezentaciji ili predlošku.
![](https://i1.wp.com/etutorium.ru/images/shablon-5.png)
4. Odaberite pozadinu koju želite (boju ili uzorak). Možete odabrati istu pozadinu za sve slajdove odjednom ili posebnu pozadinu za jedan.
5. Kao što vidimo, postoji mnogo opcija za lokaciju teksta, naslova itd. na lijevoj strani. Ali šta ako nam treba onaj koji ne postoji? Na primjer, imati 3 slike sa potpisima.
![](https://i0.wp.com/etutorium.ru/images/shablon-6.png)
Tada će nam pomoći funkcija Insert Layout + Insert Placeholder.
![](https://i2.wp.com/etutorium.ru/images/shablon-7.png)
Nakon klika na "Insert Layout" kreira se prazan slajd. I možemo ga napuniti kako želimo.
![](https://i1.wp.com/etutorium.ru/images/shablon-8.png)
![](https://i1.wp.com/etutorium.ru/images/shablon-9.png)
![](https://i1.wp.com/etutorium.ru/images/shablon-10.png)
7. Sada, ako ćemo kreirati novi slajd, tada ćemo vidjeti opcije iz našeg predloška.
![](https://i1.wp.com/etutorium.ru/images/shablon-11.png)
8. Kreirajte novu prezentaciju i "izgubili" svoj šablon? Idite na karticu Dizajn i tamo ga potražite.
Prije kodiranja predloška web stranice u HTML / CSS, potrebno ga je razraditi. Uobičajeno je crtanje dizajna u Photoshopu. Gotov izgled se pohranjuje u datoteku formata .PSD.
Kao primjer, napravimo dizajn stranice na slici ispod.
1. Otvaranje Photoshopa i kreirajte novi dokument u njemu ( Fajl -> Novo ili Ctrl + N).
2. Postavljamo početne parametre. U praksi je gotovo nemoguće razmišljati o dizajnu s preciznošću piksela - u procesu izgleda, sigurno ćete morati nešto promijeniti, premjestiti, ponoviti. Stoga se dimenzije mogu postaviti okvirno, a preporučljivo je naznačiti širinu i visinu dokumenta očigledno više od planirane veličine lokacije, kako bi se svi elementi tačno uklopili u izgled. Napravit ćemo naš dokument širine 1000 piksela i visine 1500 piksela. Napomena: pikseli, a ne centimetri. Ostali parametri se mogu ostaviti na miru.
3. Uključujemo lenjire. Tokom rada, oni će biti potrebni, jer ravnala vam omogućavaju da vrlo precizno izmjerite udaljenosti. Provjerite imate li uključena ravnala. Ako je tako, vidjet ćete vage pored lijeve i ispod gornje alatne trake.
Ako nema ravnala, uključite ih ( Pogled -> Vladari ili Ctrl + R).
Ravnila bi trebala pokazati vrijednost u pikselima. Da biste se prebacili na njih s druge mjere dužine, kliknite desnim tasterom miša na ravnalo i označite odgovarajući okvir u meniju koji se otvori.
4. Provjerite je li veličina fonta navedena u pikselima, a ne u točkama. Ako nije ispravno konfigurisan, idite na Uređivanje -> Postavke -> Općenito, u prozoru koji se pojavi idite na karticu Mjerne jedinice i ravnala, na padajućoj listi Tekst izabrati Pikseli i pritisnite uredu.
5. Odmah napravite pozadinu stranice. Imamo ovu gradijentnu ispunu narandžastu, koja prelazi u žutu. Na lijevoj ploči odaberite alat Gradijent.
Na panelu koji se pojavljuje na vrhu pritisnite dugme Mirror Gradient, odaberite boju na paleti s lijeve strane.
Korištenje alata otvorenog prozora Gradijent editor, odaberite boje koje želite. Da biste postavili tačnu boju kontrolne tačke, kliknite na nju, pritisnite dugme Boja a u prozoru za odabir boja navedite ga u RGB, HSB, CSS ili bilo kojem drugom dostupnom formatu.
Kao rezultat manipulacija, gradijent je ispao kako slijedi.
Da biste primijenili gradijent na trenutni sloj, prevucite pokazivač preko njega držeći pritisnutu lijevu tipku miša.
6. Sačuvajte pozadinu u datoteku. Ono što smo uradili trebalo bi da bude prikazano ispod glavne stranice i da zauzme ceo prozor pretraživača – neka vrsta pozadine. Na primjer, stranica je široka 800 piksela, a rezolucija ekrana korisnika je mnogo veća. Ostatak prostora (sve osim 800px koje će zauzeti blok stranice) bit će popunjen pozadinom gradijenta.
Budući da se rezolucija ekrana ne može predvidjeti, možete iz kreirane pozadine izrezati traku debljine jednog piksela i sačuvati je kao sliku. Pretraživač će ispuniti pozadinu s njom po cijeloj širini.
6.1. Odabir alata Pravokutna površina.
6.2. Odaberite traku proizvoljne širine, ali duž cijele dužine sloja.
6.3. Kopiraj odabir ( Ctrl + C).
6.4. Kreirajte novi dokument ( Ctrl + N), postavite njegovu širinu na 1 piksel i zalijepite kopirano ( Ctrl + V).
6.5. Sačuvajte fajl na Jpg-format.
7. Kreirajte pozadinu stranice. Pozadina će biti obična bijela. Odabir alata Pravougaonik i podesite potrebne parametre u prozoru sa svojstvima. Dobili smo pravougaonik 800x1100 piksela, čiji gornji lijevi ugao leži u tački 100.0.
8. Napravite pozadinu zaglavlja. Matirana gradijentna ispuna dimenzija 780x80px.
Sačuvajte ga kao zasebnu grafičku datoteku širine 1 piksel, kao što smo uradili sa pozadinom.
9. Kreirajte gornji meni. Koristeći alat Horizontal Text, dodajte prvu stavku menija u izgled - Dom... Sloj će biti kreiran, pa čak i preimenovan automatski, tako da ne morate ništa raditi s njim.
Ovdje je važno da sve točke budu ravnomjerno raspoređene, stoga se preporučuje korištenje ravnala. Da proširite vertikalu, povucite držeći pritisnutu tipku miša s lijeva na desno. Koristite ravnala za mjerenje udaljenosti, s obzirom da svaka stavka menija u našem slučaju treba da zauzima 120 piksela.
10. Slično, umetnite ostale stavke menija.
11. Dodajte logo. Već imamo gotovu, tako da ostaje samo da je pažljivo umetnete u izgled. Da biste to učinili, kliknite Datoteka -> Otvori, zatim kliknite na sliku i, držeći pritisnutu tipku miša, pomaknite je na naslov predloška dokumenta, kada se otvori, prevucite sliku na željeno mjesto u rasporedu i otpustite tipku miša.
12. Pišemo naziv i slogan stranice. Alat koji već poznajemo dopunjavamo gotovo kreirani logo natpisima.
13. Idite na bočnu ploču. Prvo, napravimo i spremimo u zasebnu datoteku gradijent ispunu za njene naslove. Upoznati ste sa alatima, nije potrebno objašnjenje.
14. Dodajte tekst naslova informacijskog bloka u novokreirani gradijent.
15. Nacrtajte granicu za područje. Da biste to učinili, dovoljno je koristiti prozirni pravougaonik s crnim linijama. Odaberite alat Pravougaonik, postavite tip ispune oblika na Bez boje, kliknite na ikonu Postavi vrstu poteza i odaberite crnu, inače neće biti linija. Ako je obris predebeo, postavite širinu linije na 0,5 pt.
16. Ispod dodajte zaglavlje bloka sa gradijentom ispune, kao u stavkama 12-13.
17. Kreirajte blok menija lijevog panela. Dodajte narandžasti pravougaonik od 100px sa žutim obrisom od 0,2pt.
18. Dodajte mu tekst.
19. Uz pomoć dupliranja slojeva i lenjira kreirajte još pet stavki menija lijevog panela.
20. Napišite tekst u glavni dio stranice koristeći isti alat.
21. Dodajte fotografiju na glavni dio stranice, kao što smo uradili sa logom. Da biste kopirali sliku, jednostavno je pomjerite mišem dok držite pritisnut tipku. Alt... Ako iznenada slika ne odgovara veličini, koristite alat Transform ( Ctrl + T).
22. Nacrtajte pozadinu podnožja stranice - narandžasti gradijent od 64px.
23. Sačuvajte traku donje pozadine širine 1 piksel u posebnu grafičku datoteku.
24. Smanjite visinu stranice. Ispostavilo se da su svi elementi već nacrtani, a ostalo je još prostora. Ovdje su nam dobro došli smisleni nazivi slojeva. Između ostalog, odaberite pozadinski sloj (mi ga zovemo pozadina) i koristite alat Transform da smanjite visinu našeg bijelog pravokutnika na donji rub podnožja stranice.
25. Sačuvajte šablon u formatu datoteke .PSD (Datoteka -> Sačuvaj).
26. Rezultat ove akcije je i dalje jednostavan, ali već uobičajeni predložak stranice.
Sada, od PSD izgleda, ostaje koristiti HTML / CSS za izradu predloška web stranice, ali o tome ću govoriti u sljedećem članku.
Ako želite da vaša wordpress stranica izgleda obećavajuće, prvo razmislite o kreiranju jedinstvene teme za nju. Ovaj proces je prilično naporan, jer je direktno povezan s različitim kodiranjem i skriptama. Hajdemo to rastaviti od nule.
Gotovo svaka wordpress tema je instalirana u wp-content / themes direktorij i sastoji se od 3 kategorije datoteka:
- datoteke sa stilskim listovima;
- datoteke dodatne funkcionalnosti;
- datoteke šablona.
Datoteke stilskog lista su style.css. Oni su odgovorni za boju, veličinu, font i druge parametre elemenata stranice. Svaka stranica ima samo 1 style.css fajl. Ako otvorite ovu datoteku, tada na samom vrhu možete vidjeti informacije o naslovu, autoru i kratak opis teme. Kada kreirate vlastitu temu, možete unijeti informacije o sebi u style.css.
Sljedeća kategorija su datoteke dodatne funkcionalnosti. To uključuje functions.php, čiji princip čini da izgleda kao dodatak. Zahvaljujući ovoj datoteci, možete vizualno prilagoditi temu direktno u admin panelu. Obično lista postavki nije jako široka (naziv stranice, boja navigacije i bočnih panela stranice, itd.). Ako je tema višenamjenska, tada će lista postavki biti mnogo šira.
Sada pređimo na datoteke šablona. Njihova glavna funkcija je generiranje stranica koje traže posjetitelji stranice. Datoteke šablona imaju ekstenziju ".php". Većina osnovnih tema može sadržati samo jedan šablonski fajl koji se zove index.php. U tom slučaju, sve stranice stranice će biti identične. Ovaj dizajn se najčešće koristi za kreiranje Internet resursa sa bazama podataka, kada dizajn ne igra ključnu ulogu.
Ako nikada prije niste radili dizajn, prvo pokušajte stvoriti jednostavnu temu. Za normalan rad potrebna su vam najmanje 2 od sljedećih datoteka: style.css i index.php.
Datoteke dodatne funkcionalnosti u ovom slučaju se ne mogu koristiti, kao što razumijete. Među datotekama šablona, index.php je jedan od najfleksibilnijih. Može samostalno generirati zaglavlja, razne blokove, podnožje (footer), sadržaj i druge elemente stranice.
Vrijedi napomenuti da će oni parametri koji nisu generirani u index.php fajlu biti generisani standardnim datotekama. Na primjer, ako se vaša tema sastoji od samo 2 od gore navedenih fajlova, ali korisnik ima potrebu da generiše obrazac za dodavanje komentara, onda će ovu funkciju obavljati standardni comments.php. Stoga, ako želite da vaša tema bude jedinstvenija, vrijedi napraviti dodatne datoteke šablona. Razmotrimo glavne.
- Za dodavanje komentara, pogodili ste, koristi se predložak comments.php.
- Ako želite da napravite popup sa komentarima, onda vam je u te svrhe potreban comments-popup.php.
- Za generiranje početne stranice koristi se home.php.
- Datoteka single.php je odgovorna za prikazivanje članaka na stranici. Ako nemate takav fajl, onda će index.php izvršiti svoju funkciju.
- Datoteka page.php generiše pojedinačne stranice sajta.
- Za prikaz informacija o autoru potreban vam je author.php.
- Category.php je odgovoran za kategorije.
- Prikaz arhive, datuma i pretraživanja se vrši pomoću datoteka archive.php, date.php i search.php respektivno.
- Da bi vaš sajt prikazao jedinstvenu stranicu sa greškom 404, moraćete da dodate svoj 404.php.
- Podnožje i podnožje sajta generišu fajlovi header.php i footer.php.
Kreiranje jedinstvene teme ručno od nule
Prvo morate instalirati odgovarajući šablon. Može se naći i na službenoj web stranici wordpress.org i drugdje. Preporučuje se korištenje službene stranice, jer bilo koja treća strana može sadržavati zlonamjerne datoteke i neispravne linkove.
Nakon što ste odabrali, možete započeti preuzimanje arhive. Na kraju procesa, moraćete da ga raspakujete i otpremite datoteke u određene fascikle na sajtu (arhiva obično sadrži malu instrukciju). Preuzimanje se može obaviti pomoću FileZilla programa ili direktno sa hostinga, ako podržava ovu opciju. Sada samo trebate otići u odjeljak "Teme", odabrati onu koju ste preuzeli i kliknite na dugme "Aktiviraj".
Možete ga odabrati i direktno u wordpress admin panelu. U ovom slučaju, ne morate ga preuzimati. Potrebno je samo da kliknete na dugme "Instaliraj", a zatim "Aktiviraj". Prije instalacije preporučuje se da se izvrši pregled.
Sada kada je tema aktivirana, možete preći na njenu jedinstvenost. Prvi korak je razmišljanje o vrhu stranice (header). Ovo je prva stvar koja upada u oči vašim posjetiocima, pa se prema tome treba pozabaviti odgovorno. Obično se zaglavlje sastoji od naziva stranice, logotipa i kratkih informacija o sadržaju. Zaglavlje se može kreirati u bilo kojem grafičkom uređivaču. Čak iu standardnoj boji. Napredniji dizajneri koriste Adobe Photoshop.
Naziv stranice treba biti kratak i lako pamtljiv. Postoji mnogo različitih stilova koje možete birati u Adobe Photoshopu. Kada kreirate logotip, možda će vam trebati različiti oblici. Mogu se preuzeti sa službene web stranice Adobe Photoshopa.
Nakon što napravite crtež zaglavlja u grafičkom uređivaču, morat ćete ga postaviti na svoju web stranicu. Kada se preuzimanje završi, URL će se pojaviti desno od slike i morat ćete ga kopirati. Zatim morate otići u odjeljak "Editor" i odabrati datoteku koja je odgovorna za generiranje zaglavlja (header.php). U njemu ćete morati pronaći URL trenutne slike i zamijeniti ga onim koji ste dobili prilikom učitavanja zaglavne slike. Nakon toga, morat ćete ažurirati datoteku. Sada možete nastaviti s provjerom prikaza zaglavlja.
Ako vaše zaglavlje ima druge parametre osim standardnog, onda ih možete podesiti u header.php. Širina se kontrolira atributom širine, a visina se kontrolira visinom. Podešavanja se mogu izvršiti u pikselima i procentima. Dakle, ako samo želite da rastegnete kapu, onda je postavite na 100%.
Po želji možete dodati aktivne linkove na stranice wordpress stranice u zaglavlje. To se može učiniti korištenjem raznih servisa. Ima ih puno na internetu. Većina njih radi na istom principu. Označite željeno područje zaglavlja koje će biti rezervirano za link, a servis će vam dati kod koji vam je potreban. Zatim ćete morati da dodate ovaj kod u Vaš header.php fajl. Budite oprezni kada ga dodajete. Svaki poen se računa. Ako dodate kod na pogrešno mjesto, aktivni linkovi se neće pojaviti u zaglavlju.
Nakon zamjene standardnog zaglavlja, možete započeti zamjenu zadane pozadine wordpress stranice, widgeta, navigacije, podnožja i drugih komponenti wordpress stranice. Također se mogu nacrtati u bilo kojem grafičkom uređivaču i postaviti na stranicu u obliku slike.
Kod vas vrijedi uzeti u obzir da ne bi trebalo biti svijetlo. Većina webmastera radije koristi bijelu pozadinu. Ne boli oči niti odvlači pažnju od glavnog sadržaja.
Da biste kreirali kvalitetnu navigaciju od nule, potrebno vam je malo znanja o oznakama kao što su