Autoinstal•labes. I ara què? (Part I)

Nivell principiant

 

CMS WordPress JoomlaAcabes d’autoinstal·lar el Joomla al teu hosting des del panel de control de CDmon i no saps per on començar a configurar la teva web? Aquí t’expliquem quins són els primers passos que has de seguir.

 

Pas 0

Un cop feta la instal·lació, la teva web ha quedat així:

pantalla1-p

Com que aquest article està orientat a usuaris principiants, no canviarem l’estructura de la web. Respectarem l’opció de plantilla que el sistema ens dóna per defecte. Més endavant, en propers articles, ja aprendrem com canviar l’estructura.

Pas 1

Observem l’estructura actual de la web i la dividirem visualment en parts com es mostra a la imatge:

pantalla1-p-BOLES

De les 11 parts que hem identificat, valorarem quines necessitem i quines no. Les que no necessitem les desactivarem i les que sí, les modificarem al nostre gust.

 

Pas 2

Anem a treballar cada bloc de la imatge.

 

BLOC 1

Aquesta part serveix per poder canviar la mida de la lletra de la web, perquè el visitant es pugui posar el text més gran o més petit.

Si no necessiteu aquesta característica i la voleu eliminar, haurem de tocar una miqueta de codi, però us indicarem pas a pas com fer-ho i ja veureu que serà molt senzill.

Accedirem a l’administrador mitjançant la URL que us ha proporcionat la instal·lació, seguint aquest format:

http://www.elvostredomini.com/administrator

Posarem l’usuari i el password proporcionats i accedirem a:

Extensions - Template Manager, i triarem la Beez_20 i clicarem on indiquem a la imatge:

plantilla

Un cop a dins la plantilla, editarem l’arxiu principal (que és l’index.php) tal i com mostrem, clicant l’opció encerclada en vermell:

main-template

Editarem el codi eliminant la línia següent:  <div id="fontsize"></div>

edit index

 

 

BLOC 2

Modificarem el menú segons les nostres necessitats.

Anirem a Menús – Top:

top menu

 

 

En aquest cas concret de la plantilla que ve per defecte, en el Top menú tenim:

1.-“Home”:  “Home” és el que es coneix com un àlies (l’àlies el que fa és cridar una altra opció del menú. En aquest cas està cridant a l’element “Home” que tenim al menú de la part 6). Seria com un link intern.

canvi menu

 

 

I modificarem els elements del menú. Per exemple, podem canviar el títol “Home” per “Inici”. I així successivament amb tots els elements.

 

2.-“Sample sites”: en aquest cas també actua com un àlies. L’ideal seria que aquest títol el canviessis pel “Qui som” i modifiquessis el tipus de menú des de l’opció “Menu Item Type” i triïs l’opció “Single Article”.

Si volem mostrar un article simple hem de clicar “Menú Item Type” i se’ns obra la següent pantalla. Triem “Single Article”:

tipus menu

 

Ara només caldrà seleccionar l’article que vulguem associar.

select article

 

 

El més probable és que si estem fent l’element “Qui som”, sigui un article que hàgim fet per a aquest propòsit (més endavant expliquem com fer o modificar un article).

 

3.-Joomla.org: en aquest cas es tracta d’un link extern. Pot ser que sigui l’opció “Contacte” i que, per tant, sigui un article on posar la informació per contactar.

El modificarem seguint els passos anteriors.

 

BLOC 3

Modificar el banner o capçalera. Per modificar el banner haurem de seguir 3 passos.

1-     Haurem de preparar una imatge de 1060 px d’amplada per 288 px d’alçada.

Haurem de pujar-la al servidor. Ho podem fer des del Media Manager.

media-manager

 

Ens permetrà pujar la imatge que vulguem des del nostre ordinador. Hem d’escollir l’arxiu i després prémer “Start Upload”.

pujar-cap

 

 

Ara ja tenim la nostra imatge al servidor i només ens queda fer l’últim pas.

Canviar la imatge al full d’estils de la web (CCS), ja que en aquesta plantilla està com a imatge de fons a la capçalera (com es veu al BLOC 3, hi ha text a sobre la imatge).

Per canviar-la al CSS anirem a Extensions -Template Manager , triarem la Beez_20 i després clicarem a “Personal.css” . Buscarem aquest tros de codi:

.logoheader
{

  
background:  #0c1a3e  URL(../images/personal/personal2.png) no-repeat bottom right ;
  
color:#fff;
  
min-height:200px;
  
margin:0em 10px 0 10px !important;

}

 

I substituirem la URL de la imatge : URL(../images/personal/personal2.png) per:

URL(../../../images/elnomdelanostrafoto.png)

Gravem i ja tenim la capçalera canviada.

capça

 

 

 

Podeu consultar la resta de blocs en el següent article

 

 

 

 

 

Afegir comentari


Security code
Actualitza