Kako Redizajnirati Predložak Web Stranice

Sadržaj:

Kako Redizajnirati Predložak Web Stranice
Kako Redizajnirati Predložak Web Stranice

Video: Kako Redizajnirati Predložak Web Stranice

Video: Kako Redizajnirati Predložak Web Stranice
Video: Дизайн реального проекта на фрилансе. Редизайним главную страницу сайта в фигме 2024, Studeni
Anonim

Web stranicu najlakše je stvoriti pomoću predloška. Međutim, da bi se resurs istaknuo, morate promijeniti zadani izgled. I ovdje ne možete bez osnovnog znanja o HTML-u i CSS-u.

Kako redizajnirati predložak web stranice
Kako redizajnirati predložak web stranice

Upute

Korak 1

Pronađite predložak web stranice koji vam najviše odgovara na Internetu. Obratite pažnju na njegove mogućnosti, mogućnost prilagodbe veličini monitora, značajkama izbornika i rasporedu stupaca. Preuzmite verziju koja vam se sviđa na vaše računalo, raspakirajte arhivu. Provjerite njegovu izvedbu prijenosom datoteka u korijen web mjesta. Možda predložak sadrži pogreške i neće se pravilno instalirati, pa tada neće biti smisla raditi s njim u budućnosti.

Korak 2

Čak i ako nećete u potpunosti ponoviti predložak, zamijenite većinu slika, a posebno one koje se nalaze kao logotip. Zamijenite svaku sliku na ovaj način:

- otvorite grafičku datoteku u programu Photoshop;

- u izborniku "Slika" - "Veličina slike" pogledajte njene parametre;

- otvorite novi list s potpuno istim dimenzijama;

- stvoriti željenu sliku pomoću alata za aplikacije;

- poravnajte sve slojeve i spremite (ne za web) novu sliku pod istim imenom i u istoj mapi, postavljajući izvorni format.

Tako bi se umjesto jedne slike trebala pojaviti druga.

3. korak

Čim promijenite sve slike, stisnite mapu s datotekama u ZIP datoteku (u slučaju Joomle) i prenesite je putem administratorske ploče web stranice u izborniku "Proširenja". Pogledajte da li se tema prikazuje pravilno s novim ilustracijama.

4. korak

Promijenite ostatak parametara u style.css. Štoviše, puno je prikladnije to učiniti ne putem administratorske ploče, već na računalu. Razumno je koristiti localhost (Denver) kako bismo što prije vidjeli rezultat transformacija. To će izbjeći potrebu za učitavanjem rezultata na poslužitelj svaki put kako bi se rezultati vidjeli nakon sljedećeg uređivanja.

Korak 5

Preuzmite besplatni dodatak FireBug za Mozilla Firefox. Nakon instalacije, u gornjem desnom kutu preglednika pojavit će se žuta ikona programske pogreške. Kliknite ga ili pritisnite tipku F12 i na dnu zaslona kôd stranice pojavit će se u sažetoj verziji. Može se otvoriti lebdenjem miša preko znakova plus. A ako kliknete liniju elementa, on će biti označen na vrhu zaslona. Na desnoj strani prozora s kodom pronaći ćete stilove koji ukazuju na linije koje su odgovorne za izgled. I odmah će postati jasno gdje trebate urediti datoteku stila da biste promijenili dizajn.

Korak 6

Otvorite style.css u programu Notepad ++. Možete koristiti druge programe dizajnirane za uređivanje koda, ali u tu svrhu ne možete koristiti standardni "Notepad", inače će doći do pogrešaka zbog kodiranja. Upotrijebite FireBug za pronalaženje parametara koje želite promijeniti i istodobno ih uređivanje u Notepadu ++.

Korak 7

Spremite konačni css i prenesite datoteku na poslužitelj.

Preporučeni: