Sådan Redesignes En Webstedsskabelon

Indholdsfortegnelse:

Sådan Redesignes En Webstedsskabelon
Sådan Redesignes En Webstedsskabelon

Video: Sådan Redesignes En Webstedsskabelon

Video: Sådan Redesignes En Webstedsskabelon
Video: Website Template Design Using Html And CSS | Pure CSS Website Design Tutorial for Beginners 2024, Kan
Anonim

Den nemmeste måde at oprette et websted på er ved hjælp af en skabelon. For at ressourcen skal skille sig ud, skal du dog ændre standardlayoutet. Og her kan du ikke undvære grundlæggende viden om html og css.

Sådan redesignes en webstedsskabelon
Sådan redesignes en webstedsskabelon

Instruktioner

Trin 1

Find den webstedsskabelon, der passer dig bedst på Internettet. Vær opmærksom på dens muligheder, evnen til at tilpasse sig skærmens størrelse, menufunktionerne og kolonnernes layout. Download den version, du kan lide, til din computer, udpak arkivet. Tjek dens ydeevne ved at uploade filerne til roden af webstedet. Måske indeholder skabelonen fejl og installeres ikke korrekt, så er der ingen mening i at arbejde med den i fremtiden.

Trin 2

Selvom du ikke vil gentage skabelonen, skal du udskifte de fleste af billederne og især dem, der er placeret som et logo. Udskift hvert billede på denne måde:

- åbn grafikfilen i Photoshop-programmet;

- i menuen "Billede" - "Billedstørrelse" se på dens parametre;

- åbn et nyt ark med nøjagtig de samme dimensioner;

- opret det ønskede billede ved hjælp af applikationsværktøjerne;

- flad alle lag og gem (ikke til internettet) et nyt billede under samme navn og i samme mappe, idet det oprindelige format indstilles.

I stedet for et billede skal et andet vises.

Trin 3

Så snart du ændrer alle billederne, skal du indpakke mappen med filerne (i tilfælde af Joomla) og uploade den via webstedsadministrationspanelet i menuen "Udvidelser". Se om temaet vises korrekt med de nye illustrationer.

Trin 4

Skift resten af parametrene i style.css. Desuden er det meget mere praktisk at gøre dette ikke via admin-panelet, men på en computer. Det er rimeligt at bruge localhost (Denver) til at se resultatet af transformationerne så hurtigt som muligt. Dette undgår behovet for at uploade resultatet til serveren hver gang for at se resultaterne efter næste redigering.

Trin 5

Download det gratis FireBug-plugin til Mozilla Firefox. Efter installationen vises et gult fejlikon i øverste højre hjørne af browseren. Klik på den, eller tryk på F12-tasten, og sidekoden vises nederst på skærmen i en skjult version. Det kan åbnes ved at holde musen over plustegnene. Og hvis du klikker på linjen i et element, vil det blive fremhævet øverst på skærmen. På højre side af vinduet med koden finder du stilarter, der angiver de linjer, der er ansvarlige for udseendet. Og det bliver straks klart, hvor du har brug for at redigere stilfilen for at ændre designet.

Trin 6

Åbn style.css i Notesblok ++. Du kan bruge andre programmer designet til at redigere koden, men til dette formål kan du ikke bruge standard "Notepad", ellers vil der være fejl på grund af kodningen. Brug FireBug til at finde de parametre, du vil ændre, og redigere dem i Notepad ++ på samme tid.

Trin 7

Gem den endelige css, og upload filen til serveren.

Anbefalede: