croatcatala |
dijous, 13 de setembre de 2007 | 14:33h
D'entre els canvis del meu bloc, el més visible és sens dubte la nova capçalera. Fa uns dies, vaig llegir (gràcies a en Marcús) l'explicació que donava el Manel Bargalló al seu bloc sobre com afegir una imatge a la capçalera que ofereix Vilaweb.
El que no m'agradava d'aquesta explicació era que mantenia, sobre la imatge, el títol i subtítol del bloc en format text. Per això, i donat que al bloc d'en Vicent Partal s'aconseguia superar aquesta limitació (i per tant era possible), vaig posar-me a aprendre una mica com va el codi CSS i a revisar el codi de la plantilla que ofereix Vilaweb, fins trobar la solució.
El que no m'agradava d'aquesta explicació era que mantenia, sobre la imatge, el títol i subtítol del bloc en format text. Per això, i donat que al bloc d'en Vicent Partal s'aconseguia superar aquesta limitació (i per tant era possible), vaig posar-me a aprendre una mica com va el codi CSS i a revisar el codi de la plantilla que ofereix Vilaweb, fins trobar la solució.
Seguiu llegint per veure com ficar qualsevol cosa a la capçalera del vostre bloc.
El primer pas és crear una capçalera completa (tal i com sortirà al bloc), evidentment sense els menús que hi afegeix Vilaweb. Jo ho vaig fer amb el Gimp, però es pot fer amb el Paint, per exemple. Hauria de tenir una amplada de 775 píxels per encaixar bé amb la regla de menús de sota. L'alçada pot variar, jo la vaig fer de 90. Cal desar-la com a JPG o GIF.
Tot seguit, cap pujar-la al servidor de Vilaweb. Seguint l'explicació del Manel Bargalló, vaig crear un article del bloc (post), insertant-hi com a imatge la nova capçalera, i vaig desar-lo com a esborrany. Al menú "Editar esborranys" hi sortirà aquest article, entreu-hi i previsualitzeu. Botó dret sobre la imatge, "Propietats", i allà tindreu la ubicació de la imatge al servidor de Vilaweb. Copieu-la.
Finalment, cal entrar al codi CSS de la plantilla ("Editar plantilla") i anar cap al final de tot, on diu
Podeu suprimir aquest fragment de codi, jo per precaució he preferit inutilitzar-lo (posant-hi al davant i al darrera els símbols dels comentaris HTML <!-- i --> ). Cal substituir-lo pel fragment que transcric a continuació, a on UbicacióArxiu és la ubicació de la capçalera que havíeu copiat fa un moment, i títolBloc el títol del vostre bloc, o el que volgueu. A width poseu-hi l'amplada de la capçalera, que ja he aconsellat que sigui de 775, i a height l'alçada que tingui la imatge que heu creat.
<img src="UbicacióArxiu" alt="títolBloc" width="775" height="90" /> </div>
Tot seguit, cap pujar-la al servidor de Vilaweb. Seguint l'explicació del Manel Bargalló, vaig crear un article del bloc (post), insertant-hi com a imatge la nova capçalera, i vaig desar-lo com a esborrany. Al menú "Editar esborranys" hi sortirà aquest article, entreu-hi i previsualitzeu. Botó dret sobre la imatge, "Propietats", i allà tindreu la ubicació de la imatge al servidor de Vilaweb. Copieu-la.
Finalment, cal entrar al codi CSS de la plantilla ("Editar plantilla") i anar cap al final de tot, on diu
{#MODULE#}header{/#MODULE#}
Podeu suprimir aquest fragment de codi, jo per precaució he preferit inutilitzar-lo (posant-hi al davant i al darrera els símbols dels comentaris HTML <!-- i --> ). Cal substituir-lo pel fragment que transcric a continuació, a on UbicacióArxiu és la ubicació de la capçalera que havíeu copiat fa un moment, i títolBloc el títol del vostre bloc, o el que volgueu. A width poseu-hi l'amplada de la capçalera, que ja he aconsellat que sigui de 775, i a height l'alçada que tingui la imatge que heu creat.
<img src="UbicacióArxiu" alt="títolBloc" width="775" height="90" /> </div>
Deseu i voilà. Quan torneu a entrar al bloc, ja us hauria de sortir la nova capçalera. Suposo que aquesta solució ha de funcionar sempre, per si de cas, abans de "trastejar", deseu el codi de la plantilla en un arxiu de text, així el podreu refer sempre que volgueu (o enviar-me'l si no funciona, i poder veure què canvia respecte al que us he escrit). I ara, a fer volar la imaginació!!
PS: M'adhereixo a la sol·licitud de que Vilaweb faci un manual de funcionament dels blocs.
Si voleu que la capçalera enllaci al llistat general del bloc, cal fer-ho com dius, però un pèl més llarg:
<a href="Adreça on vols que t'enllaci"><img src="UbicacióArxiu" alt="títolBloc" width="775" height="200" /> </div>