Com Redissenyar Una Plantilla De Lloc Web

Taula de continguts:

Com Redissenyar Una Plantilla De Lloc Web
Com Redissenyar Una Plantilla De Lloc Web

Vídeo: Com Redissenyar Una Plantilla De Lloc Web

Vídeo: Com Redissenyar Una Plantilla De Lloc Web
Vídeo: Plantillas Webnode: Cómo usar plantillas para páginas web para empresas negocios músicos restaurante 2024, Maig
Anonim

La forma més senzilla de crear un lloc web és utilitzar una plantilla. Tanmateix, perquè el recurs destaqui, heu de canviar el disseny predeterminat. I aquí no es pot prescindir dels coneixements bàsics d’html i css.

Com redissenyar una plantilla de lloc web
Com redissenyar una plantilla de lloc web

Instruccions

Pas 1

Cerqueu la plantilla de lloc web que més us convingui a Internet. Presteu atenció a les seves capacitats, a la capacitat d’adaptació a la mida del monitor, a les funcions del menú i a la disposició de les columnes. Baixeu-vos la versió que vulgueu a l'ordinador i descomprimiu l'arxiu. Comproveu-ne el rendiment carregant els fitxers a l'arrel del lloc. Potser la plantilla conté errors i no s’instal·larà correctament, aleshores no tindrà cap sentit treballar amb ella en el futur.

Pas 2

Fins i tot si no voleu refer la plantilla completament, substituïu la majoria de les imatges, i especialment les que es troben com a logotip. Substituïu cada imatge d'aquesta manera:

- obriu el fitxer gràfic al programa Photoshop;

- al menú "Imatge" - "Mida de la imatge" mireu els seus paràmetres;

- obriu un full nou amb les mateixes dimensions;

- crear la imatge desitjada mitjançant les eines de l'aplicació;

- aplaneu totes les capes i deseu (no per al web) una imatge nova amb el mateix nom i a la mateixa carpeta, configurant el format original.

Així, en lloc d’una imatge, n’hauria d’aparèixer una altra.

Pas 3

Tan bon punt canvieu totes les imatges, comprimeu la carpeta amb els fitxers (en el cas de Joomla) i pengeu-la a través del tauler d'administració del lloc al menú "Extensions". Comproveu si el tema es mostra correctament amb les noves il·lustracions.

Pas 4

Canvieu la resta de paràmetres a style.css. A més, és molt més convenient fer-ho no a través del tauler d’administració, sinó en un ordinador. És raonable utilitzar localhost (Denver) per veure el resultat de les transformacions tan aviat com sigui possible. D’aquesta manera s’evitarà la necessitat de carregar el resultat al servidor cada vegada per poder veure els resultats després de la següent edició.

Pas 5

Descarregueu el connector gratuït de FireBug per a Mozilla Firefox. Després de la instal·lació, apareixerà una icona d'error groc a l'extrem superior dret del navegador. Feu-hi clic o premeu la tecla F12 i a la part inferior de la pantalla apareixerà el codi de pàgina en una versió reduïda. Es pot obrir posant el ratolí sobre els signes més. I si feu clic a la línia d’un element, es ressaltarà a la part superior de la pantalla. A la part dreta de la finestra amb el codi, trobareu estils que indiquen les línies que són responsables de l'aparició. I de seguida quedarà clar on heu d’editar el fitxer d’estil per canviar el disseny.

Pas 6

Obriu style.css a Notepad ++. Podeu utilitzar altres programes dissenyats per editar el codi, però amb aquest propòsit no podeu utilitzar el "Bloc de notes" estàndard, en cas contrari hi haurà errors a causa de la codificació. Utilitzeu FireBug per trobar els paràmetres que vulgueu canviar i editar-los a Notepad ++ alhora.

Pas 7

Deseu el css final i pengeu el fitxer al servidor.

Recomanat: