un blog fet amb wordpress - — cada dia, pas a...

22
UN BLOG FET AMB WORDPRESS Projecte del curs D116. Creació i gestió d’entorns web dinàmics (PHP) Sebastià Mora Masot. Mestre del CEIP Enric Grau Fontseré de Flix. http://phobos.xtec.cat/smora/index.php Després de valorar diferents possibilitats, bàsicament triar entre instal∙lar un WIKI o un BLOG, em vaig decidir per WordPress, un blog multiusuari que desenvolupa molta gent i sobre el qual trobaria molts suports arreu. Més informació: http://ca.wikipedia.org/wiki/Wiki http://ca.wikipedia.org/wiki/Bloc http://ca.wikipedia.org/wiki/Wordpress Volia un bloc on els meus alumnes pengessin els seus treball creatius, expressió escrita, oral i plàstica. Si utilitzava un bloc comercial (blogger) no em feia gràcia haver de fer usuaris els alumnes d’una web comercial i això era necessari si volia que ells mateixos es pengessin els seus propis treballs. D’entrada vaig tenir sempre clar que en accedirhi es veuria sempre una mateixa pàgina inicial, no era important veure la darrera entrada, el més important és poder arribar a totes. Per això vaig modificar els accessos i a l’inici del bloc sempre es veu una pàgina de presentació que explica la finalitat del mateix. A partir d’aquesta pàgina es pot triar, des del costat, quina categoria de treballs vols veure i, altres pàgines en les quals també hi ha treballs però recollits de manera conjunta. També es pot accedir a la pàgina autors dels bloc, aquesta la considero una pàgina importantíssima, en accedirhi es veu el llistat d’usuaris, de manera que clicant sobre un usuari es veuen tots els treballs de totes les categories que ha aportat al bloc aquell usuari. Hem va ajudar molt trobar el tema connections ja que s’adaptava plenament a l’estructura que volia per al bloc. Ben aviat em vaig adonar que si volia que s’hi veiessin imatges posades en altres webs (per exemple flickr), i hi hagués reproductors de vídeos (per exemple youtube) i de sons (razz, clickcaster, eSnips) necessitava instal∙lar plugins. No necessitava posar una llista d’articles al costat, als articles s’hi arribaria per les categories. Aquest és un altre aspecte important del bloc, l’estructura del mateix per categories. Les pàgines són un complement secundari. Una vegada explicats els motius i mencionats aquells aspectes que han constituït la base de la feina desenvolupada passaré a explicar com he fet la instal∙lació i posteriors modificacions del bloc. Trobareu els següents apartats: Instal∙lació del bloc. Gestió del bloc. Canvi del tema i dels accessos. Instal∙lació de plugins i widgets

Upload: trinhlien

Post on 15-Apr-2018

218 views

Category:

Documents


5 download

TRANSCRIPT

Page 1: UN BLOG FET AMB WORDPRESS - — Cada dia, pas a …barrios.cat/wp-content/uploads/2007/12/un_bloc_amb_word...(razz, clickcaster, eSnips) necessitava instal∙lar plugins. No necessitava

UN BLOG FET AMB WORDPRESS Projecte del curs D116. Creació i gestió d’entorns web dinàmics (PHP) Sebastià Mora Masot. Mestre del CEIP Enric Grau Fontseré de Flix.

http://phobos.xtec.cat/smora/index.php

Després de valorar diferents possibilitats, bàsicament triar entre instal∙lar un WIKI o un BLOG, em vaig decidir per WordPress, un blog multiusuari que desenvolupa molta gent i sobre el qual trobaria molts suports arreu.

Més informació: http://ca.wikipedia.org/wiki/Wiki http://ca.wikipedia.org/wiki/Bloc http://ca.wikipedia.org/wiki/Wordpress

Volia un bloc on els meus alumnes pengessin els seus treball creatius, expressió escrita, oral i plàstica. Si utilitzava un bloc comercial (blogger) no em feia gràcia haver de fer usuaris els alumnes d’una web comercial i això era necessari si volia que ells mateixos es pengessin els seus propis treballs.

D’entrada vaig tenir sempre clar que en accedir­hi es veuria sempre una mateixa pàgina inicial, no era important veure la darrera entrada, el més important és poder arribar a totes. Per això vaig modificar els accessos i a l’inici del bloc sempre es veu una pàgina de presentació que explica la finalitat del mateix. A partir d’aquesta pàgina es pot triar, des del costat, quina categoria de treballs vols veure i, altres pàgines en les quals també hi ha treballs però recollits de manera conjunta. També es pot accedir a la pàgina autors dels bloc, aquesta la considero una pàgina importantíssima, en accedir­hi es veu el llistat d’usuaris, de manera que clicant sobre un usuari es veuen tots els treballs de totes les categories que ha aportat al bloc aquell usuari.

Hem va ajudar molt trobar el tema connections ja que s’adaptava plenament a l’estructura que volia per al bloc.

Ben aviat em vaig adonar que si volia que s’hi veiessin imatges posades en altres webs (per exemple flickr), i hi hagués reproductors de vídeos (per exemple youtube) i de sons (razz, clickcaster, eSnips) necessitava instal∙lar plugins. No necessitava posar una llista d’articles al costat, als articles s’hi arribaria per les categories. Aquest és un altre aspecte important del bloc, l’estructura del mateix per categories. Les pàgines són un complement secundari.

Una vegada explicats els motius i mencionats aquells aspectes que han constituït la base de la feina desenvolupada passaré a explicar com he fet la instal∙lació i posteriors modificacions del bloc. Trobareu els següents apartats:

Instal∙lació del bloc. Gestió del bloc. Canvi del tema i dels accessos. Instal∙lació de plugins i widgets

Page 2: UN BLOG FET AMB WORDPRESS - — Cada dia, pas a …barrios.cat/wp-content/uploads/2007/12/un_bloc_amb_word...(razz, clickcaster, eSnips) necessitava instal∙lar plugins. No necessitava

1. Espai web on instal∙lar WordPress Com a mestre del Departament d’Educació de la Generalitat de Catalunya vaig demanar un espai web amb suport PHP a la xtec. http://www.xtec.net/at_usuari/gestusu/identificacio/php/normes_us.htm

2. Instal∙lació de WordPress La primera informació la vaig obtenir del Bloc del CRP del Tarragonès que també està fet amb WordPress i pot servir de model sobre les possibilitats que ofereix aquest gestor de continguts programat amb PHP. http://phobos.xtec.cat/crp­tarragones/zonatic­n/ http://phobos.xtec.cat/crp­tarragones/zonatic­n/?page_id=47

Les instruccions concretes d’instal∙lació del blog wordpress les vaig treure del document elaborat per Àngel Solans, coordinador territorial TIC a Lleida. http://phobos.xtec.net/semtic/files/blocs_wp.pdf Aquestes instruccions les vaig seguir al peu de la lletra i em va funcionar tot molt bé. Com en totes les coses, sobre aquest aspecte, voldria comentar un parell de coses:

2.1. Quan diu que us descomprimiu el fitxer zip en una carpeta de nom wordpress (pàgina 9) heu de tenir en compte que en descomprimir es crea de manera automàtica una carpeta de nom wordpress amb tot el contingut a l’interior.

2.2. Vaig utilitzar el programa FILEZILLA per pujar el fitxers a remot (pàgina 13, apartat e). Vegeu una mostra de com configurar­lo.

Page 3: UN BLOG FET AMB WORDPRESS - — Cada dia, pas a …barrios.cat/wp-content/uploads/2007/12/un_bloc_amb_word...(razz, clickcaster, eSnips) necessitava instal∙lar plugins. No necessitava

Per poder fer proves vaig instal∙lar també el bloc en local, tingueu en compte que per poder obrir el bloc en local cal que tingueu engegat un servidor de webs (apache) i un servidor Mysql.

Els paràmetres de configuració del fitxer wp­config.php han de canviar­se per poder treballar en local, vegeu a continuació els canvis en aquest fitxer que vaig fer jo.

3. Gestió del bloc Una vegada el vaig tenir instal∙lat em va començar a preocupar l’aspecte i l’ús. Em va caldre un aprenentatge d’utilització del bloc.

Vaig seguir les instruccions del document “Gestionar el blog wordpress“ http://phobos.xtec.net/semtic/files/wordpress.pdf

Aquí vaig començar a tenir més problemes, a continuació comentaré els entrebancs que vaig trobar.

3.1. Per pujar imatges s’han de donar permisos d’escriptura a la carpeta wp­ contents/uploads. Això ho vaig fer utilitzant el programa FILEZILLA, vegeu una imatge de com fer­ho:

<?php // ** MySQL settings ** // define('DB_NAME', 'smora'); // The name of the database define('DB_USER', 'root'); // Your MySQL username define('DB_PASSWORD', ''); // ...and password define('DB_HOST', 'localhost'); // 99% chance you won't need to change this value

// You can have multiple installations in one database if you give each a unique prefix $table_prefix = 'wp_'; // Only numbers, letters, and underscores please!

// Change this to localize WordPress. A corresponding MO file for the // chosen language must be installed to wp­includes/languages. // For example, install de.mo to wp­includes/languages and set WPLANG to 'de' // to enable German language support. define ('WPLANG', 'ca_ES');

/* That's all, stop editing! Happy blogging. */

define('ABSPATH', dirname(__FILE__).'/'); require_once(ABSPATH.'wp­settings.php'); ?>

Page 4: UN BLOG FET AMB WORDPRESS - — Cada dia, pas a …barrios.cat/wp-content/uploads/2007/12/un_bloc_amb_word...(razz, clickcaster, eSnips) necessitava instal∙lar plugins. No necessitava

3.2. Segons el rol específic que li atorguem a un usuari aquest podrà fer diferents coses, com que volia usuaris mestres i usuaris alumnes vaig haver de fer un estudi de la temàtica, vegeu les conclusions a les que vaig arribar:

Llistat d’accions que pot fer l’administrador Editor Autor Col∙laborador Subscriptor

Canviar temes Editar temes Activar plugins Editar plugins Editar usuaris Editar fitxers Gestionar opcions Importar Moderar comentaris Sí Gestionar categories Sí Gestionar links Sí Permetre codi html ­ javascript Sí Editar entrades publicades Sí Editar entrades d’altres usuaris Sí Editar pàgines Sí Carregar arxius Sí Sí Publicar entrades Sí Sí Editar entrades Sí Sí Sí Llegir Sí Sí Sí Sí Nivell 10 Nivell 7 Nivell 2 Nivell 1 Nivell 0

En conseqüència els alumnes seran autors, sempre podem rebaixar­ne algun a col∙laborador si publica coses no desitjables, i els mestres seran editors.

Page 5: UN BLOG FET AMB WORDPRESS - — Cada dia, pas a …barrios.cat/wp-content/uploads/2007/12/un_bloc_amb_word...(razz, clickcaster, eSnips) necessitava instal∙lar plugins. No necessitava

També he consultat per obtenir més informació sobre la instal∙lació i la gestió de WordPress les adreces següents, a més a més contenen links a altres llocs amb més informació. http://e­profes.net/blog/tutorial­wordpress/ http://web.educastur.princast.es/servicio/documentos/edublog_v01.pdf

4. Canvi del tema i dels accessos Després de veure bastants temes i provar­los vaig decidir­me pel tema connections. Estava traduït al català, m’agradava, s’adaptava moltíssim al que desitjava i em deixava canviar el fitxer de capçalera fàcilment. Vaig obtenir­lo a ... http://wiki.bitassa.net/index.php/WP­CA

Canvi de la imatge de la capçalera de la pàgina. Vaig fer una nova imatge amb les mides i el nom de top.jpg. La imatge antiga és la que es veu com a top_ini.jpg.

Modificar la pàgina inicial

Mitjançant les opcions de lectura farem que les entrades ordenades per data no formin la pàgina inicial sinó que sigui una pàgina concreta la que es mostri inicialment. Vegeu com es fa:

També podem decidir que hi hagi una pàgina que mostri totes les entrades per ordre cronològic.

Page 6: UN BLOG FET AMB WORDPRESS - — Cada dia, pas a …barrios.cat/wp-content/uploads/2007/12/un_bloc_amb_word...(razz, clickcaster, eSnips) necessitava instal∙lar plugins. No necessitava

Veure totes les entrades d’un determinat usuari

Una de les coses que buscava en els temes era si portava un mòdul que mostrés una llista de tots els usuaris i permetés accedir i veure totes les entrades d’un mateix usuari. Això em donava una doble funcionalitat, les categories em permetien veure totes les entrades similars (per exemple totes les receptes de cuina) i si trobava el sistema, un alumne podria ensenyar d’una manera fàcil tot el que ell havia fet.

Finalment vaig decidir crear una pàgina, posar­hi el llistat dels alumnes i lincar l’adreça corresponent a cada un d’ells. Hagués pogut afegir un blogroll lateral però hauria allargat massa la columna dreta. Així vaig crear la pàgina autors del bloc, vegeu com està feta:

Solament cal mirar a la llista d’usuaris quina és la seva ID

L’adreça sempre ha de ser del tipus http://phobos.xtec.cat/smora/wp2/?author=7

Page 7: UN BLOG FET AMB WORDPRESS - — Cada dia, pas a …barrios.cat/wp-content/uploads/2007/12/un_bloc_amb_word...(razz, clickcaster, eSnips) necessitava instal∙lar plugins. No necessitava

Afegir un Blogroll per veure un llistat d’usuaris

Si voleu crear un blogroll en el que es vegi la llista d’usuaris heu de crear una nova categoria de links i afegir a aquesta categoria tots els links que vulgueu. Vegeu com es fa:

No es veien els Blogrolls en el tema connections

Un problema amb el que em vaig trobar era que no es veien els blogrolls si no obria la pàgina inicial amb les entrades ordenades per data. Això es pot arreglar modificant el fitxer sidebar.php (barra lateral) del tema connections. Observeu primer com és originàriament:

Observeu ara com ha de quedar:

Page 8: UN BLOG FET AMB WORDPRESS - — Cada dia, pas a …barrios.cat/wp-content/uploads/2007/12/un_bloc_amb_word...(razz, clickcaster, eSnips) necessitava instal∙lar plugins. No necessitava

5. ELS PLUGINS

Els plugins són eines que permeten ampliar el WordPress, ofereixen noves funcions d’ús. Amb els plugins cada usuari pot fer­se a mida el seu lloc i adequar­lo a les seves necessitats específiques.

Només cal buscar el que ens fa falta, descarregar­lo, normalment descomprimir­lo, pujar­lo amb el FileZilla a la carpeta wp­contents/plugins i activar­lo des de l’administrador de plugins del wordpress.

Podeu trobar plugins a la web http://codex.wordpress.org/Plugins/. En aquesta mateixa pàgina trobareu molts altres vincles a altres pàgines que contenen plugins per a wordpress.

També heu de verificar que el plugin que activeu esta actualitzat i funciona amb la versió del WordPress que teniu instal∙lada. Podeu consultar la compatibilitat d’un plugin amb la versió 2.1 del WP en aquesta adreça: http://codex.wordpress.org/Plugins/Plugin_Compatibility/2.1

A mi m’ha funcionat molt bé fer cerques al google posant per exemple: plugin wordpress flickr.

5.1. Instal∙lació del Plugin Falbum. Per veure fotos i col∙leccions(sets) del Flickr dintre de WordPress

He obtingut les instruccions de la pàgina: http://www.randombyte.net/wiki/falbum/falbum

De tota manera, i com estan en anglès, passo a comentar tot el que he fet.

1. Ens baixem l’arxiu comprimit on es troben tots els fitxers que caldrà instal∙lar des de l’adreça: http://sourceforge.net/project/showfiles.php?group_id=144263

2. Descomprimim el fitxer FAlbum­0.6.9.zip(és la darrera versió que jo he trobat) en una carpeta temporal. De manera automàtica ens crearà una carpeta falbum amb tots els fitxers a dintre.

3. Amb un programa de transmissió de fitxers(per exemple, Filezilla) pugem aquesta carpeta fins al nostre lloc web. Cal posar la carpeta dins de

\wp2\wp­content\plugins\falbum ( o un camí adaptat a la vostra instal∙lació)

Page 9: UN BLOG FET AMB WORDPRESS - — Cada dia, pas a …barrios.cat/wp-content/uploads/2007/12/un_bloc_amb_word...(razz, clickcaster, eSnips) necessitava instal∙lar plugins. No necessitava

4. Anar fins l’administrador de plugins del nostre WordPress i activar el plugin.

5. A continuació caldrà completar la instal∙lació fent dos passes més:

a. Autoritzar a FAlbum per accedir a un compte de flickr. Caldrà accedir al compte i identificar­se. Podeu saber si el permís és correcte des del mateix flickr.

b. A continuació clicar sobre el segon pas: Get authentication Token.

6. Anar a editar les opcions de Falbum, en principi no cal que canvieu res.

7. Ara podeu provar com funcionen diverses adreces posades al blogroll:

La primera ens mostra una col∙lecció de flickr. http://phobos.xtec.cat/smora/wp2/wp­content/plugins/falbum/wp/album.php?album=72157594332716110

La segona ens mostra el contingut de flickr. http://phobos.xtec.cat/smora/wp2/wp­content/plugins/falbum/wp/album.php

Page 10: UN BLOG FET AMB WORDPRESS - — Cada dia, pas a …barrios.cat/wp-content/uploads/2007/12/un_bloc_amb_word...(razz, clickcaster, eSnips) necessitava instal∙lar plugins. No necessitava

8. Es pot posar els links en una entrada o en una pàgina. Vegeu a continuació com funciona posada des del blogroll.

5.2. Instal∙lació del Plugin per executar fitxers Flash He obtingut les instruccions de la pàgina: http://blog.unijimpe.net/wp­swfobject/

1. Les instruccions estan en castellà i es poden seguir perfectament. Solament afegir com he deixat el fitxer de configuració del plugin.

Page 11: UN BLOG FET AMB WORDPRESS - — Cada dia, pas a …barrios.cat/wp-content/uploads/2007/12/un_bloc_amb_word...(razz, clickcaster, eSnips) necessitava instal∙lar plugins. No necessitava

2. També he tingut problemes amb el camí que se li dona al fitxer flash, solament quan l’he deixat de la següent manera m’ha funcionat.

[swf]/smora/wp2/wp­content/uploads/2007/ninot11.swf, 300, 300[/swf] smora és l’usuari phobos on està instal∙lat el WordPress.

3. Vegeu un model de pàgina:

http://phobos.xtec.cat/smora/wp2/?page_id=172

5.3. Instal∙lació del Plugin per a vídeos de youtube He obtingut les instruccions de la pàgina: http://www.skarcha.com/wp­plugins/wpvideo/

1. Les instruccions estan en castellà i es poden seguir perfectament.

2. Aquí és on d’anar a parar els fitxers del plugin:

3. Solament afegir com he deixat el fitxer de configuració del plugin.

Page 12: UN BLOG FET AMB WORDPRESS - — Cada dia, pas a …barrios.cat/wp-content/uploads/2007/12/un_bloc_amb_word...(razz, clickcaster, eSnips) necessitava instal∙lar plugins. No necessitava

4. He tingut problemes quan he escrit el codi des de l’editor visual utilitzant els codis <video>...?...</video> Introduint els codis des de l’editor de code i escrivint­ho de la següent manera m’ha funcionat: [video]http://www.youtube.com/watch?v=DpXx0HjzMGQ[/video]

5.4. Escoltar fitxers de so penjats a altres webs He buscat plugins per executar fitxers MP3 que es troben a altres webs (en concret, RAZZ, Clickcaster, eSnips). He trobat un plugin, l’audio player, per funcionar sembla ser que necessita l’adreça web del fitxer i aquestes webs, a diferencia de youtube, proporcionen embeds i links a la pàgina per executar el fitxer, però no l’adreça concreta del fitxer.

De tota manera sembla ser que els embeds funcionen bé enganxant­los dins d’una entrada del wordpress. A vegades però l’editor de codi del wordpress juga alguna mala passada. A mi m’ha funcionat bé posant els diferents elements dintre de cel∙les d’una taula. És com si els embeds necessitessin una separació del text, si aquesta separació la fem programant una taula sembla ser que la cosa funciona prou bé.

<table border="0"> //inici d’una taula <tr> //inici d’una fila <td> //inici d’una cel∙la //si hi posem una imatge ens quedarà un codi similar a aquest <a href="http://phobos.xtec.cat/smora/wp2/wp­content/uploads/2007/03/mirlo.jpg" title="mirlo"><img src="http://phobos.xtec.cat/smora/wp2/wp­ content/uploads/2007/03/mirlo.jpg" alt="mirlo" /></a> </td> //final de la cel∙la </tr> //final de la fila <tr> //inici d’una fila <td> //inici d’una cel∙la //si hi posem un embed ens quedarà un codi similar a aquest <ibed allowscriptaccess="always" flashvars="userid=1543&amp;slot=3" quality="high" width="293" height="61" name="razzmixer_profile_player" align="middle" type="application/x­shockwave­flash" pluginspage="http://www.macromedia.com/go/getflashplayer" bgcolor="Transparent" wmode="transparent"> </ibed> </td> //final de la cel∙la </tr> //final de la fila <tr> //inici d’una fila <td> //inici d’una cel∙la //si hi posem un text ens quedarà un codi similar a aquest <blockquote> <blockquote>Por la noche, ya el subir .../he tallat el text per fer­ho més curt/... azul de jacarandá.</blockquote> </blockquote>

Page 13: UN BLOG FET AMB WORDPRESS - — Cada dia, pas a …barrios.cat/wp-content/uploads/2007/12/un_bloc_amb_word...(razz, clickcaster, eSnips) necessitava instal∙lar plugins. No necessitava

</td> //final de la cel∙la </tr> //final de la fila </table> //final de la taula

Vegeu un exemple que m’ha funcionat. Primer hi ha una imatge, després un text i per últim un àudio mp3 que es troba a esnips.com i s’escolta mitjançant un embed (en negreta) que genera el mateix esnips:

<table border="0"> <tr> <td><a href="http://phobos.xtec.cat/smora/wp2/wp­ content/uploads/2007/03/gallina.jpg" title="gallines"><img src="http://phobos.xtec.cat/smora/wp2/wp­content/uploads/2007/03/gallina.jpg" alt="gallines" /></a></td> </tr> <tr> <td> <blockquote> <blockquote>¡Ay, señora, mi vecina, se me murió la gallina! ...Aquí hi va tot el text escrit... cómo no voy a llorar se me murió la gallina!<o:p></o:p></blockquote> </blockquote> </td> </tr> </table> <table cellpadding=" 0" cellspacing=" 0" > <tr> <td><ibed quality=" high" pluginspage=" http://www.macromedia.com/go/getflashplayer" type=" application/x­shockwave­flash" bgcolor=" #000" width=" 328" height=" 94" flashvars=" theTheme=gold&amp;autoPlay=no&amp;theFile=http://www.esnips.c om//nsdoc/d6752219­0d52­4a85­bfa5­ f5c8b0612de6&amp;theName=gallina&amp;thePlayerURL=http://static.esnips.co m/images/widgets/flash/mp3WidgetPlayer.swf" ></ibed></td> </tr> <tr> <td align=" center" ><a href=" http://www.esnips.com/doc/d6752219­0d52­4a85­ bfa5­f5c8b0612de6/gallina/?widget=flash_player_esnips_gold" style=" color: #000000" valign=" bottom" align=" center" >gallina.mp3</a></td> </tr> </table>

He provat diverses coses però si provo de modificar l’embed després no funciona. Es tracta de copiar al final de tot l’embed tal com ens arriba del lloc d’origen una vegada hem posat tots els altres elements (imatge, text).

Vegeu exemples de fitxers MP3 que es troben en altres webs i que s’escolten des del worpress: http://phobos.xtec.cat/smora/wp2/?cat=14

Page 14: UN BLOG FET AMB WORDPRESS - — Cada dia, pas a …barrios.cat/wp-content/uploads/2007/12/un_bloc_amb_word...(razz, clickcaster, eSnips) necessitava instal∙lar plugins. No necessitava

5.5. Millorar l’editor d’entrades WYSIWYG .

Baixar el plugin advanced­wysiwyg.php. Anar a la següent web, clicar amb el botó dret sobre l’enllaç i triar desa l’enllaç al disc. http://blog.labnotes.org/2005/12/26/advanced­editing­for­wordpress­20/

Pujar­lo, amb Filezilla per exemple, a la carpeta remota wp­content/plugins.

Activar el plugin.

Editar el plugin. Com que permet dues i fins a tres línies d’icones, jo l’he deixat com segueix:

Page 15: UN BLOG FET AMB WORDPRESS - — Cada dia, pas a …barrios.cat/wp-content/uploads/2007/12/un_bloc_amb_word...(razz, clickcaster, eSnips) necessitava instal∙lar plugins. No necessitava

Si voleu que es vegin les icones pantalla completa i insertar una taula cal instal∙lar els plugins TinyMCE adicionals i per separat. Baixeu­vos el fitxer TinyMCE 2.1.0, de la pàgina http://sourceforge.net/project/showfiles.php?group_id=103281 Descomprimiu­lo en una carpeta i copieu les carpetes table i fullscreen a la vostra carpeta remota /wp­includes/js/tinymce/plugins/

L’editor wysiwyg TinyMCE del WordPress es veurà ara d’aquesta manera i permetrà més funcions que abans, serà una mica més complert.

6. ELS WIDGETS

Els Widgets són elements que podeu posar a la barra lateral del vostre blog.

Per a instal∙lar widgets abans caldrà que instal∙leu el plugin Sidebar widgets, aquest plugin permetrà modificar la barra lateral segons la nostra voluntat.

6.1. Instal∙lació del plugin sidebar widgets

1. Descarregar­vos el plugin de la pàgina: http://automattic.com/code/widgets/

Page 16: UN BLOG FET AMB WORDPRESS - — Cada dia, pas a …barrios.cat/wp-content/uploads/2007/12/un_bloc_amb_word...(razz, clickcaster, eSnips) necessitava instal∙lar plugins. No necessitava

2. Descomprimir­lo i pujar, amb el FileZilla, per exemple, la carpeta / widgets/ al directori remot /wp­content/plugins/

3. Activar el plugin SidebarWidgets des del menú Plugins del Panell d’administració.

Fent això podreu arribar a l’opció Sidebar Widgets del menú presentació del panell de l’administrador, és des d’on podreu configurar els diferents widgets a la sidebar, o barra lateral del blog.

El blog ha de tenir un tema que suporti els “widgets” a la barra lateral. El tema connections que utilitzo jo està preparat per a utilitzar els widgets. En un primer moment dóna un missatge dient que es perdrà la configuració de la barra lateral si s’instal∙len widgeds, no cal patir, tirem endavant, i comencem a instal∙lar widgeds.

Incorporar els widgets a la barra lateral (Sidebar)

Arrossegar amb el ratolí un element de la zona “Available Widgets” o widgets disponibles, a la zona “Sidebar 1” i col∙locar­lo en el lloc desitjat. De la mateixa manera, però en sentit invers, també podeu treure un “widget” de la zona “Sidebar 1” a la zona “Available Widgets”, ja no serà visible a la barra lateral del blog.

Page 17: UN BLOG FET AMB WORDPRESS - — Cada dia, pas a …barrios.cat/wp-content/uploads/2007/12/un_bloc_amb_word...(razz, clickcaster, eSnips) necessitava instal∙lar plugins. No necessitava

Els widgets que necessiten ser configurats tenen un quadrat a la dreta, fent clic accedirem a una finestra de configuració. També podeu triar el nombre de widgets de text o de RSS que necessitem.

A l’adreça http://widgets.wordpress.com/ trobareu més widgets per instal∙lar. Si en trobeu un que necessiteu, heu de descarregar­lo, descomprimir­lo i pujar­lo a la carpeta del WordPress /wp­content/plugins/widgets/.

Haureu d’activar­lo des de Gestió de Plugins del panell d’administració i incorporar­lo a la Barra Lateral (“sidebar”) des de Presentació ­ Sidebar Widgets. Mireu sempre si el widget va acompanyat d’un fitxer amb instruccions o consells per al seu correcte funcionament o si n’hi ha a la pàgina web de l’autor.

Page 18: UN BLOG FET AMB WORDPRESS - — Cada dia, pas a …barrios.cat/wp-content/uploads/2007/12/un_bloc_amb_word...(razz, clickcaster, eSnips) necessitava instal∙lar plugins. No necessitava

6.2. Picasa Web Matrix Widget Plugin per Wordpress

Description: Mostra imatges de Picasa Web Albums a la barra lateral. Author: Stephen Reinhardt Version: 1.0 Author URI: http://www.vaguedream.com

Obtenció del widget

http://vaguedream.com/wordpress­themes/

Instal∙lació

1. Extreu el contingut de PicasaWebMatrix.zip i mitjançant Filezilla envia’l al teu wp­content/plugins/widgets/ directori remot. Contingut descomprimit que s’ha d’enviar a remot:

2. Dona permisos 777 a la carpeta picasacache remota.

3. Activa el plugin Picasa Web Matrix des de l’administrador de plugins del wordpress. Ha de quedar com a la imatge següent.

Configuració

1. Ves al menú presentació del wordpress i clica sobre Sidebar Widgets.

2. Arrossega el widget Picasa Web Matrix a dintre de sidebar.

3. Clica el quadre per obrir la finestra de configuració.

Page 19: UN BLOG FET AMB WORDPRESS - — Cada dia, pas a …barrios.cat/wp-content/uploads/2007/12/un_bloc_amb_word...(razz, clickcaster, eSnips) necessitava instal∙lar plugins. No necessitava

Model possible de configuració

Com obtenir la Picasa Web Feed URL:

1. Obrir la pàgina web picasa on hi ha l’àlbum del qual vols obtenir la Feed URL. 2. Clica amb el botó de la dreta sobre l’enllaç RSS. 3. Còpia la ubicació de l’enllaç. 4. Enganxa­la a la finestra de configuració del widget.

6.3. Flickr Badge Widget Plugin for Wordpress By Ben Coleman 27­01­2007

És un widget per a la barra lateral del WordPress que mostra fotos del Flickr.

On trobar el widget? Aneu a aquesta pàgina http://www.bencoleman.co.uk/flickr­widget­plugin­for­your­wordpress­sidebar/

Page 20: UN BLOG FET AMB WORDPRESS - — Cada dia, pas a …barrios.cat/wp-content/uploads/2007/12/un_bloc_amb_word...(razz, clickcaster, eSnips) necessitava instal∙lar plugins. No necessitava

Requeriments Wordpress 2.x or superior ­ http://wordpress.com/ Sidebar Widgets Plugin ­ http://automattic.com/code/widgets/

Instal∙lació Extreu el fitxer flickr­widget.php i copia’l a la carpeta remota wp­ content/plugins/widgets/

Des de l’administració de plugins del WordPress activa el plugin “Flickr Badge Widget”. Així et quedarà quan l’hagis activat:

Configuració

4. Des de l’administració del wordpress clica l’opció Sidebar Widgets del menú Presentació.

5. Arrossega el widged "Flickr Badge" dintre del sidebar (barra lateral).

6. Clica sobre el quadre per obrir la finestra de configuració del widget .

Page 21: UN BLOG FET AMB WORDPRESS - — Cada dia, pas a …barrios.cat/wp-content/uploads/2007/12/un_bloc_amb_word...(razz, clickcaster, eSnips) necessitava instal∙lar plugins. No necessitava

Opcions modificables

Widget Title: El títol que vols que es vegi a la barra lateral, és opcional. Source: Sel∙lecciona "User" si vols veure totes les fotos del usuari flikr. Flickr ID: Per veure les fotos d’un user o d’un group escriu la ID. Utilitza http://idgettr.com/ per trobar la teva ID. Més endavant s’explica millor com fer­ho, no és tracta de posar­hi el teu codi d’usuari de flickr. Tag: Escriu un tag si solament vols veure les fotos corresponents a aquell tag. Photo Count: Nombre de fotos que es veuran. Layout: Orientació de les fotos (horitzontal o vertical). Which Photos: Tria veure­les per atzar o les darreres que s’hi ha posat. Photo Size: Mida de les fotos que es veuran. Alignment: Alineació de les fotos (esquerra, centre, dreta).

Com utilitzar idgettr.com

Model de configuració de Flickr Badge Widget

Page 22: UN BLOG FET AMB WORDPRESS - — Cada dia, pas a …barrios.cat/wp-content/uploads/2007/12/un_bloc_amb_word...(razz, clickcaster, eSnips) necessitava instal∙lar plugins. No necessitava

7. Agraïments:

A Xavier Suñé, del CRP del Tarragonès, que em va donar les primeres indicacions per fer la tria i començar a caminar.

A Àngel Solans, coordinador territorial TIC a Lleida que va elaborar les instruccions d’instal∙lació que vaig seguir.

A Xavier Montagut, que ha estat el meu professor del curs D116. Creació i gestió d’entorns web dinàmics (PHP).

A Carme Cubells Larrosa, mestra del CEIP Enric Grau Fontseré i companya meva de nivell. M’ha ajudat molt en la tasca d’omplir de contingut el bloc.

A tots els alumnes de 2CS del CEIP Enric Grau Fontseré de Flix, els seus treballs fan possible que el bloc tingui contingut. Sempre he cregut que el contingut està per damunt de les eines que el mostren.

A tota la gent que ha programat eines que he utilitzat i a tots aquells que han posat informació als blocs que he consultat, la llista seria llarguíssima i molt difícil de fer.

Podeu trobar coses meves a:

http://phobos.xtec.cat/smora

http://www.xtec.cat/~smora/ http://smora.blogspot.com/ http://www.xtec.net/centres/e3001127/index.htm http://ceipflix.xtec.cat/

Si us voleu comunicar amb mi:

[email protected] [email protected]