Unidad Sistemas gestores de contenidos · Sistemas gestores de contenidos 2 1.2. Características...

Y estudiaremos:

•Lascaracterísticasbásicasdelossistemasdegestióndecontenidos.

•Conceptos,procesoyconfiguracióndelainstalacióndeunsistemadegestióndecontenidos.

•Lagestióndeusuariosyperfiles.•Laadministraciónbásicadelsistemadegestióndecontenidossiguiendounosrequerimientosdados.

•Losdiferentesmódulos,sufunciónyconfiguración.

•Losmecanismosdecopiadeseguridadyrestauración.

•Laactualizacióndelsistemadegestióndecontenidos.

En esta unidad aprenderemos a:

•Identificarlosrequerimientosnecesariosparainstalargestoresdecontenidos.

•Realizarlainstalacióndeunsistemagestordecontenidos.

•Gestionarusuariosconvariosperfiles.•Personalizarlainterfazdelgestordecontenidos.

•Instalaryconfigurarlosmódulosymenúsnecesarios.

•Realizaryrestaurarcopiasdeseguridad.

•Actualizarelgestordecontenidos,enespeciallastareasdeseguridad.

•Llevaracabopruebasdefuncionamiento.

Sistemasgestoresdecontenidos 2Unidad

www.mcg

raw-h

ill.es

Sistemas gestores de contenidos2

12

1. ¿Qué es un sistema de gestión de contenidos?Conestadenominaciónseconoceunaherramientadesoftwarequepermitecrear,orga-nizarypublicardocumentosyotroscontenidosdeformacolaborativa.Lossistemasdegestióndecontenidos(Content Management System,enadelanteCMS)estánformadosporunconjuntodeaplicacioneswebque,deunmodosimilaraunportal,operantantoenInternetcomoenunaintranet.Suprincipalventajaconsisteenelhechodequepermitenorganizarymostrarconteni-dossinqueseanecesarioposeergrandesconocimientosdeprogramaciónweb.Consuayudasepuedengenerarypublicarnoticias,creartaxonomías(sistemasdeclasifi-cación)conlasqueeladministradorclasificacontenidos,insertarlogotiposeimágenespersonalizadasocorporativasdelportal,añadir secciones,administrar lasbasesdedatosdeusuarios,etc.

1.1. Funciones básicas de un gestor de contenidos

Sonlassiguientes:

Creación de contenidos

Cualquierusuarioqueno tengademasiadosconocimientos sobrepublicaciónwebpuedegenerarlos gracias a los editores integrados. Por lo general, se trata de editores del tipoWYSIWYGconlosquesepuedeverelaspectofinaldeldocumentoamedidaqueseelabora.LosCMSofrecenlaposibilidaddepreparardiferentes tiposdedocumentos(noticias,forosdediscusión, librosen formatodigital,etc.) según lasnecesidadesdelportaleinclusocrearnuevostiposapartirdelostiposbásicos.Además,puedenincluirpaquetesofimáticosintegrados,asícomoherramientasparalaimportacióndedocumentosylaedicióndearchivosXML.

Gestión de contenidos

Cuandounusuariocreaundocumento,sealmacenaenunabasededatosjuntoconotrasinformacionesdeinterés,comosonelnombredelautor,lasfechasdecreaciónypublicación,eltipodedocumento,lospermisosdeacceso,etc.Además,seconsignantambiénlosusuariosalosquesehadadodealta,laestructuradelportal,losestilosytemasutilizados,asícomotodalainformacióngeneradaapartirdelasfuncionalidadesdelCMS.Laslaboresdegestióndecontenidossepuedendelegarocompartirconlosusuarios.Bastaconasignarlesunperfildeterminado(editor,administrador,autor,etc.).ElCMSproporcionalainfraestructuranecesariaparaquesecomuniquenygarantizalaconse-cucióndelciclodetrabajo.

Publicación de contenidos

Cuandoelusuariodaporterminadouncontenido,puedepublicarloenesemismomo-mentoobienprogramarloparaqueaparezcaenunafechadeterminada.Estatareasellevaacabosegúnelpatróngeneraldediseñoestablecidoenelgestor.Deestamane-ra,sesimplificaeltrabajoysegarantizaqueelCMSmantengaunaspectohomogéneo.Elautor,sisuperfilselopermite,podrápublicareldocumentodentrodelasecciónparalaquehandesarrolladoesoscontenidos.

Presentación del gestor de contenidos

Por lo general, losCMS siguen la normativa internacional de accesibilidad. Puedenutilizarsedesdecualquiernavegadorypermitenestablecerelidioma,elhusohorarioeinclusolamonedadeseados.

En el CEO dispones del docu-mento SMR_WEB_02_Historia.pdf donde podrás encontrardetalles sobre los gestores decontenido,suevoluciónhistóricayusos.

CEO

Fig. 2.1. Logo de WordPress. Puedes encontrar logos de WordPress en http://profesionalnet.wordpress.com/ 2009/02/24/todos-los-logotipos-gratis/

EnlosCMS,cuandosehabladelagranularidadenelaccesoalsitio,quieredecirquesepuedecontrolar «quiénpuedeverquédel sitio web», y «quién puedehacerquéenelsitioweb».

¿Sabías que…?

Podemos encontrar ayuda ofi-cial sobreWordPressenhttp://ayudawordpress.com/En la dirección http://www.masquewordpress.com/ayuda/ están disponibles los forosdondepodemosplanteardudasodarsoluciones.EnTwitter:h t t p s : // t w i t t e r . c o m /# !/AyudaWordpressFacebookparaayudadeWordPress:ht tp://www.facebook.com/AyudaWordPress

Webwww.m

cgra

w-hill.

es

13

2Sistemas gestores de contenidos

1.2. Características generales de los sistemas gestores de contenidos

LaestructuradeunCMSconstadelossiguienteselementos:

•Elfrontend,lapartevisibledelCMSparalosusuariosqueaccedencomoinvitadosousuariosregistrados.

•Elbackend,eláreadeadministracióndelCMSdondesellevanacabotodaslasta-reasdeactualización,configuraciónygestióndelsitio.

•Módulosparalaconfiguraciónypersonalizacióndelsitioweb.•Gestordeusuarios,perfilesyderechosdeacceso.•Módulosparalagestióndelcontenidodelsitioweb(creación,edición,publicacióndecontenidos,etc.).

•Plantillasparapersonalizarelaspectooeldiseñodelsitioweb.•Extensionesqueaumentanlafuncionalidaddelgestordecontenidos.•Posibilidaddemúltiplesidiomasylocalización.

1.3. Criterios de selección de un sistema gestor de contenidos

Alahoradecrearunsitioweb,esprecisoestablecer,enprimerlugar,losobjetivosquesepersiguen.Bastaráconresponderaunascuantaspreguntasbásicasparadeterminarlaeleccióndelgestormásadecuado.¿Quévamosamostrarenelportal?¿Aquétipodeusuariossedirigirá?¿Quéseofrecerá:productos,servicios...?¿Cómointeractuaránlosvisitantesconelportal?¿Sedisponederecursoseconómicosparaadquirirlasherra-mientasnecesarias?¿Quiénseencargarádelmantenimientodelportal?

Apartirdeestas cuestiones,debeplantearseuna listade criteriosde selecciónqueayudenaescogerungestoruotro.

1.Códigolibreopropietario.

2.Arquitectura(escalabilidad,separaciónentrepresentaciónyadministración).

3.Soporteydesarrollo(garantíasdequelaherramientapuedeampliarseymejo-rarse).

4.Usabilidadyaccesibilidad(facilidaddeuso,adecuaciónalosestándaresadoptadosaescalainternacional).

5.Funcionalidad.Elsistemagestordeberáproporcionaralmenos:

• EdiciónWYSIWYGatravésdelnavegador.

• Sindicacióndenoticiasyartículos.

• Asignacióndeperfilesdistintosparalosusuarios.

• Soportemultilingüe.

• Soporteparavariosnavegadores.

• Personalizacióndelentornoenfuncióndelusuario.

• Publicaciónprogramadayasignacióndefechasdecaducidad.

• Herramientadebúsqueda.

•Mecanismosde comunicación entre los usuariosdel portal (foros, chat, correoelectrónico,etc.).

• Cargaydescargadedocumentaciónymaterialmultimedia.

• Creación,actualizaciónyrestauracióndecopiasdeseguridad.

•Generacióndeestadísticaseinformes.

1. ¿Por qué crees que sepuedenecesitarunsiste-magestordecontenidos?

2. ¿Cuálescreesquesonlasventajasmásimportantesdelosgestoresdeconte-nidosencomparaciónconlasherramientas tradicio-nalesdepublicaciónweb?

3. Averigua qué es elworkflowdepublicaciónoflujodepublicacióndeunCMS.

4. ¿PorquédecimosqueunCMSpermitelalocaliza-ción?

5. ¿Qué diferencia existeentrelocalizacióneinter-nacionalización?

6. Localiza en Internet unlistado, lomás completoposible, de los sistemasgestores de contenidosdisponibles.

7. ¿Cómo es la escalabili-dad deWordPress? ¿EsWordPressescalable?

8. ¿Qué es el roadmapdeWordPress?

Actividades

Con la interpretaciónde laver-sión de WordPress podemosconocer la envergadura de loscambiosrealizados.Si identificamos la versión porX.Y.Z:X es el número mayor de ver-sión, identifica cambios impor-tantes en el código fuente yse mantiene la compatibilidadhaciaatrás.Yeselnúmeromenordeversión,identifica cambios importantesdelafuncionalidad.Tambiénsemantienelacompatibilidad.Z es el número de versión demantenimiento, cambia cuandoserealizanmejorasenlaseguri-daddelaaplicaciónosecorri-generrores.

Claves y consejos

www.mcg

raw-h

ill.es


14

2. Sistema gestor de contenidos WordPressWordPressesunCMSdinámicoquepermitelacreacióndesitioswebparalapubli-cacióndenoticias,difusióndeinformación,portalescorporativos,sitioswebparaco-mercioelectrónico,etc.EsunaaplicaciónwebconlicenciapúblicageneralGPLyestáescritaprincipalmenteenlenguajePHP.Elsitiooficialdelproyectoeshttp://wordpress.org/ (enespañolestádisponibleelportalhttp://es.wordpress.org).Convieneestable-cer ladiferenciaentrewordpress.orgywordpress.com:cuandosehace referenciaawordpress.orgseestáhablandodeWordPresscomoCMS;wordpress.comeselserviciogratuitodeblogsquepermitelacreaciónrápidaysencilladeblogsparalosusuarios.LasprincipalescaracterísticasdeWordPresssonlassiguientes:•GestióndelCMScompletavíawebdeformasencilla.•Organizacióndelosartículos(entradas,posts)ypáginasestáticasdelsitiowebme-

diantecategorías,subcategoríasyetiquetas.• CreaciónyedicióndecontenidosutilizandouneditorWYSIWYG.• Permiteguardarelartículocomoborradordeformaautomáticaytemporizada.• Ediciónyconfiguracióndetodoslosserviciosqueofrece.• Disponibilidaddegranvariedaddeplantillasotemas(themes)descargables.• Utilizacióndeplantillasconfigurablesquedefinen laestructuradel sitio.Admite la

utilizacióndewidgets,aunquenotodaslasplantillasaceptantodosloswidgets.• Utilizacióndepluginsqueamplíanlafuncionalidaddelsitio.• Disponedeunadministradordearchivosmultimediaquepermitegestionartodotipo

dearchivosdeaudio,vídeo,imágenes,etc.,yutilizablesencualquierpartedelsitio,desdesunavegador.

• Foros/encuestas de votación dinámicos con resultados inmediatos, estadísticas devisitas,etc.

• ServidordesindicacióndenoticiasporRDF(RSS1.0),RSS2.0yAtom.• Permiteinsertarpublicidadenelsitio.• Permitelapublicaciónmediantee-mail.• PermitelabúsquedaintegradaGoogle.• Apartirde laversión3,esmultisite,esdecir,partiendodeunaúnica instalación,

permiteconfigurarmúltiplessitios.•Multiplataforma:GNU/Linux,FreeBSD,MacOSXServer,Windows,Solaris,Android,

iOS,BlackberryySymbian.

2.1. Elementos de WordPress

LoselementosbásicosparaelfuncionamientodeWordPresssonlossiguientes:1.BasededatosMySQL5quealmacenaentablasdiferenciadastodalainformación

delsitio,asícomogranpartedelaconfiguracióndelsistema.2.MotorPHP,5.2.4osuperior,queejecutaórdenesdebúsqueda,almacenamiento,

consultaymodificaciónsobrelabasededatos.Losdatosobtenidosenestasopera-cionessontransformadosenpáginasweb,quesoninterpretadasymostradasporlosnavegadoresyentendiblesporlosusuarios.

3.ServidorHTTPApache2.Loselementosbásicosencuantoalaspectoy/ofuncionalidadsonlossiguientes:• Plantillasotemas.• Extensiones:plugins.

WordPress tiene la opción decompresióngzipactivada.De esa forma, puede ahorrarancho de banda. Pero, paraello,elnavegadorutilizadodebeadmitirestetipodecompresión.Esta característica requiere queel servidor web Apache tengaactivadoelmódulomod_gzip.

¿Sabías que…?

9. ¿Por qué decimos queWordPress es un CMScolaborativo?

10. Averigua cuáles podríanserlasrazonesparamigrardeDrupalaWordPress.

11. Cuando ya tengas ins-talado WordPress en tuequipo, haz un resumencon lasaplicaciones ins-taladasquesonnecesa-rias para que funcione.Incluye también las ver-siones de cada una deellas.

12. A partir de los datossobreWordPress de losquedispones,¿quéusosoenquéáreassepodríautilizaresteCMS?

Actividades

www.mcg

raw-h

ill.es

15


2.2. Ventajas y características de WordPress

LapremisabásicadeWordPressesqueel usuario seocupe solode la informaciónquequierapublicaryelsistemaseencarguedegestionartodoslosdetallestécnicosyadministrativos.

LasventajasqueofrecelautilizacióndeWordPresscomoCMSsonlassiguientes:

• Essencillodeinstalar,configuraryadministrar.

• Laadministraciónserealizavíawebdesdecualquierordenadorconectado.

• EsunCMSencontinuocrecimientocongrancantidaddeplugins(http://wordpress.org/extend/plugins/).

• Sepuedemodificarsuaparienciamediantelautilizacióndeplantillas.

2.3. Estructura de las URL

EnWordPress,yengeneralencualquierCMS,laestructuradelasURLolosllamadospermalinksvaacondicionarlaestética,usabilidadycompatibilidaddelosenlaces.

Unpermalinkesunenlacepermanente.Sesueleutilizarensitiosweb,gestoresdecon-tenidosoblogsparaasignarunaURLpermanenteacadaentradadelsitioyasíluegopoderreferenciarla.

Elpermalinkidentificademaneraúnicauncontenidosobreuntema,discusiónocues-tiónenelsitiodedestino.Deestaforma,facilitaelaccesodirectoaotrosusuariosquepuedanestarinteresadosenelcontenidoreferenciado.

Elpermalinktambiénseutilizaenpáginasestáticasparamejorarsuposicionamientoenlosbuscadores.

WordPressdisponedevariosesquemasparalasURL.SepuedenverenAjustes > Enla-ces permanentes.

LamejorestructuraparalasURLopermalinkses:

http://www.midominio.com/titulo-de-la-entrada

Porlotanto,enAjustes comunes,cambiaralaopciónNombre entrada.PulsarenGuar-dar los cambios.

2.4. Instalación de WordPress

Sepuederealizardevariasformas.Lamáshabitualconsisteeninstalarelpaquetefuen-te(paquete.tar.gz,descargabledesdehttp://wordpress.org/download/)yprocederalacompilaciónenlapropiamáquinaenUbuntu.EnequiposWindowshayqueinstalarelarchivoejecutablecorrespondiente.

Tambiénsepuederecurrirabitnami.org (http://bitnami.org/).Esteprocedimientoesmuchomás sencillo: elmódulo correspondiente aWordPress incorpora el paqueteWAMPoLAMP,segúnsetrabajeconWindowsoconGNU/Linux,ylaconfiguraciónfinalcorreacuentadelpropioinstalador.

Sialabrirelnavegadoryacce-deraWordPress nosdevuelveun mensaje de error del tipo«Lapáginanoestádisponible»es debido a que el demonioMySQLDnoestáejecutándose.En este caso, y desde una ter-minal, deberemos ejecutar laorden:$./ctlscript.sh start

Otras opciones disponibles sonstopyrestart.

Importante

1.LaarquitecturadeWordPresspermitelacreacióndeexten-sionesqueamplíansufuncio-nalidad y ámbito de utiliza-cióncomogestordeconteni-dos.Sulicenciapermiteestasadaptacionesydesarrollos.

2.EmpresasyorganismoscomolaCNN(http://business.blogs.cnn.com/), Flickr (http://code.flickr.com/blog/), Samsung(http://www.samsung.com),oWallStreetJournal(http://blogs.wsj.com/law/)utilizanWordPress.

¿Sabías que…?

Tienes disponible en el CEOel archivo Instalacion_pila_bit-nami.pdf,enelquesedescribe,como caso práctico, la instala-cióndelapilabitnamiLAMP.

CEO13. ¿PorquécreesqueesmejorutilizarlaestructuraNombre entrada enlosenlaces?

14. Siel idiomapordefectodelportal fueraespañol,¿unusuariodeterminadopodríatenersuentornoeninglés?

15. Averiguacuáles ladiferenciadeestructurabásicaentre losCMSDrupalyWordPress.

Actividades

www.mcg

raw-h

ill.es


16

YatenemoselCMSWordPressinstaladoyenfuncionamiento.Elaspectoeselestándar,queiremosmodificandoalolargodeloscasosprácticosdelaunidad.Llamamosfron-tendaestainterfazdepresentación.

VamosaMeta > Acceder (soloapareceasí laprimeravez, luego loencontraremoscomoAdministración del sitio) y llegamosasía laparteadministrativa (backend)delCMS (http://127.0.0.1:8080/wordpress/wp-admin/). Se solicita el usuario (admin, ennuestrocaso)ylacontraseñaasignadaenelprocesodeinstalación.

LazonadeadministracióndeWordPress,tambiénllamadaEscritorio,permitelagestióndeusuarios,elaspectovisual(temas),categoríasdeentradas,páginasfijas,enlaces,complementos(plugins),etc.Además,lainterfazdeadministraciónsirveparagenerarentradasylaspáginasdelCMS.

Ennuestrocaso,lainstalaciónenUbuntuhadejadotodalaestructuradeWordPressenlacarpeta/home/admin/lampstack-5.3.12-0/apps/wordpress.EnunainstalaciónWin-dowsestaráenC:\Archivos de programa\BitNamiWAMPStack\apache2\htdocs.

Instalación del módulo WordPress Duración estimada:10minutos Dificultad:bajaObjetivo general:instalarelmódulobitnamideWordPressenUbuntu12.04.Utilidades:serequiereelmódulodeWordPressdescarga-bledesde lapáginaoficialhttp://bitnami.org/es/stack/wordpress.ParaUbuntu,sellamabitnami-wordpress-3.4.1-0-linux-insta-ller.run.ParaWindows,descargarelarchivobitnami-word-press-3.4.1-0-module-windows-installer.exe.Solución1. Descarga del archivo de instalación de WordPress para

UbuntuIr a http://bitnami.org/stack/wordpress y descargar elarchivocorrespondiente.Elarchivodebeserejecutable.Paraello,abrirunaterminal,iraldirectorioquecontieneelarchivodescargadoyejecutar:chmod +x nombre _ archivo.run

Hacerdobleclicsobreélodesdeunaterminalejecutarlaorden:

$ bitnami-wordpress-3.4.1-0-linux-installer.run

2. Instalación

Arrancaelprocesodeinstalaciónysolicitaelidiomaparalainstalación.

Seleccionamos el directorio de instalación y se crea lacuentadeladministrador.Asignarunnombredeusuarioadministrador (admin) y una contraseña para accedercomorootalabasededatosMySQL.

Acontinuación,asignamosunnombrealblogquevamosacrear(AulaWEB).IntroducimoslosdatosparaconfigurarlacuentadecorreodelCMS.ComienzalainstalacióndelCMS.Cuandotermina,ofrecelaopcióndeejecutarlaapli-cación.Lanzalaaplicaciónwebyenelnavegadormuestralapáginahttp://127.0.0.1:8080/wordpress/ conelaspectoinicialdelportalestándarquehabráquepersonalizar.

Caso práctico 1

Fig. 2.2. Conexión inicial del portal.Fig. 2.3. Menú lateral.

www.mcg

raw-h

ill.es

17


<?phpget_header();?><?phpget_sidebar();?>

index.php

<?phpget_footer();?>

side

bar.p

hp

3. Estructura del CMS WordPressLaestructuradeWordPresstienedospartestotalmentediferenciadas:quesonelfron-tendyelbackend.

3.1. Frontend: parte pública del CMS

WordPressestructuraelfrontendenvariaszonasosecciones.CadaunadeellastieneunnombreasignadoyunprogramaenPHPquelagestiona.

EnfuncióndeltipodetemaoplantillaqueseutilicedesdeWordPress,puedencambiaralgunasdeestaszonas.Engeneral,todosellosdisponende:cabecera(header.php),pie(footer.php),barralateral(sidebar.php)yzonadecontenidos(query.php).

Estaúltimazonapuedesergestionadapordiferentesprogramasdependiendode loquesenecesitehacer.Porejemplo,encontraremosarchive.php,search.php,category.php,archives.php.

CuandosevisitaunCMSWordPress,seentrasiempreenelsitioatravésdelindex.php.Después,enfuncióndeltema,sepodránmostrarmásomenosseccionesconubicacio-nesconfigurables.

3.2. Backend: panel de administración del CMS

Elbackendeselpaneldeadministracióny,porlotanto,lapartenopúblicadelportalaccesiblesoloparadeterminadosperfilesdeusuario.WordPresslollamaEscritorio.

DesdelapáginaprincipaldelportalwebWordPresssepuedeconectareladministradordedosformas:

1.Proporcionandodirectamentelosdatosdeusuario/contraseñaenelformulariodeconexión.

2.Seleccionando laopciónAdministradordel sitiodelbloqueMETA(paraestetemaenconcreto,queeseltemapordefecto).

En cualquiera de las dos opciones, al introducir losdatosdeconexión,pasamosaver laparteadminis-trativa o backend http://localhost:8080/wordpress/ wp-admin/.ElaspectodelEscritorioopaneldeadmi-nistracióneseldelaFigura2.6.

ElEscritorioconstadelpanellateralizquierdocondife-rentesopcionesdeconfiguraciónagrupadasenmenúsysubmenúsydelazonacentralconlosajustesbási-cosyopcionesquepermitenlacreacióndecontenidoparalaweb.

Fig. 2.4. Distribución de las zonas de trabajo de WordPress.

16. Analizalapolíticadepri-vacidaddeWordPressyhazunbreveresumen.

17. Accede a http://royales tudios.com/noticias/yloca-lizacuáleselporcentajedeimplantacióndeWordPressenelmundo.

18. ¿Creesquepodemosafir-marqueenWordPresslanavegaciónyelaccesoaloscontenidosdelsitiowebesposiblemedianteelusodelosmenús?¿Porqué?

19. Cuandodecimosquedes-deelEscritoriodeWord-Press podemos realizarlosajustesdelsitio,¿aquénosestamosrefiriendo?

Actividades

Fig. 2.5. Entrada existente por defecto en WordPress.

header.php

footer.php

Fig. 2.6. Panel de control o Escritorio de WordPress.

www.mcg

raw-h

ill.es


18

4. Ajustes básicos de configuración y aspecto de WordPress

EsteapartadoestudialosprimerospasosenlaconfiguracióndeWordPress.SiemprequeserealicencambiosenalgunodesusapartadossedeberásalirpulsandoGuardar cambios.EnAjustes > Generales sepuedeasignar/cambiarelnombrealportal,elsub-título,elcorreoelectrónicodeadministracióndelsitio,elperfildeusuariopordefecto,lazonahoraria,etc.

Ennuestrocaso,hemosasignadoelnombreAulaWEBalportalyhemos introducidopequeñasmodificaciones.LaFigura2.7muestralaconfiguracióndefinida.

Veamos losdiferentesapartadosque semuestranenel Escritorio.DentrodeAjustes básicosencontramos:

• Selecciona la configuración de privacidad: permite/deniega a los buscadores queindexenelsitioweb.

• Selecciona tu zona horaria:enlazaconlosAjustes generales delCMS.

•Activa o desactiva los comentarios:permiteunaconfiguraciónparaloscomentarios,cadaentradaparticularodeformaglobal,asícomolaactivacióndelamoderacióndeloscomentarios.

• Rellena tu perfil:sonopcionespersonalesdeconfiguracióndelperfil.Permiteestable-cerelesquemadecolordelaadministraciónparaelcasodelusuarioadmin,activarlosatajosdeteclado,completardatospersonales,proporcionarmásdireccionesdecorreoelectrónicodecontacto,asícomounareseñabiográfica.

Fig. 2.7. Ajustes generales: configuración global del sitio.

Fig. 2.8. Ajustes básicos. Fig. 2.9. Ajustes de privacidad.

Plantilla WordPress o template.Parte software del portal quedetermina la estética, la dis-posición de los módulos, etc.Es decir, separa el contenido(artículos) del diseño (colores,organizacióndeimágenes,tiposdeletra,entreotrosparámetros).

Vocabulario

www.mcg

raw-h

ill.es

19


Personaliza tu sitiopermiteconfigurardetallessobreelaspectodelportal.EstegrupodeentradasdemenúenlazaconlaAparienciadelabarralateralderecha.Sepuede:

•Cambiar el tema que aparece por defecto. Lasopcionesmostradasenlaparteinferiorestánrelacionadasconeltemaelegido.Elenlacellevaaunapáginacondospesta-ñasenlasquesepuedeseleccionarotrotemaoinstalarnuevostemas.Seleccionaclarouoscuro.Sinosquedamosconeltemapordefecto,estaentradapermitecam-biarelcolordelfondo,elcolorparalosenlacesyladistribucióndelcontenidoenelportal.EstepuntoseamplíaenelEpígrafe11.

• Seleccionar una nueva imagen para la cabecera. WordPressmuestralaimagenasig-nada por defecto, aunque deja activada la opción de carrusel de imágenes. Sepuede incluir una imagenpropiaquehabráque seleccionary subir.Enprincipio,dejamosactivadoelcarrusel.

•Añadir widgets. Sepuedenañadirwidgetsalabarralateralseleccionando,arras-trandoysoltandosobreella.SehaañadidoelwidgetCalendario.

Fig. 2.10. Menú de personalización del sitio.

Widget. Es unapequeñaherra-mienta que en determinadostemas permite incluir, modificaryeliminarcontenidosdealgunaszonasdelsitioweb.SEO. Del inglés Search EngineOptimization(optimizaciónparalosmotoresdebúsqueda).Esunconjunto de técnicas y tácticascon el objetivo de aumentar lavisibilidaddeunapáginaositioweb para los motores de bús-queda, mejorando así su posi-ciónenlosresultadosofrecidos.

Vocabulario

Observalacolumnadeladere-cha del Main Sidebar. En ellase muestran todos los widgetsquehastaestemomentosehanincluido. Recuerda que se hautilizadoparaestetemalabarralateralaladerecha.

Importante

20. Teniendo en cuenta la definición anterior de SEO, ¿creesqueesinteresanteactivarestaopcióndeopti-mización?

21. ¿UnusuariopuedeaprenderWordPresssintenercono-cimientosdePHPnidebasesdedatos?

Actividades

Si en WordPress se están utili-zando links permanentes (per-malinks) adaptados para queseleandeformafácil,sepuededefinirelnombreparaunmensa-jeconcretoutilizandoelcampoSlug(nombreparaURL).

Claves y consejos

Fig. 2.12. Pantalla de widgets.

Fig. 2.11. Opciones de configuración del tema por defecto.

www.mcg

raw-h

ill.es


20

5. Usuarios de WordPressWordPressestablecedosgrandesgruposdeusuarios:1.Usuarios del administrador(backend):sonusuariosquepuedenaccederalaadmi-

nistracióndelportal.2.Usuarios del sitio(frontend):sonusuariosquepuedenaccederadeterminadassec-

cionesdelapartepública.Dentrodecadagrupohayunaseriedeperfilesdeusuariosyentreelloshayestableci-daunajerarquíadepermisos,deformaquenotodoslosusuariosdeungrupopuedenhacertodo,sinoquecadaunodeellospuederealizardeterminadasaccionesquesevanacumulandoenfuncióndelosprivilegios.Además,todoslosusuariosdelbackendpuedenrealizartodaslasaccionesdelosusuariosdelfrontend.ConestesistemadeperfilesdeusuariosypermisossepuededaraccesoalEscritorioacuantosusuariossequierayconfigurarexactamentesusfunciones.

CuandosetrabajaconWordPressmultisiteexisteelperfildesúper administrador, quetieneaccesoatodaslasopcionesdeadministracióndedichareddesitios.Cadaunodelosperfilesanterioresenglobaunoomásnivelesquedelimitanlacapaci-daddemaniobradeunusuarioenWordPress.Estosnivelesdefinenloqueesaccesibleonoparacadausuario.Ademásde lagestiónbásicadeperfilesdeusuarioqueofreceWordPress,existeunpluginque laamplíaymejora.Se tratadeRoleManagerypermitepersonalizar losprivilegiosquetendrácadaniveldeusuariodentrodeWordPress.EnelmenúdeadministracióndeUsuarios, aldesplegarlaopciónTodos los usuarios,semuestraunalistacompletadelosusuariosexistentesenelsitio.

Laadministración de usuarios deWordPress es jerárquica y losdistintos tipos de usuarios tienendiferentesnivelesdepermisosden-trodelaadministracióndelsitio.

¿Sabías que…?

•El archivo niveles_usuarios_wp.pdfcontieneladescripcióndelosdiferentesnivelesasocia-dosalosperfilesdeusuario.

•Elarchivorole_manager.pdfdes-cribe ladescarga, instalaciónyusodelpluginRoleManager.

CEO

22. ¿Teparecerazonablequelagestióndelosusuariosdelportalsoloestédisponi-bleparausuariosadministradores?

23. Utilizandoelgestordeusuarios,dadealtausuariosdelportaldelosdiferentesperfiles.

Actividades

Perfiles de Usuario Tareas permitidas

Suscriptor(frontend)

Puedeaccederacontenidosprivadososoloparasuscriptores.Esunperfilidealparawebsdondesepermiteelaccesoaloscontenidossoloausuariosregistrados,capacidadquesehabilitatambiénenelEscritorio.Engeneral,unusuariosuscriptortienepermisosparapoderversuinformaciónprivada,modificarsusdatos,crearyeditarcontenidosenformadeentradasypublicarlassolositienelospermisosadecuados.

Colaborador(frontend)

Puedeescribirnuevasentradasy/onoticias,asícomomodificarlas.Cualquiercontenidonuevonosepublicadirectamente,sinoquerequierelaaprobacióndeunadministrador.Idealparablogsconmuchoscolaboradoresyqueexigendeunnivelmínimodecalidadenlasnuevasentradas.

Autor(frontend)

Escomouncolaborador,peropuedepublicardirectamentesusescritos.PuedeoperarenelapartadoMultimedia.

Editor(frontend/backend)

Puedegestionarartículosynoticiasdecualquierotrousuario.Escasiunadministradorsalvoenlasfuncionesespecíficasdeadministración(instalaciones,modificacióndeplan-tillas,plugins,etc.).

Administrador(frontend/backend)

Accesototalyabsolutoatodalaadministracióndelsitio.Recibeensucorreolasnotificacionesdeloseventosquesucedenenelsitio(nuevoscomentarios,contacto,actua-lizaciones,etc.).Eselencargadodelasactualizaciones,instalacióndeplugins,cambiodeplantillasyconfiguración.

Tabla 2.1. Perfilesdeusuarios.

Losusuariosanónimossonaque-llosquenoseregistranenelpor-talyque tienenaccesoa todaslas partes que el administradorconfiguracomopúblicas.

Recuerda

www.mcg

raw-h

ill.es

21


Gestión de usuarios de Administración

Duración estimada:10minutos Dificultad:baja

Objetivo general:crearusuarioscondiferenteperfildeadministrador.

Solución

1. Menú de gestión de usuarios.ComousuarioadministradoraccederalmenúdeUsuarios.Ennuestrocaso,comotenemoslainstalaciónreciénhecha,solotene-mosunusuarioadminqueeseladministrador.

2. Añadir un nuevo usuario del perfil Editor. PulsarenAñadirnuevoeintroducirlosdatosquesepiden.TenerencuentaqueenPerfilhayqueseleccionarEditor.Parafinalizar,pulsarenAñadir nuevo usuario.

3. Añadir un nuevo usuario del perfil administrador.Repetirelprocesoparadardealtaunusuarioadministrador,consusdatosiniciales.Lellamaremosusua-rioAdmin.

SiaccedemosdenuevoaUsuariosveremosquetenemoscreadostresusuariosparacontrolarelbackenddelportal.Cuandoseconectenestosusuarios,podránrealizarsusajustesbásicosaccediendoalaopciónPerfilenelpanellateralizquierdo,den-trodelmenúUsuarios.

LaFigura2.14muestralastrescuentasdeusuariosdisponibles,dosdeellos,admi-nistradoresyuntercero,editor,quedisponedeciertosprivilegios.

4. Crear usuarios con perfiles autor, colaborador y suscriptor

Seguirlospasosindicadosenapartadosanterioresteniendoespecialcuidadoalseleccionarelperfil.RecuerdatambiénquehayqueGuardar los cambios.

Caso práctico 2

5.1. Registro de usuarios

Cuandounusuarioconcuentaenelportalsequiereconectar,debeaccederalformula-riodeconexióneintroducirsunombredeusuarioycontraseña.LaFigura2.15muestraesteformulariodeconexión.

Alentrar,semuestraalusuariosuPerfil,quepuedeconfigurarconsusopcionespersona-lesydatosdecontacto.TienetambiéndisponiblesuEscritorio,enelquepodrárealizardeterminadastareasenfuncióndesuperfilyprivilegios.

Sieladministradornecesitaconocercuántosusuariosestánconectadosalportalenunmomentodeterminado,WordPressnodisponedeunaherramientanativaparaello.Hayque instalar un plugin específico llamado wp-useronline (http://lesterchan.net/word press/category/plugins/wp-useronline/).

Fig. 2.13. Creación de un nuevo usuario.

•Solo el usuario administradorpuederealizarcambiosdeper-fil de los usuarios registradosenelsitio.

•Cuandosecreaunnuevousua-rio, el sistemaenvíade formaautomática una notificación aesapersonaconsusdatosdeconexión.Estorequiereunaco-rrectaconfiguracióndelcorreo.

¿Sabías que…?

Fig. 2.14. Lista de usuarios creados.

Fig. 2.15. Conexión del usuario.

www.mcg

raw-h

ill.es


22

6. Organización de los contenidosLoscontenidosconstituyenelelementobásicodelsitioweb.Suestructurayorganizacióndeterminaránelfácilaccesoaellosy,enconsecuencia,lausabilidad.EnWordPresshayvariostiposdecontenidos:• Páginas• Post o entradas•Multimedia• EnlacesLaspáginassoncontenidosdecarácterestático,dereferencia,quenoseactualizanen laportada,sinoqueofreceninformaciónpermanentea laquesepuedeaccedermediantemenúsdenavegación.Lasentradasopostssoncontenidosdecarácterdinámico,tiponoticiasytemasnuevos,quesesitúanalcomienzodelaportadadelsitioenordencronológico.Multimediaescontenidonotextual,comofotografías,sonidos,vídeos,etc.,incluidoenlasentradas.ExisteunmenúdegestiónenelpaneldeadministraciónllamadoMultimedia.Enlaces,comosunombreindica,sonlistasdeenlacesaotrossitioswebyquesegestio-nandesdeEscritorio > Enlaces.Losenlacessepuedenorganizarporcategorías.ElaspectodelCMSsepuedeconfigurardeformaque,porejemplo,quedeunpostfijoenlaprimeraposición(requiereelpluginwp-stickyhttp://wordpress.org/tags/wpsticky) oenlaportadadelsitiosiemprehayaunapáginaestáticaounapáginadecategoríasquepermitanlanavegacióndecontenidos.LoscontenidosenWordPressseorganizandeformajerárquicaencategorías,subcate-goríaseítems,esdecir:Categoría > Subcategoría > ítem.Estaorganización jerárquica implicaquedentrodeunacategoríapuedahaberunaomássubcategoríasydentrodeunasubcategoríapuedahaberunoomásítemsdecontenido.CadaunodeestosnivelesorganizativosdisponedesupropiogestorenelEscritorio.Porotraparte,estánlasEtiquetas,quesonpalabrasclaverelacionadasconlaentrada.Constituyenotraformadeclasificacióndeloscontenidosquefacilitalasbúsquedasyelposicionamiento.Uncontenidopuedeencontrarseenunaseriedeestadosposibles:• Publicado.• Borrador.• Esperandorevisión.• Privado(soloparausuariosregistrados).• Protegido(concontraseña).• Eliminado.Paracrearloscontenidos, es muy importante seguir un orden correcto. La propuesta es seguir el orden siguiente:1.Definirycrearlascategorías,yaquetodoelcontenidodeberáiragrupadoenestos

grandescontenedoresdecontenido.2.Definirycrearlassubcategoríasdentrodecadacategoría(sihicierafalta),que

haránelpapeldecontenedoresdecontenidosdesegundonivel.3.Crearyasociarloscontenidos(entradas)alassubcategoríasycategoríasquecorres-

pondan.4.Definirycrearlosmenúscorrespondientes,quedeterminaránlaformaenlaqueel

usuarioaccederáacederáloscontenidosdelportal.

Taxonomía.Seutilizaparaclasi-ficarcontenido.Sontaxonomíaslascategoríasylasetiquetas.Unataxonomíaconstadetérmi-nosquepuedenaplicarsea loscontenidos.«Sin categoría» es un términodentro de la taxonomía cate-goría.Categoría. Es una taxonomíajerárquica. Permite crear unaestructurajerárquica.Etiqueta. Es una taxonomía nojerárquica.Notieneestructura.

Vocabulario

Dos de las características másimportantes de la publicaciónwebconWordPressson:1.Laautomatizacióndelapubli-

caciónprogramandosufechade publicación y fecha decaducidad.

2.Laposibilidaddearchivarlaspáginasantiguasenunhisto-rialsintenerqueborrarlas.

Importante

www.mcg

raw-h

ill.es

23


Creación de categorías y subcategorías

Duración estimada:5minutos Dificultad:baja

Objetivo general:crearunacategoríaycuatrosubcategoríasparalasunidades1,2,4y5delmóduloprofesionaldeAplicacionesWeb.Esunpasoprevioalagene-racióndecontenidosqueseveráenloscasosprácticos6y7.

Descripción:crearunacategoríaparaelmóduloprofesionalAplicacionesWebquesellamaráAplicaciones_Web.Dentrodeestacategoría,crearcuatrosubcategoríascorrespondientesacuatrounidadesdelasquesecomponeellibro:U1,U2,U4yU5,ydentrodecadasubcategoríairasociandoentradasdecontenido,porejem-plo,conactividadesodocumentaciónadicional.

Elesquemasería:

Categoría (Aplicaciones_Web) > Subcategorías (U1, U2, U4, U5) > Entradas de contenido

Solución

1. Creación de la categoría

IraEscritorio > Entradas > Categorías.Cuandoseabralaventana,introducirlosdatoscorrespondientesalanuevacategoría:nombre(Aplicaciones_Web),noasig-narningunacategoríasuperioryenlaDescripción explicarbrevementeelobjetivodeestasección.

2. Creación de las subcategorías

Paracrearunasubcategoría,iraEntradas > Categorías.Elprocesoessimilaralacreacióndeunacategoríaconlaparticularidaddequesedebeasignarunacategoríasuperior(Aplicaciones_Web)yenlaDescripción explicarbrevementeelobjetivodecadasubcategoría.

CreardeestaformalasubcategoríaU1.

Delamismaforma,crearunanuevacategoríallamadaProyectocondossubcate-goríasparalasunidades3y6.

Caso práctico 3

Fig. 2.16. Creación de una categoría.

Fig. 2.17. Creación de las subcategorías.

24. ¿Quérepresentaelcam-poSlug?

25. ¿Quérepresentaelcam-poEntradasenunacate-goría?

26. Crear las tres catego-rías restantes (U2, U4 yU5) relacionadas con lacategoríaAWEBsiguien-do las explicaciones delCasopráctico3.

Actividades

•DesdeApariencia > Menús po-demoscrearunmenúpersonali-zado,gestionarloeindicarquépáginas, categorías y enlacespersonalizados van a formarpartedeestemenú.

•ElnúmerodemenúsadmitidosporWordPressdependedelaplantillaotemautilizado.

Importante

www.mcg

raw-h

ill.es


24

Creación de un menú personalizado

Duración estimada:20minutos Dificultad:media

Objetivo general:crearunmenúcuyoselementosesténasociadosalassubcatego-ríasdefinidasenelCasopráctico3.

Solución1. Creación de un nuevo menú.DesdeMenúsiralapestañaenlaqueapareceel

signo«+».AsignaralmenúelnombreAWEB,nombredelmódulocorrespondiente,unabrevedescripciónypulsarenCrear menú. Yatenemoselnuevomenúcreado.

ParaqueseveaelmenúcreadoAWEB,hayqueiraEscritorio > Apariencia > Menús > Ubicación del TemayelegirelPrimary Menu(AWEB).

2. Asociar al menú las categorías.Elpasosiguienteesasociaralmenúlascate-gorías/subcategoríasquesequiera.EnnuestroejemplotenemoslacategoríaAplicaciones_Webycuatrosubcategorías.Asociamosaestemenúlassubcate-goríasU1,U2,U4yU5.ElrestodeunidadesestánrelacionadasconelProyectoylasasociaremosaotromenú.

Caso práctico 4

7. Gestión de menúsWordPresspermitelanavegaciónyaccesoaloscontenidosdelportalatravésdemenús.Loscomponentesdelmenúsonlosítemsdemenúoentradasdemenú.

Engeneral,enunmenúsepuedenincluir:

• Categorías.

• Páginas.

• Enlacespersonalizados.

Algunosmenússecreanenelprocesodeinstalacióndelportal,perosepuedenelabo-rarnuevosmenúspersonalizadosy/oeditarlosyaexistentes.

Eladministradordelsitioesquienpuedecrearmenús.Cualquierotrousuariodadodealtaenelsitionopodráhacerlosinotieneperfildeadministrador.

Esimportantetenerencuentaquelosmenúsvanasociadosalostemas.Esdecir,untemaoplantilladeterminadasoportaunnúmeromáximodemenúsysolodeterminadosmenús.Porejemplo,eltemaquehemosseleccionadopordefectosoloadmiteunmenúllamadoPrimary Menu.

SepuedeaccederalagestióndemenúsdesdeelEscritorio,conlaopciónApariencia > Menús.

LasaccionesquesepuedenrealizarconlosmenúsylosparámetrosasociadosestándescritosenelCasopráctico4.

Fig. 2.18. Categorías existentes.

Fig. 2.19. Creación de un menú. (Continúa)

www.mcg

raw-h

ill.es

25


ParaellohayqueseleccionarelmenúAWEByenlacajadecategorías,enlapestañaVer todo,semuestrantodosloselementosdisponiblesdetipocategoríaparaasociaraestemenúAWEB.PulsarenAñadir al menú(Fig.2.20).

Enelbloquedeladerechapodemosobservar,enlapes-tañadelnuevomenúAWEB,lassubcategoríasasociadas.

3. Publicación del menú AWEB.Lavisualizacióndelnuevomenúes inmediataparaelusuarioadminquelahacreadoyparael restodeusuariosque lo veríanalaccederalsitio.Aparececomounabarraenlaparteinferiordelaimagendecabeceradelportal.

Enunmenúsepuedenincluirenlacespersonalizadosquereferenciandireccionesweb.Porejemplo,sepuedeaña-dirunenlacealmenúcreadoquellevedirectamentealaweboficialdeWordPress.RellenarloscamposypulsarenAñadir al menú.Acontinuación,pulsarenGuardar menú.

Enlapartepúblicadenuestroportalyapodemosverelnuevomenúvacío,puestoquenoselehaañadidoningúnítemdecontenido.

4. Edición del menú AWEB.ParaeditarunmenúhemosdeaccederaAparien-cia > Menús y, amododepestañas,vemostodoslosmenúsdisponibles.Alseleccionarelmenúquesequiereeditar(AWEB)semuestranlascategoríasysubcategoríasasociadasyquesepuedeneditar/eliminar.

Tambiénsoneditablesenesemomentolascategoríasysubcategorías,enlacesypáginas.

5. Creación de submenús.SetratadecreardosentradasdemenúdentrodelosmenúsU1yU2.SellamaránReflexio-nesyDocumentación,respectivamente.EnelsubmenúReflexioneselprofesordelmóduloincluiráunconjuntodeindicacionessobrelaunidad,tareasquesehanderea-lizar,plazosdeentrega,etc.ElsubmenúdeDocumenta-ciónponeadisposicióndelosalumnostodosaquellosarchivosrelacionadosconlaunidadqueseandeinterés.

Para ello, creamosdos nuevas categorías,ReflexionesyDocumen-tación, que no asocia-mos a ninguna supe-rior. Ir ahora a Menúsyarrastrarcadaunadeestas categorías a laentrada de menú a laquesequiereasociar.

LaFigura2.23muestrala estructura delmenúconestasaportaciones.

6. Comprobación en el portal.Sivamosahoraalportal,vere-mos el menú creado consus entradas de submenúen forma de lista, comomuestralaFigura2.24.

7. Tarea: Crear un menú Pro-yecto.Crearunaentradade menú llamada Pro-yecto (asociada a lacategoría Proyecto), quetengacomosubmenúsentradasasociadasalascate-goríasU3yU6.

Caso práctico 4

(Continuación)

Cuandoseborraunmenú,seelimina tanto el menú selec-cionado como las entradascontenidasenél.

¿Sabías que…?

Fig. 2.20. Enlace a la web de WordPress.

Fig. 2.23. Categorías enlazadas al menú AWEB.

Fig. 2.21. Gestión de menús.

Fig. 2.24. Opción de menú desplegable.

Fig. 2.22. Menú AWEB en la portada del sitio.

www.mcg

raw-h

ill.es


26

8. Gestión de contenidosExistenvariostiposdecontenidos,perodossonlostiposbásicosenWordPress:• Estáticos(páginas):norequierenorganización.• Dinámicos(posts/entradas):asociadosacategoríasysubcategorías.La creación y administración de contenidos estáticos o páginas se realiza desde laopciónPáginasdelEscritorio.LacreaciónyadministracióndecontenidosdinámicossehacedesdeEntradadelEscritorio.Losusuariosadminyeditorpuedencrearpáginas,tantodesdeelfrontendcomodesdeelbackend.LaspáginasseveríanenelsitiocomosifueransubdominiosaccesiblesatravésdelaURLalaqueseleañadealfinalelSlugasociado.

8.1. PáginasElmenúPáginas tienedosopciones:Todas las páginasyAñadir nueva.Todas las páginaspermitelagestióndetodaslaspáginasexistentes.Enestemomentosoloexisteunareferencia.CadapáginadisponedeopcionesparalaEdición,Tirar a la PapelerayVer.Comprobamosque,paralapáginadeejemplo,elautoresadmin,estápublicadaynotieneningúncomentario.Siseeditadichapágina,severásucontenidoylasopcionesdepublicaciónyvisibili-dad,entreotras.

Fig. 2.25. Menú de gestión de páginas.

Fig. 2.26. Páginas existentes.

Fig. 2.27. Contenido de página de ejemplo.

Las páginas tienen como esta-dosposibles:•Publicada.•Pendientederevisión.•Borrador.Otracaracterísticadelaspáginasessuvisibilidad,quepuedeser:•Pública.•Protegidaporcontraseña.•Privada.

Importante

Laspáginasno sepuedenaso-ciar con las categorías yno sepueden asignar etiquetas. Laestructura organizativa de laspáginas solo proviene de susrelaciones jerárquicas (páginasysubpáginas),ynodeetiquetasocategorías.Laspáginasnosonarchivos.Sealmacenanenlabasededatosaligualquelosmensajes.

¿Sabías que…?

www.mcg

raw-h

ill.es

27


Creación de una página con un texto de bienvenida Duración estimada:10minutos Dificultad:mediaObjetivo general:crearunapágina,editarlapararealizarcambiossobreellayverdiferentesopcionesdepublicacióndelapágina.

Solución

1. Crear una página.EnelEscritorio,iraPáginas > Añadir nueva.Asignamoscomotítulo«Bienvenido/aalmódulodeAplicacionesWeb».

Introducireltítuloyeltextodelabienvenida.Guardar borradoryenVista previasepuedeverelaspectodeestanuevapáginadesdeelfrontend.

Fig. 2.28. Página de bienvenida.

2. Editar la página.DesdelaVista previa, pulsarenEditarpararealizaralgunoscambiosenlapágina.

Lapublicacióndelapáginasepuedeprogramarparaunahorayfechaconcretas.Aladerechadelapantalladeediciónsevenloscamposquelopermiten.SisepulsaenPublicar,sepublicaenesemismoinstante.ObservamostambiénqueestácomoBorrador. LapasamosaestadoPendiente de revisiónypulsamosenAceptar.LuegopulsaremosenGuardar como pendiente.EnlaopciónTodas las páginashaydospáginas,yenlacreadaapareceeltextoPendiente.

EditarlapáginadenuevoparamodificarsuestadoquesedejaenBorradoryPubli-cada.Lazonadeedicióndeltextodelapáginatienedospestañas.Una,llamadaVisual,paraintroducireltextotalycomoseverá,yotrallamadaHTMLparaverelcódigoHTMLconlasdiferentesetiquetasdisponibles.EnlazonaAtributos de la páginasepuedenrelacionarlaspáginas.Esdecir,sepuedeindicarqueunapáginatieneunnivelsuperiorqueseráunapáginaprevia-mentecreada.Portanto,sepuedenagrupardeformajerárquica.

Caso práctico 5

Fig. 2.29. Lista de páginas.

27. ¿Crees que, según loexplicado hasta ahora,podemos decir que losmenúsdenavegacióndeWordPressenlazancual-quier combinación decategoríasyentradas?

28. Averigua qué pluginsde WordPress puedenmejorar la redacción, eldiseño,lafuncionalidadolapersonalizacióndelasentradasdeWordPress.

Actividades

Fig. 2.30. Atributos de la página.(Continúa)

www.mcg

raw-h

ill.es


28

ObservarquelaURLdelanuevapáginaes:http://localhost:8080/wordpress/bienvenidoa-al-modulo-de-aplicaciones-web

3. Imagen destacada de la página.Otraopciónparalapáginaeslaimagendes-tacada,quepodemosincorporarle.Simplementehemosdearrastrarysoltarenelrecuadrolaimagenquesequieradesdeelpropioequipo,desdeunaURLdeterminadaodesdeunabibliotecamultimedia.

Elegidalaimagen,semuestraunaventanadeedicióndesusprincipalescaracterísticas.

Caso práctico 5

(Continuación)

Fig. 2.31. Establecer imagen destacada.

Fig. 2.32. Características de la imagen.

En http://ayudawordpress.com/tu-propio-logo-en-la-cabecera-del-escritorio/ encontrarás infor-mación sobre cómo incluir tupropio logo en la cabeceradetusitioweb.

Web

29. Localiza una extensióndeFirefoxque facilite latareadeedicióndepági-nasHTML,hojasdeestilo,etc.,alosadministradoresdesitiosweb.

30. Editarlapáginadebien-venidaeidentificarlaseti-quetasHTMLycomentarsusignificado.

31. Sobre la misma página,identificar las etiquetasCSSycomentarsusigni-ficado.

Actividades

(Continúa)

www.mcg

raw-h

ill.es

29


Al finalizar laedición, sepuedepulsaren Inser-tar en la entrada/Usar como imagen destacada/Borrar. Finalmente,Actualizar.Cuandosenecesiteutilizarunaimagenyasubidaalapágina,sepuedepulsardenuevoenEstable-cer imagen destacadaysemuestralaventanaconvariaspestañas.EntreellasestálaGalería,enlaqueseencuentralaimagensubidaycuyaspropie-dadespodemosmostraryeditar.Tambiénofrecelaopcióndeinsertartodaunagale-ríadeimágenescompletaenlapáginayconfigu-rarsuvisualización(posición,orden,etc.).4. Edición rápida.Laediciónrápidamuestraenuna

ventana(Fig.2.34)elresumendelasopcionesmásrelevantesquesepuedenmodificar.Entreellas,estálaposibilidaddeasignarunacontra-señaaunapáginaprivada,que se solicitarácuandounusuarioquieraaccederaella.

SedebeobservartambiénqueelSlugindicadoeslapartedelaURLdadaenelpunto2yquerefe-renciaadichapágina.Siserealizancambios,pul-sarenActualizar.

5. Edición masiva de páginas.DesdelavistaTodas las páginas, sepuedenselec-cionarvariasdeellasyrealizarunaediciónmasiva.Paraello,pulsamosenelrecuadrodeseleccióndelaspáginasquequeremoseditary,enlalistadeAcciones en lote,iremosaEditar.

LaFigura2.35muestralaventanadeediciónmasivadetodaslaspáginasseleccio-nadas.EnestasituaciónsepuedenrealizarcambiosglobalesentodaslaspáginasquehabráqueActualizar.

Caso práctico 5

(Continuación)

Fig. 2.33. Galería de imágenes.

Fig. 2.34. Nuevo artículo para la sección News.

Fig. 2.35. Edición masiva de páginas.

Una vez que se ha escrito unaentrada,paraquenosepierdacuando esté publicada duranteunosdíasyyanoaparezcaenlaportada, hay que categorizarlayvincularlaaunaetiqueta.

Importantewww.mcg

raw-h

ill.es


30

Hemosvistocómocrearcontenidodesdeelbackend.ConelCasopráctico6vamosacrearcontenidodesdelapartepúblicadelportal.Hayquerecordarquenotodoslosperfilesdeusuariodelfrontendpuedenrealizarestatarea.

Creación de una página de contenido desde el frontend

Duración estimada:5minutos Dificultad:mediaObjetivo general:crearunapágina,editarlapararealizarcambiosenellayverdiferentesopcionesdepublicacióndelapágina.Solución

1. Crear una página.Elusuarioadminseidentificaenelsitioweb.Elsitiodisponedeunabarrasuperiorconvariasopciones.

Unadeellas(+ Nuevo)eselaccesodirectoalacrea-ción de una nueva página. Seleccionar la opciónPágina.Lainterfazquesemuestraeslamismaquealaccederdesdeelpanelizquierdodelapáginadeadministración(http://localhost:8080/wordpress/wp-admin).

Enestecaso,secreaunapáginaqueseutilizarácomozonadenotificacionesdelmóduloAplicacionesWebporpartedelprofesorado.Asignaralapáginaelnombre«Notificaciones»eintro-ducirunabrevedescripción.Dejarlasopcionespordefecto.ComprobarquelaURLasignadaeshttp://localhost: 8080/wordpress/notificaciones ypulsarenPublicar.

2. Editar la página protegida con contraseña. Sepuedeproteger unapáginadesdeEdición RápidaodesdeVisibilidad > Editar > Protegida por contraseña.

EnAtributos de página,indicarquesupáginasuperioresBienvenida al módulo web. Comprobar cómo su URL cambia a http://elvira:8080/wordpress/ bienvenida-al-modulo-web/notificaciones.

Enplantilla,utilizarSidebar templateyasignarunaimagenpersonalizada.PulsarenActualizar.LaFigura2.38muestraelaspectodelanuevapáginaalservisitada.

Estanuevapáginahasidocreadaporelusuarioadmin.Soloelusuarioconperfildeeditorpodríaeditarlatambién.Cualquierotrousuariosolopodrávisitarlasiconocelacontraseña.

Caso práctico 6

Fig. 2.36. Opciones disponibles desde el frontend.

Fig. 2.37. Petición de contraseña en una página protegida. Fig. 2.38. Página protegida visible.

www.mcg

raw-h

ill.es

31


8.2. Entradas o posts

EnelEpígrafe6sedefinióelconceptodeentradaopostcomocontenidodinámico.Sue-leutilizarseparapublicarnoticiasy,pordefecto,sesitúaenprimerlugardelaportadadelsitiowebenordencronológico.La gestión de entradas permite configurar cuántos posts aparecen en la portada, sisedejaunoancladoenprimeraposiciónyotrasopcionesqueseestudianenelCasopráctico7.Tambiénsepuedecambiarestemododefuncionamientoyhacerqueelcontenidodelaportadasiempreestéocupadoporunapáginaestáticaoinclusounapáginadenave-gacióndecontenidos(páginadearchivosopáginadecategorías).

Creación de una entrada/post desde el backend Duración estimada:20minutos Dificultad:mediaObjetivo general:crearunaentrada,editarlapararealizarcambiosenellayaso-ciarlaaunacategoría.Verdiferentesopcionesdeedición.Solución

1. Crear una entrada.DesdeelEscritorioiraEntradas.LasopcionesdisponiblesdeestemenúsemuestranenlaFigura2.39.

IraAñadir nueva.ElaspectodelainterfazesmuysimilaraldeAñadir una página,quesevioenelEpígrafe8.1.Laentradasellamará«Ini-cio de curso: tutorías» yestaráasociadaa lacate-goría Aplicaciones_Web.Rellenamos los camposdelasiguienteforma:

• Estado:Borrador.• Visibilidad:Pública.• Formato:Estándar.• Categoría:Aplicacio-

nesWeb.• Etiqueta:Reflexiones.

Pulsar en Guardar Borra-dor yVista previa.Obser-varelaspectodelanuevaentraday, sinohaynadaque cambiar, editar denuevo la entrada y pulsarenPublicar.Observarqueenlasentradasexistelaopcióndeasignaracadaunadeellasunaetiqueta(tag).Comoyasedijo,lasetiquetasactúancomoinformacióndemetada-tos,esdecir,palabrasclavequeluegoseutilizaránenlasbúsquedasparalaloca-lizacióndelaentrada.

2. Edición rápida de la entrada.IrdenuevoaEntradas > Todas las entradasypul-sarenlaEdición rápidadelapáginacreada«Iniciodecurso:tutorías».

Laediciónpermitemodificarlacategoríaasociada,cambiarlaetiquetaoasignarlenuevasetiquetasadichaentrada,cambiarelestado,fijarestaentradaocambiarelformatodelaentrada,entreotras.

Caso práctico 7

Fig. 2.39. Menú Entradas del Escritorio.

Fig. 2.40. Crear una entrada.

EnWordPresspuedesescribiruncontenido hoy y programar supublicación de forma automáti-caparaotrafechaposterior.

¿Sabías que…?

Conviene categorizar las entra-das.Deestaforma,silasopcio-nesdemenúsoncategorías,alacceder a ellas, se mostrarántodas las entradas de dichacategoría.

Importante

(Continúa)

www.mcg

raw-h

ill.es


32

Ahora,modificardeformaquenosepermitanloscomen-tarios y cambiar la fechadepublicaciónparaque sedemoreunos10minutos.PulsarenActualizar.Alpieseindicalacategoríaalaqueestáasociadaestaentrada.Laediciónestápermitidaporqueseestávisi-tandoelsitiocomousuarioadmin.Noseadmitencomen-tarios.Aunqueseestávisualizandolaentrada,enrealidadlapublicaciónnoseharáhastaquelleguelafechayhoraprogramadas.

3. Entrada pendiente de publicación.Denuevoeditar laentradaycambiarsuestadoaPendiente de revisión.PulsarenActualizar.

Ningúnusuariodelsitioveestapágina;nosemuestracomoEntrada reciente.EnlalistadetodaslasentradasapareceeltextoPendienteyquieredecirque,hastaqueunusuarioconpermisosnolapublique,seguiráendichoestado.Unusuarioeditorvelaentradacomopendienteypuedecambiarsuestado.Unusua-riocolaboradorosuscriptorvequeestápendiente,peronopuedecambiarsuestado.

4. Filtrado de entradas.Cuandoelsitiotienegrancantidaddeentradas,esnece-sariovisualizarlassiguiendoalgúncriterio.

EnlaFigura2.42,enlapartesuperiorestándisponiblestrescriteriosdeclasifica-cióndelasentradas.

1.Porfechas.2.Porcategoríaosincategoría.3.Poretiquetas.

Tambiénsepuedenorganizarlasentradasporaquelloscamposdecabeceraquelopermitan(apareceunpequeñotriánguloenunsentidouotroindicandosielordenesascendenteodescendente).Porejemplo,portítulo,porautoryporfecha.Existelaopcióndeaplicaraccionesdeformaglobal(Acciones en lote), comolaediciónyelborrado.Cuandoserealizantareascomunesavariasentradas,estofacilitalastareasdeadministración.

5. Añadir una imagen. Se puede añadir una imagen a la entrada creadasiguiendoelmismoprocedimientoexplicadoenelCasopráctico5,apartado3,paralaspáginas.

Caso práctico 7

(Continuación)

La creación de entradas desdeel sitiowebes totalmentepara-lela a la creación desde elbackend. Es unaopcióndentrode + Nuevo. Solo los usua-rios autor, colaborador, editory administrador pueden crearentradasdesdelapartepúblicadelportal.

Importante

Fig. 2.41. Nueva entrada para Aplicaciones_Web.

Fig. 2.42. Filtrado de entradas de Aplicaciones_Web.www.mcg

raw-h

ill.es

33


9. Gestor de la página de inicioLapáginadeinicioeslaquelosusuariosveráncomoentradaalsitiowebyWordPressdisponedevariasopcionesparaello.

9.1. Fijar página estática como página principal

WordPresspermiteestablecerunapáginadeformaestáticacomopáginadeiniciodelsitioweb.Lapáginatitulada«Bienvenido/aalmódulodeaplicacionesWeb»vaaserutilizadacomopáginaprincipaldelsitio.

Paraello,ycomoadministrador,iraAjustes > Lectura(indicaloqueleeránlosusuarioscuandoaccedanalportal)yenelapartadoLa página inicial mostraráseleccionarUna página estáticadelasdisponiblesenlalistadesplegable.EnelapartadodeAjustes de lecturasepuedenconfigurarotrosparámetrosdefuncionamientodelsitioweb.

ElaspectodelapáginaprincipalesahoraelquemuestralaFigura2.44yestádetermi-nadoporeltemautilizadohastaestemomento,queeseltemapordefecto.

Observaque laURLnoes la típicadeunapágina,sino lacorrespondienteal inicio(index.php) deWordPresshttp://localhost:8080/wordpress/. Para finalizar, se dejarádesactivadalaopcióndepáginadeinicioysevolveránaverlasentradasquenoesténcategorizadas.Tambiénsepuedeaprovecharparaeliminarlaentradatípicadel«Hola,mundo».EnelEpígrafe11,quetratasobretemas,secambiaráeltemadelportalyseverádequéformaafectaalaestructuradelmismo.

EnAjustes de lectura se puedeestablecer el número máximode entradas que se mostraránen el sitio, el número máximodeentradasquesemostraránalsindicarelsitio,sisemuestralaentradacompletaounresumenyelsistemadecodificaciónqueseutilizaenlasentradasypági-nasdelsitio.

Importante

Fig. 2.43. Creación de una página estática al inicio.

Fig. 2.44. Página principal del portal AulaWEB.

www.mcg

raw-h

ill.es


34

10. Otros componentes de WordPressOtroselementosnomenosimportantesdeWordPresssonloswidgetsylasextensionesquetratamosacontinuación.

10.1. Widgets

Widgetesunprograma(generalmentepequeño)ominiaplicaciónqueseejecutaporunmotoroWidgetEngine.

Elusodewidgetsfacilitaelaccesoafuncionesutilizadasmuyamenudoyqueafectanalainformaciónvisualdelsitio.Tambiénselosconocecomogadgetsdeescritorio.

Sonwidgets:elcalendario,lasnotas,lasnubesdeetiquetas,búsquedas,agendas,cal-culadoras,informacióndeltiempo,etc.

EnWordPress,elaccesoaloswidgetsestaenelEscritorio > Apariencia > Widgets.

La Figura2.45muestra la colección dewidgets disponibles en relación con el temainstalado.Añadirunwidgetes tansencillocomopulsarenAñadir/Arrastrar.Aleditardichowidget,hayqueseleccionarellugardondeestarávisiblelainformaciónquepro-porciona.

EnelEpígrafe11severácómoseutilizandeterminadoswidgetsasociadosalospluginsqueseinstalenparaeltemaseleccionado.

10.2. Extensiones

LasextensionesenWordPress (http://wordpress.org/extend/) sonaplicacionesque leañadenfuncionalidad.Haydisponiblesgrancantidaddeellas,desdetiendasvirtuales,galeríasdeimágenes,foros,etc.,peroconvienesoloinstalaraquellasquerealmentesenecesiten,esdecir,aquellascuyafuncionalidadseaimprescindibleenelportal.

Lasextensionespuedensercomercialesogratuitas.

Dentrodelgrupodeextensiones,WordPresstiene:

• Temas o plantillas. Se denomina tema o plantilla a lamanera en queWordPressmuestrasuscomponentesenelsitiowebysuaspecto,permitiendopersonalizareldiseñodelCMS.

• Plugins. Sedefineplugincomopequeñoprogramaquepermiteintegrarotrosconteni-dosenelcuerpodelartículo,comocontroles.

Esimportantetenerencuentaalgunosdetallesrespectoalusodelasextensiones.Engeneral:

• Sisehainstaladounaextensiónysecompruebaquenoesútil,hayquedesinstalarla.Hayqueintentarinstalarsololoquesenecesite.Siseinstalancomponentessincono-cersufunciónydejandeutilizarseporquenointeresan,elsistemasehacemáslentoypesado.Hayqueinstalarsololosquesevayanautilizar.Poreso,esfundamentaltenersiempredosmáquinasconelmismoCMS,unaparaexplotaciónylaotraparapruebasdondeserealizaránlastareasdeinvestigación,pruebasdeplugins,etc.Ysolosetrasladaránloscambiosaladeexplotacióncuandosehayanvalidadoynodenerrores.

• Lasextensionessedebenmanteneractualizadas.DelamismaformaqueseactualizaperiódicamenteelpropioWordPress,tambiénsedebenactualizarlasextensiones.

• Instalarsoloextensionesfiables,esdecir,descargadasdesitiosoficiales.Seevitaránposiblesproblemas.

• LasextensionesqueseinstalanpordefectoconWordPressnohayquedesinstalarlas.

Fig. 2.45. Widgets disponibles.

32. Localizaunvídeoqueteayude a entender cómogestionar loswidgets enWordPress.

33. Existen varios tipos deplugins, ypor cada tipodepluginexisteundirec-toriodentrodeldirectorioplugins.AveriguacuántostipostienesinstaladoscontuWordPress.

34. Enumera componentesWordPressquepermitanrealizarencuestas.

Actividades

Sidespuésdeactivarunwidgetse necesita realizar algún cam-biodeconfiguración,accederalabarradeladerechaenlaquesemuestran loswidgets activosconlaopcióndeEdición.

Importante

Cadacomponente tienesupro-pia tabla en la base de datosde WordPress. Esto es lo queproporciona su independenciay permite que sean instalados/desinstaladossininterferirconelrestodelportal.

Claves y consejos

www.mcg

raw-h

ill.es

35


11. Gestión de temasWordPressutilizaunatécnicaquepermitelaseparacióndelcontenidoyeldiseño(pre-sentación).Deestaforma,sepuedecambiarlaestéticadelportalWordPresssinalterarloscontenidosni laorganizaciónde losmismos.Paraello, seutilizan los temas (delinglésthemes)oplantillas.Porlotanto,lostemasdeterminanelaspectoyladistribucióndeloscontenidosdelportal.

Eladministradortambiénpuededescargartemasdisponiblesenlawebdeformagra-tuita,depagoobiendesarrollarlas.ElsitiooficialdetemasdeWordPresseshttp://wordpress.org/extend/themes/.

Enrealidad,untemaesunconjuntodearchivosqueglobalmenteconformanlainterfazgráficadelsitiowebofrontend.

Estosarchivossondevariostipos:imágenes(.jpg,.gif),páginasHTML(.html),códigoPHP(.php),hojasdeestilo(.css),etc.

EnelprocesodeinstalacióndeWordPresseltemapordefectosellamaTwentyEleven,queademásdejadisponibleotrotemallamadoTwentyTen.Todosloscambiosyconfigu-racionesquesehanrealizadohastaestemomentohansidosobreeltemaTwentyEleven.LostemasdisponiblesestánenApariencia > TemasenlapestañaAdministrar temas.

Cada tema tieneunaseriedeopcionesespecíficasquehayqueconocer,comosonmenús,parámetrosdeltema,fondo,cabeceraowidgets.Siseinstalaunnuevotema,susopcionessondiferentes.

11.1. Antes de elegir un tema...

Esimportantequeantesdeelegiruntematengamosclarasalgunascuestiones:

• Sabercómogestionarelmenú,siessencillo,sipermitemenúsdesplegables,etc.• Conocersiladistribucióndeloscontenidosdelapáginaprincipalquesetieneahora

eslaquesequiereensupáginadeinicio.• Sabersiexistenwidgetslistosparaesetemaysisongratuitosodepago.• Conocersinecesitawidgetsy,siesasí,sabersisepuedensituarenlabarralateral

confacilidad.Y,sino,seguramentesetendráqueoptarporotrotema.Hayquehacerpruebasantes.

11.2. Opciones del tema

DesdeApariencia > Temas sepuedenmodificarlasopcionesdeuntemaparticular.LaFigura2.46muestralabarradeopcionesparaeltemapordefectojuntoconlasetique-tasaplicables.

SisepulsaenTheme Options,semuestralainterfazdesdelaqueseconfiguraelcolordefondodelsitio,laubicacióndeloscontenidosyelcolordelosenlaces.Despuésdemodificar,pulsarenGuardar cambios.AlpulsarMenús, semuestralainterfazdeadmi-nistracióndemenúsconlosdatosparaesetema.

Sepuedepasardeuntemaaotrosimplementeactivandoelnuevotema.Estohacequesedesactiveeltemaactual.

Fig. 2.46. Opciones disponibles para el tema.

Existen multitud y variedad deplantillas y temas para todoslos gustos y preferencias.En las direcciones siguientestienes temas disponibles paradescargar.http://plantillaswordpress.org/ht tp://new wpthemes.com/demet-free-wordpress-theme/

WordPress dispone de un foroparaproponersolucionessobrelostemas.Está disponible en http:// themeid.com/forum. Tienesdisponibleunartículoquecomenta lasventajase inconve-nientesdeutilizartemasgratisenhttp://ayudawordpress.com/ temas-gratis-o-de-pago/

¿Sabías que…?

www.mcg

raw-h

ill.es


36

11.3. Instalar un tema

ElbackenddesdeApariencia > Temasdisponedeunapestañaespecíficaparalainsta-lacióndetemas.Enellasemuestrangrancantidaddeparámetrosquevanaservirdefiltrosparalocalizartemasqueseajustenanuestrasnecesidadesogustos.

EladministradorpuedeseleccionareltemamarcandosuspreferenciasopuedeaccederalapáginadetemasdeWordPressyseleccionarlodirectamentedesdeallí.Tambiénsepuedenutilizartemasmuypersonalizadosydepago.

Fig. 2.47. Opciones para filtrar el tema que se va a instalar.

Instalación y configuración de un tema

Duración estimada:30minutos Dificultad:mediaObjetivo general: instalar un nuevo tema desde http:// plantillaswordpress.org/.

Descripción:sedescargaráeltema,seinstalaráysereali-zarásuconfiguraciónbásica.

Solución

1. Descarga de un tema.EnInternetexistenmultituddesitioswebdelosquesepuedendescargartemasdeformalibreygratuita.ParaelCasopráctico,utilizare-moslaweboficial.

Enlaeleccióndeuntema,hayquetenerencuentalacom-patibilidad con la versión instalada deWordPress. Notodoslostemassepuedenutilizarentodaslasversiones.

Accederalawebhttp://plantillaswordpress.org/ yselec-cionareltemaFusion.Comoindicaladescripción,setratadeuntemadediseñoentonosclarosmuyeleganteyeficaz

conunconjuntomuyrobustodeopcionesquesueletambiénserutilizadocomoblog.Lapáginaoficialdeestetemaeshttp://digitalnature.ro/projects/fusion.

PulsarenFusion plantilla gratuita para WordPress.

Elarchivoquecontieneeltemaesfusion.zip,quesecopiaaldirectoriodelusuario.

2. Instalación del tema. Instalar un tema es tan simplecomodescomprimirel.zipycopiareldirectoriocreadoenlacarpeta/home/admin/lampstack-5.3.12-0/apps/wordpress/htdocs/wp-content/themesoextraerdirec-tamenteelzipdedichacarpeta.AliraApariencia > Temasapareceelnuevotemainstalado.Disponedelasopcionesderealizarunasimulación(Vista previa, Fig.2.48)ycomprobarcómoquedanloscontenidosexis-tentesenelsitioenelnuevotema,laopcióndeActivarparadejareltemausadopordefectoyborrareltema.

3. Configuración básica del tema.Hemosdejadoactivadoel nuevo tema (Activar Fusion) y ahora retocaremosalgunosaspectos.

Caso práctico 8

(Continúa)

www.mcg

raw-h

ill.es

37


Fig. 2.47. Opciones para filtrar el tema que se va a instalar.

(Continúa)

4. Opciones específicas del tema Fusion.Dependiendodeltema,estepuededisponerdeunconjuntodeopcionesespecíficasyconfigurables.EnelcasodeFusion,alinstalareltema,haaparecidounanuevaentradaenelmenúAparienciallamadaFusion settings.

Permiteactivarunsegundosidebar(barra lateral),modi-ficarelcolordelacabeceraobiencolocarunaimagen(900x200px)quedeterminaráeladministrador,añadirunlogoypermitirlanavegaciónporpáginasocategoríasatravésdepestañas.Dejamoslabarralateralaladerecha.PulsarenSave Changes.Existen otras pestañas con más opciones configurables.Pero,comoseindicaenlapágina,noconvienemodificarlasopcionespordefectosinosesabeloqueseestáhaciendo.5. Aumento/disminución del texto. Enlaesquinasuperior

derechaapareceelbotónAa<>,quepermiteaumentarodisminuireltamañodelaletra.Puedesermuyútil.

6. Título del sitio web. RecordarqueparacambiareltítulodelsitiowebhayqueiralosAjustes generales.

Sepuedeañadirunabrevedescripcióndelsitioqueapa-recedebajodeltítulo.Ennuestroejemplo,nohacefaltamodificareltítulo,peroeliminamoselsubtítulo.

7. Cambiar la imagen, incluida en la parte superior, por un logo personal. Parasustituirlaimagen,hayqueiralEscritorio > Apariencia > Fusion Settings.

ActivarLOGOIMAGEenYESydesdeExaminarsepuedelocalizarelnuevologo.PulsarenSubirparaincluir laimagenennuestroWord-Press.Hayquetenerencuentaqueellogosesituarápordefectoenlazonadeltítulodelsitio.Esoquieredecirquehayquecambiarlaubicacióndellogoomodificarlaubi-cacióndeltítuloparaquenosesolapen.

Porotraparte,sedebetenerencuentaquecadatemaper-miteunostamañosdiferentesdeimágenesdecabecera.Estarestricciónsepuedemodificaraccediendoalashojasdeestilocorrespondientes.Sepuedeprobarvisitandoelsitioparacomprobarelefecto,y,sinosgusta,hayqueGuardar los cambios.

8. Edición de la hoja de estilo (CSS).IraApariencia > Edi-toryenlazonadeediciónestáyadisponiblelahojadeestilodeltemaFusion.

Centrareltítulodelsitioenlazonadecabecera(header)yaumentarelespaciadoentrelasletrasdeltítulo.Modificarlosparámetros:topde85a55px(porejemplo);font-sizede3.4a5.4;letter-spacingde-0.04a-0.01em.Lodejamosdelaforma:#header h1{ font-family: “Trajan Pro”, “Lucida Sans Unicode”, Arial, Helvetica, Sans, FreeSans, Jamrul, Garuda, Kalimati; font-weight: bold; position: absolute; color: #fff; top: 55px; font-size: 5.4em; letter-spacing:-0.01em; margin: 0; padding: 0;}

Enlazonadelabarralateralajustamoslosespaciosparalasentradasyparalabarra.Pasarde66%paracontenidoa75%.Pasarde34%paralabarralaterala25%Ajustardesdelaizquierdaun75%(estabaa66%).

Caso práctico 8

(Continuación)

Fig. 2.48. Vista previa del nuevo tema instalado (Fusion).

www.mcg

raw-h

ill.es


38

Lahojadeestiloenesazonaladejamosasí:/* if sidebar exists... */#page.with-sidebar #main-wrap #mid-wrap { right:0%; /* width of the 2nd column, 0 because it doesnt exist */ }#page.with-sidebar #main-wrap #side-wrap { right:66%; /* width of the main column */ }#page.with-sidebar #main-wrap #mid { width:75%; /* width of main column */ left:75%; /* same */}#page.with-sidebar #main-wrap #sidebar { width:25%; /* width of the sidebar */

left:75%;}

Enelcuerpo(body)cambiamoseltipodeletrayaumen-tamossutamaño.Comprobamosquenoapareceentradafont-sizenifont-family.Lasañadimos,quedandoasí:/* post body */.post .postbody, .attachment .postbody{ font-family: “Tahoma”, Arial, Helvetica; clear: left; font-size: 14px; display: block;}

Elnuevoaspectodelsitioeselsiguiente:

Caso práctico 8

(Continuación)

Trabajar con menús en Fusion.Eltemaelegidonodisponedemenúpordefecto,perosepuedeutilizarelwidget«Menúspersonalizados»paraañadirelmenúquesecreóenelEpígrafe7alabarralateraldeltema.IraApariencia > WidgetsylocalizarMenús personalizados.PulsarenAñadir.AbreunaventanaenlaquedamosuntítuloalmenúyloasociamosalmenúAWEBquetenemosdefinido.Observarquesepuedemodificarsuposición(altura)dentrodelabarralateral.Eliminamoslasentradasdesubmenúquecreamos:ReflexionesyDocumentación.EstaacciónsepuederealizardesdeelEditortrabajandosobreelarchivosidebar.php(barralateral).Tambiénsepuedehaceraccediendoalmenúdefinidoyelimi-nandoestasentradas.Noestrivialelcódigoafectadoporestaeliminación,loquerecomiendahacerlodirectamentesobreelmenúAWEB.9. Utilización de widgets en Fusion.Delabarralateraltambiénqueremoseliminar

laentradadecategorías.Hayquetenerencuentaquemostrarlascategoríasenlabarralateralesdebidoaqueestáactivadoelwidgetdecategorías.IraApariencia > Widgets;localizarenlabarralaterallasopcionesCategorías, Editar yBorrar.

AñadirelwidgetCalendarioyNubedeetiquetasenelpiedelsitio.EliminarlapáginadeejemploenelmenúEscritorio > Páginas.Modificarel títulode lapáginadebienvenidayeliminar laopcióndeañadircomentariosenestapágina.Redimensionar(criteriopersonal)labarralateralsegúnlasinstruccionesdelpunto8.

Fig. 2.49. Aspecto del sitio AulaWEB.

Fig. 2.50. Menú personalizado.

Fig. 2.51. Ubicación del widget Calendario.

www.mcg

raw-h

ill.es

39


12. Gestión de pluginsEnelEpígrafe11sehaexplicadocómolautilizacióndelostemaspermitepersonalizareldiseñoyelaspectodelsitioweb.LospluginsdeWordPresspermitenpersonalizaryampliarlafuncionalidaddetodoelsitioparaadaptarloalasnecesidadesdelusuario.Unpluginesunconjuntodearchivosqueseinstalanenelsitioyqueamplíanlafun-cionalidadmásalládelaqueseobtienemediantelainstalaciónbásicadeWordPress.EnelprocesodeinstalaciónseinstalanalgunospluginsbásicosquesepuedenverenelEscritorioenlapestañaPlugins > Plugins instalados.DeellossecomentaAkismetporsuimportancia,perohayotrospluginspordefectomuyinteresantesycuyaactivaciónconvieneconsiderar.Akismetcontrolaelposiblespamquepuedallegaralsitioatravésdeloscomentarios.Esimportantetenerloactivado(pordefectonoloestá).ParaactivarAkismet,ademásdeseleccionarloypulsarenActivar,hayqueobtenerenhttp://akismet.com/get unaAPI key parafirmarlo.

Existeunaopcióngratuitaparasitiospersonales.Laclaveesenviadaaladireccióndecorreoelectrónicosuministrada.Terminadoelproceso,alvolveranuestrositio,compro-bamosquetodohaidobien.Enesemomento,senospidelaclave.

API key. Esuncódigogeneradopor los sitios web que permitea los usuarios acceder a suinterfaz de programación deaplicaciones.Seutilizapararealizarunsegui-miento de la API con el fin decontrolar el uso del servicio.En general, actúa como iden-tificador único para la autenti-cación, y proporciona ciertosderechos de acceso a la APIasociadaaella.

Vocabulario

Fig. 2.52. Configuración de Akismet.

www.mcg

raw-h

ill.es


40

MarcarlasopcionesquesenecesitenypulsarenActualizar opciones.Tambiénpermi-tecomprobarlaconectividaddelaredyasíconocersielaccesoalosservidoresdeAkismetescorrecto.

Enestemomentopodemosverificarqueelsistemanosavisadelaexistenciadeunaactualización(Fig.2.53)ynosofreceprogramarlaactualizaciónautomática.Estaesunaventajadelosplugins,queavisandenuevasversionesypermitenlaactualizacióndirecta(Fig.2.54).

12.1. Añadir plugins

LacomunidaddedesarrolladoresdeWordPressesmuyampliaycontinuamenteestánapareciendonuevosplugins.Elrepositoriooficialdepluginseshttp://wordpress.org/extend/plugins. Esconveniente,alahoradeañadirplugins,irasitiosdeconfianzaquegaranticenuncontroldecalidadsobreellos.

Notodoslospluginssehandesarrolladodeigualforma.Poresemotivo,esimportanteleercuidadosamentelasinstruccionesdeinstalaciónporsisehaañadidoalgúndetallequesedebatenerencuenta.

EsposiblequealdescargarunpluginnosavisedequelaversióndeWordPressnoso-portalaversióndepluginadescargar(einclusoelpropioplugin).Peronoesdefinitivo.Enesecasosedebeirconcuidadoyprobarantesdeponerenproducción.

ElCasopráctico9muestracómodescargarunpluginanuestrositio,activarloyutilizar-lo.Seleccionaremoselpluginmultiidioma.

Fig. 2.53. Aviso de actualización del plugin.

Fig. 2.54. Actualización del plugin Akismet.

Puedes conocer las estadísticasdelaspersonasquehanvisitadotusitiowebutilizandoplugins.Por ejemplo, el plugin PopStatstieneestafunción,yadiferenciadeotrasopciones,comoGoogleAnalytics o StatCounter, el plu-ginguardalosdatosenlabasededatosdeWordPress.

¿Sabías que…?

35. ConfiguraelcomponenteWordPress WP-Polls quepermiterealizarencuestas.

Actividades

www.mcg

raw-h

ill.es

41


Instalación del plugin multiidioma Duración estimada:20minutos Dificultad:mediaObjetivo general:descargar,instalaryutilizarelpluginmul-tiidiomaenelsitiowebAulaWEB.Solución1. Descripción del plugin qTranslate. Permitemostrar el

sitiocompletoenvariosidiomasylosvisitantespuedenescogerelidiomaqueprefieran.Actúasobrelasentra-das,laspáginas,lasetiquetasylascategorías.

Enprincipio,vienedefinidoparainglés, alemán y chino,perosepuedenquitaryañadiridiomassegúnlasnecesida-des.Loquenohaceestraducirlasentradas.Escapazdedetectarlaspreferenciasdeidiomaapartirdelaspreferenciasdelnavegadorwebydelascookies.

Además,notocaelesquemadebasededatosdeWord-Press.

2. Descarga e instalación del plugin qTranslate.Estandoenhttp://wordpress.org/extend/plugins/qtranslate/, pulsarenDownloadyguardarel.zipenunacarpeta.

Descomprimirel .zipycopiar lacarpetacreadaenwp-content/plugins/.EnunainstalaciónUbuntuelcaminocom-pletoes:

~/lampstack-5.3.14-0/apps/wordpress/htdocs/wp-content/plugins

IralEscritorioyenPlugins > Plugins instalados vemosqueapareceelnuevopluginqueahoraactivamos.

Porúltimo,Activar (alpiedelapágina)loscambioshechosenlapáginadeplugins.

Caso práctico 9

(Continúa)

Fig. 2.55. Plugin qTranslate activado.

Fig. 2.56. Administración del plugin qTranslate. Fig. 2.57. Widget selector de idioma.

3. Opciones del plugin qTranslate. Estandoenlapáginadeplugins,enlazonadedescripcióndelpropioplugin,pulsarenConfiguración (Settings).

Activar(Enable)elespañol,dejarlopordefectoydeshabilitaralemánychino.Úni-camenteapareceránlosidiomasespañoleinglés.

DejaractivadalaopciónDetectar el Idioma del Navegador Webparaque,cuandosevisitalapáginaprincipalatravésdeunmarcador,elvisitantesearemitidoaladirecciónURLcorrectaparaelidiomaespecificadoporsunavegador.

Siseañadeunnuevoidiomaquenoestáenlalista,habráquefacilitarlosdatosdelmismo(código,nombre…)ypulsarenAñadir lenguaje.

Existenopcionesavanzadasdeconfiguraciónyposibilidaddeactivarlosserviciosdelplugin.EntreestasopcionesestálaactualizaciónautomáticadelabasededatosdeGettext, asícomolaopcióndecambiarlabanderaasociadaalidioma,restaurarlasopcionespordefectodeqTranslate,etc.

Gettext.Eslabibliotecadeinter-nacionalización y localizaciónGNU (i18n). Suele ser utilizadaenprogramas con soportemul-tilingüe.

Vocabulario

www.mcg

raw-h

ill.es


42

Porúltimo,existelaopcióndeactivarlosserviciosdetraducciónenlíneadeqTrans-late.Paraello,entrarenConfiguración de servicios de qTranslateyactivarestaopción.PulsarenGuardar cambios.

4. Activación del widget qTranslate.Paravisualizarelselectordeidioma,sehadeactivarelwidgetasociadoalpluginqTranslate.IraWidgetsylocalizarelcorrespondienteaqTranslate.PulsarenActivar.

Acontinuación,semuestralapantalladeconfiguracióndelwidgetenlaquepode-mosdecidirdóndesevisualizaráelselectordeidioma,leasignamosuntítuloylomostraráenelsitio.LaFigura2.59muestralainterfazdeconfiguración.

5. Creación de una nueva entrada.Creamosunaentradaparacomprobarelfun-cionamientodelpluginqTranslate.Eneleditoraparecendospestañas,unaparacastellanoyotraparainglés,queesdondeescribiremoslatraducción.Haydoscamposparaeltítulo,unoporidioma.

Despuésdeintroducireltextoyasociarlaentradaaunacategoríaopáginayalaetiqueta«Pruebas»,pulsarenPublicar.Elsitiowebahoratieneesteaspecto(Fig.2.60).

SisepulsaenEnglish,mostrará laúnicaentradagenerada tambiénen inglés.Vemosqueelcambiodeidiomahaquedadodemasiadoabajoenlabarralateral.Cambiamossuubicaciónmodificandoelvalordeposicionamientoasignado.

Paraello,iraApariencia > Widgets > Default Sidebar,selec-cionarlacajadeqTranslateyarrastrarlahastalaposiciónquesedesee.

6. Traducción de contenido.Apartirdeahora,cuandosecreeunanuevaentrada,oeditandolasyacreadas,sepodrárealizarlatraducciónalosidiomasconfigurados.Habráqueirtraduciendoalinglésprogresivamentelasentradaspreviamentecreadasy,desdeesemomento,publicarparacadaartículoambasversiones,laoriginal(supuestamenteenespañol)ylatraducciónalinglés.qTranslatedisponedeserviciosdetraducciónenlínea,peronofuncionanentodoslossistemasoperativosyversiones.Eltextosetra-ducedetectandodeformaautomáticaelidioma.

Caso práctico 9

(Continuación)

Amenudo,sepresentanproble-masdecambiodepermisosenlos archivos que componen laplantilla.Si se sube la plantilla vía FTPy se selecciona vía Gestorde plantillas, el administradorpodrádisponerdepermisosdeescritura sobre archivos e imá-genesqueno tendrási lohacecomoextensión.

Claves y consejos

Fig. 2.58. Creación de una entrada multiidioma.

Fig. 2.59. Opciones del widget qTranslate.

Fig. 2.60. Mostrando el widget y la entrada multiidioma.

www.mcg

raw-h

ill.es

43


Instalación del plugin Captcha


Objetivo general:descargar,instalaryutilizarelpluginCaptchaenelsitiowebAulaWEB.

Solución

1. Descripción del plugin Captcha.Captcha(CompletelyAutomatedPublicTuringtesttotellComputersandHumansApart,PruebadeTuringpúblicayautomá-ticaparadiferenciarmáquinasyhumanos)esunapruebaparadeterminarcuándoelaccesolorealizaunapersonaounspam-bot.Constadeunaseriedecaracteresdistorsionadosconunfondoqueimpidealosspam-botsureco-nocimiento.

2. Instalación y configuración. IraApariencia > Plugins > Añadir nuevo yenBus-car escribirlapalabra«captcha».Localizaelpluginylomuestraparainstalar.

PulsarenInstalar ahora.Pideconfirmaciónycomienzaladescargadelplugin.Pul-sarenActivar el pluginypasaralaConfiguración,dondedejamoslasopcionespordefecto.

Estepluginnotienewidgetasociado,yaquesevisualizaeneliniciodesesióndeusuario,perodisponedeunaentradaenlabarralateraldentrodeBWS Plugins. Estaentradapermiteestablecerlaoperaciónquesedeberealizaralregistrarseelusuarioenelportal.

3. Uso de Captcha.Cuandounusuarioregistradoaccede al sitio, al conectarse le pedirá queresuelvaelcaptcha(Fig.2.62).Simplementehayqueintroducirlasoluciónalacuestiónpropuestayentrar.Elusodeeste tipodepluginsesmuyútilparaevitarlainclusióndecomentariosalasentradasque,enrealidad,sonspam.

4. Otros plugins similares.WP-HashcashExtendedesuncaptchadisponibleenWordPress,quefun-cionadeformainversa,yaque,envezdereali-zaralusuariountestdereconocimientodecarac-teres,preguntaalnavegadorsirealmenteesunnavegadormanejadoporunapersonaynounspam-bot.ElservidorgeneraunaclavequesolopuedeserdecodificadaporunnavegadorconJavascript.Estaesenviadadeformaocultaenelformulariodelcomentarioychequeadaenelser-vidor.Sinocoincide,serechazaelcomentario.

Fig. 2.61. Plugin Captcha.

Fig. 2.63. Opciones del plugin Captcha.

Caso práctico 10

Spam-bot. Son robots (bots)automáticos utilizados paraincluir spamenportales,blogs,wikis,etc.Trackback. Es uno de los trestipos de linkbacks y una formadenotificaraunsitiowebcuán-do sepublica una entradaquelereferencia.Pingback. Es un sistema auto-mático de referencias cruzadasentreblogs.Cuandosehaceuncomentarioenunblogsobreuntema publicado en otro blog,Pingback se utiliza para per-mitir que el blog enlace con elcomentarioensublog.

Vocabulario

Fig. 2.62. Mostrando Captcha.

www.mcg

raw-h

ill.es


44

13. SindicaciónEngeneral,lasindicacióndecontenidospermitequelosvisitantesdelportalsesuscri-banalasnoticiasqueconsiderendeinterés.WordPressadmitelasespecificacionesRSS1.0(RDF),RSS2.0yATOM.Cadapáginatieneun feedasociadoalque los lectorespueden suscribirse.Hayun feedpara losúltimosmensajespublicados,porcategorías,comentarios,etc.AladmitirRSS2.0conmarcasparaarchivos,permiteagregararchivosMP3(tipopodcast)deformasencilla.Un‘feed’sedefinecomounpaquetequecontieneinformaciónparaserdistribuidadeformasencilla.Porejemplo,muchossitioswebofrecenunfeedconunresumendelasúltimasnoticiaspublicadas.Estos feedspueden serdistribuidos haciendo usode tecnologías comoRSSoAtom,ambasbasadasenXMLyadmitidasporWordPress.Sindicareselprocesoquepermitealosusuariosaccederalcontenidodelosfeeds.Peronolohacendirectamente,sinoqueutilizanlosllamadoslectoresdefeedsoagregadores.EnelcasodeWordPress,nohacefaltainstalaragregadores.TieneunmecanismomuysencilloparamanteneryorganizarlalistadesuscripcionesaRSSdelamismaformaque lohacen losagregadores.Consiste, simplemente,enañadir/feedal finalde laURLdelsitioweb.Ennuestrocasoseríahttp://localhost:8080/wordpress/feed. Deestaformapermitimosalosvisitantesquenossindiquen.

Porotraparte,WordPressdisponedeunwidgetRSSquesepuedeañadiralazonaquesedeseeyensuconfiguraciónseestableceaquiénqueremossindicar,esdecir,dequéURLqueremostenernoticiasennuestrositioycuántasnoticiassevanaver.

Activación del widget RSS como cliente


Objetivo general:activarelwidgetRSSdisponibleparalasindicacióndenoticiasexternasennuestrositio.Actúacomoclientedesindicación.

Solución

1. Selección del widgetIraApariencia > WidgetylocalizarRSS.

AladerechasemuestralaestructuradeWordPressyloscomponentesquepuedenalojaralwidget.

SeleccionarelwidgetypulsarenAñadir.Seabrelainter-fazdeconfiguracióndelwidget.

2. Configuración del widgetIntroducirlaURLquesehadesindicar.Porejemplo,elpor-taldelMinisteriodeEducaciónhttp://www.educacion.gob.es/yunanoticiaquesequieravisualizar.

Sehaseleccionadolazonadelpiedelsitio(Footer)paramostrarlo.

ExisteunnuevosistemadesindicaciónRSSenWordPresslla-madoRSSCloud.Esteplugin(http://wordpress.org/extend/plugins/rsscloud/) tienelapropiedaddenotificarlasactuali-zacionesquesehacenenelsitiodeformainstantánea.

Caso práctico 11

Fig. 2.64. Parámetros de sindicación.

Fig. 2.65. Widget de sindicación.

36. ¿Qué ventajas ofrece lasindicación de conteni-dos?Describealgunasdeellas.

Actividades

www.mcg

raw-h

ill.es

45


14. WordPress como blog‘Blog’obitácoraesundiarioopáginavirtualexpuestaenInternet,defácilcreación,usoyactualización.Administrarunblogestansencillocomousarelcorreoelectrónico.Elblogpuedeserpúblicooprivado,permitircomentariosaloscontenidosquepublicaelautorono.Elusuariodecidelascaracterísticasdesublog.Lomássignificativodeunblogesqueparautilizarlonoserequierengrandesconoci-mientosinformáticos.Loúnicoquesenecesitaestenerinquietudportransmitiroexpre-saralgoyprácticaparahacerlo.YWordPress,comoyasehavisto,proporcionaestasfacilidades,tantocomoCMScompletocomoblog.CualquierusuarioquedeseedisponerdeunblogenWordPresspuedeaccederahttp://es.wordpress.com ysolicitaralojamientogratuito.Lospasosquesedebendarparahacerunblogenunhostingsonlossiguientes:1.Comprarelhosting(hacerloconcriteriosSEO),esdecir,tenerencuentaloqueprima

openalizaGooglealahoradeabrirunsitioweb.Porejemplo,Googleprimaposi-tivamenteque,silawebestáenfocadaaEspaña,tengaelservidorenEspaña(IPs,velocidades,etc.).

2.Comprarundominio(sepuedehaceraparteoatravésdelmismoserviciodehosting).3.AsignarlasDNSaldominiodelservidor.4.Cuandoyaseestáenlacarpetapropiadelservidor,subirlosarchivosdescomprimi-

dosdeWP.5.Enlabarradenavegación,ejecutarelinstalador.

Activación del widget RSS como servidor Duración estimada:5minutos Dificultad:mediaObjetivo general:activarelserviciodesindicacióndenues-trositiowebparaqueotrossitiosobtengannuestrasnoti-cias.Actúacomoservidordefeed.Solución

Acceder a la lista de suscripciones de nuestro sitioMétodo 1Elusuarioquevisitanuestrositiooblogdebeirahttp://localhost:8080/wordpress/feed yenlaventanamostradaseleccionarelcanalalqueleinteresesuscribirse.

Fig. 2.66. Acción de sindicar.

Ennuestrocaso,muestraelnombredenuestrositio,AulaWEB.

Los visitantes del portal pueden optar por suscribirse anuestrocanaldenoticiasutilizandomarcadoresdinámicosomedianteaplicación.

Elusuariopuedeelegirentrecolocarestasuscripciónen: laBarra de herramientas de marcadores, elmenú

Marcadores, losMarcadores sin clasificar oelegirunacarpeta.SidejamosBarra de herramientas de marcadores, secrearáenlabarradeherramientasdemarcadoresdelnavegadorunanuevaentradaconelnombrequelehayamosasignado.SeleccionamosMenú marcadores,y,alpulsarSuscribirseenelnavegadorwebenMarcadores,sehaañadidounaentradallamadaAulaWEB.AccediendoaestaentradadelmenúMarcadores,elusua-rioaccederáanuestrositioweb.Método 2Hayquetenerencuentaquelavisualizacióndelaccesoalasindicacióndependerádeladistribuciónquehagacadaplantilladelaszonasdelportal.Ennuestrocaso,yconeltemainstalado,aparecendosentra-dasrelacionadasconlasindicaciónquemuestralaFigura2.67.

Fig. 2.67. Entradas RSS.

AlpulsarenRSS de las entradas,seestaríansindicandolasentradasdenuestrositioysevuelveamostrarlamismaventanadelaFigura2.66.Sepuedeseguirelmismoproce-dimiento.AlpulsarenRSSdeloscomentarios,seestaríansindicandoloscomentariosdenuestrositio.

Caso práctico 12

Blogosfera. Es el conjunto demillonesdeblogspublicadosenInternet que abarcan todas lasesferas de la vida: economía,política, arte, ciencia, tecnolo-gía,sanidad,educación...Detrásdecadabloghayunapersonaogrupodepersonasconinquietu-desquedeseancompartirconelrestodeinternautas.

Vocabulario

En http://ayudawordpress.com/ videotutorial-crear-un-blog-en-wordpresscom/, hay dis-ponible un vídeo-tutorial queexplica cómo crear un blog enWordPress.com.

Web

www.mcg

raw-h

ill.es


46

15. Copia y restauración del portal Unadelastareasdeadministraciónmásimportantesesrealizarcopiasdeseguridaddelportal.Esposibleque,antealgunacircunstanciaimprevisible,setengaquerealizarlarestauracióndedichacopiaparaasípoderrecuperartodalainformaciónalmacena-daenelportal.

UnsitiowebrealizadoconWordPressconstade:

1.NúcleodelainstalacióndeWordPress.2.Plugins.3.Temas.4.Imágenesyarchivos.5.Javascripts,scriptsenPHPyotrosarchivosdecódigo.6.Archivosadicionalesypáginaswebestáticas.

RealizarunacopiadeseguridadcompletadelsitioconsisteencopiarlabasededatosdeWordPressylosarchivos.Labasededatoscontienelasentradasyotrosdatosquesehanidogenerandoconeltiempo,peronoalbergaloselementosqueconfiguranelaspectodelsitio.

Pararealizarlacopiadelabasededatos,utilizamoslaherramientaphpMyAdminins-taladajuntoconelpaquetebitnamiLAMP.

Accederalaherramientabiendirectamente(http://localhost:8080/phpmyadmin/) site-nemoselgestordecontenidosinstaladoenlocalobienatravésdelcPanelsisetratadeunblogounsitioalojadoenunservidorexterno.

Entrarcomorootcon lacontraseñaasignadaenelprocesodeinstalaciónde lapilabitnami.

BuscarlabasededatosdeWordPressyseleccionartodaslastablas.Iralalistadespe-gableyseleccionarlaopciónExportar.

Elmétododeexportaciónpuedeserrápidoopersonalizado,dependiendodelasopcio-nesquesequieranconfigurar.AlseleccionarPersonalizado,sedesplieganmásabajotodaslasopcionesdisponibles.

Fig. 2.68. Conexión a phpMyAdmin.

Fig. 2.69. Tablas de WordPress.

www.mcg

raw-h

ill.es

47


EnTablas, pulsarenSeleccionar todo.DejaractivadalaopciónGuardar salida a un archivo.DejarcomoformatoSQL,volcadodetabladeestructuraydatos,y,enlasop-cionesdecreacióndeobjetos,mantenerlasopcionesqueindicalaFigura2.71.

PulsarenContinuar.Aparecelaventanadedescargadelatablagenerada(Fig.2.72).Laguardamos(oabrimossitenemoscuriosidadporversucon-tenido)enunacarpetaexclusivaparaalmacenarcopiasdeseguridaddelabasededatosdeWordPress.Convieneañadiralnombredelatablalafechadeldíaenqueserealizalacopia.

Lafasecomplementariaalaexportacióndelabasededatosserálaimpor-taciónpararestaurarlacopiadeseguridad.

Paraello,irdenuevoaphpMyAdmin.Seleccionarlabasededatosgenera-daconlaexportación.IralapestañaImportar.Localizarelarchivogenera-doenlaexportaciónanterioryseleccionarlo.

Fig. 2.70. Exportación de las tablas de WordPress.

Fig. 2.71. Opciones de creación de objetos.

Fig. 2.72. Copia de seguridad de WordPress.

www.mcg

raw-h

ill.es


48

Copia y restauración de WordPress con Updraft


Objetivo general:instalar,configuraryactivarelpluginUpdraftparalarealizacióndecopiasdeseguridadysurestau-ración.

Solución

1. Localizar e instalar el plugin Updraft.EnelescritorioiraPlugins > Añadir nuevo.Indicarelnombre«updraft»paralabúsquedadelplugin.

Pulsaren Instalar ahora.Unavezinstalado,Activarelplugin,comprobamosquenodisponedeinterfazdeconfiguraciónyquenosehainstaladoningúnwidgetasociado.Sinembargo,enAjustes haaparecidounanuevaentradaparaesteplugin.

2. Utilización de Updraft.LapantalladeAjustes paraUpdrafteslaquepermiterealizarlascopiasdeseguridad.

Caso práctico 13

DejarlasopcionespordefectoypulsarenContinuar.Terminalaimportaciónycomuni-calaejecuciónconéxito.

Ademásdeesteprocedimiento,enWordPresssepuedeutilizarunpluginquepermiterealizarlacopiaysurestauracióndeformamuysencilla.ElpluginesUpdraft.

Fig. 2.73. Importación de la copia de seguridad de WordPress.

Fig. 2.75. Entrada de Updraft.(Continúa)

Fig. 2.74. Instalación de Updraft.

www.mcg

raw-h

ill.es

49


Fig. 2.77. Fase de restauración.

LaFigura2.76muestralasopcionesdisponiblesparadefinirlacopia.Aparecelafechayhoradelsistema,lacarpetaenlaquesealmacenará,laopcióndeenviaruncorreoelectrónicocuandohayaterminado,entreotras.

Comosepuedeobservar,todavíanoseharealizadoningunacopiadeseguridad.

PulsarenSave changesyBackup Now!

Comprobamosqueeneldirectorioindicado(~/lampstack-5.3.12-0/apps/wordpress/htdocs/wp-content/updraft)hanaparecidolassiguientesreferencias:

backup_2012-06-11-2115_AulaWEB_2b689788dd20-db.gz

backup_2012-06-11-2115_AulaWEB_2b689788dd20-plugins.zip

backup_2012-06-11-2115_AulaWEB_2b689788dd20-themes.zip

backup_2012-06-11-2115_AulaWEB_2b689788dd20-uploads.zip

index.html

3. Restauración de la copia de seguridadVolvemosalainterfazdeUpdraftyahorapulsamosenRestore.Muestraunalistadesplegabledesdelaqueseleccionamoslacopiaquedebemosrestaurarypulsa-mosenRestore Now!

Comienzalarestauracióny laFigura2.77muestra lasecuenciademensajesenviados.

Caso práctico 13

(Continuación)

Fig. 2.76. Copia de seguridad con Updraft.

www.mcg

raw-h

ill.es


50

16. Actualización de WordPressLaactualizacióndel portal es unade las tareas críticasque requieren unaatenciónespecialporpartedeladministrador.Convienetenerelportalsiempreactualizadoasuúltimaversión,almenosencuantoaactualizacionesdeseguridadserefiere.Deestaforma,ademásdeincorporarlasúltimasnovedades,seprotegeráelportaldecualquieragujerodetectadoysolucionadoporlacomunidadWordPress.

Loprimeroquesehadeconocereslaversiónactualdequesedispone.Paraello,iralEscritorio > Actualizar.Avisadesiexistealgunaversiónposterior.

Ennuestrocaso,indicaqueestáinstaladalaúltimaversiónencastellano.

Observarquetambiénavisadeactualizacionesdepluginsynosdalaopcióndeactua-lizarlostodososeleccionarlosqueinteresen.

Siloquesequiereeshacerunaactualizaciónmanualdeunsitioweb,lospasosquesedebenseguirsonlossiguientes:

• Realizarunacopiadeseguridaddelosdatosdelacarpeta/wp-content.

• RealizarunacopiadeseguridaddelabasededatosconphpMyAdmino Updraft.

• Desactivarlospluginshabilitados.

• DescargarlaúltimaversióndeWordPressenespañol.

• Descomprimiren localyeliminar lacarpeta/wp-content;utilizarnuestracopiadeestacarpeta.

• Accederdesdeelnavegadorwebawww.nombredominio/wp-admin/upgrade.php.

• Actualizar.

• Volveraconectarseyactivardenuevolosplugins.

• Comprobarquetodoescorrecto.

Enelcasodetratarsedeunblog,hayquevolveracomprimirlaversióndescargadadeWordPressañadiendonuestracarpetawp-content.

Luego,habráquesubirelarchivo.zipalacarpetaquecontenganuestroblogydes-comprimirloenella.

Accederdesdeelnavegadorwebawww.nombredominio/wp-admin/upgrade.php ycontinuarcomoenelprocesoanterior.

Otraopcióndeactualización se llevaríaacaboconelpluginWordPressAutomaticUpgrade(http://ayudawordpress.com/actualizar-wordpress-con-un-plugin/).

Backlinks. Enlacesexternosquerecibe una web desde otraspáginas.Elnúmerodebacklinksdetermina la cantidad de pági-nasque laenlazana travésdeunvínculo.Estenúmeroesimportanteparaelposicionamientoenbuscado-res. Una web es más popularcuantos más enlaces entrantestenga.

Vocabulario

AntesdeactualizarelCMS,esconveniente realizar una copiadeseguridaddelmismo.

Importante

Fig. 2.78. Información de la actualización. Nueva versión.

www.mcg

raw-h

ill.es

51


17. SEO y seguridad en WordpressSEO (del inglés Search EngineOptimization, optimización para losmotores de bús-queda) es un conjunto de técnicas y tácticas que tienen como objetivo aumentar lavisibilidaddeunapáginaositiowebparalosmotoresdebúsqueda,mejorandoasísuposiciónenlosresultadosofrecidos.Estamejoraenlaposiciónestárelacionadaconelnúmerodevisitas,imágenesinclui-das,vídeos,usodepalabrasclaveenloscontenidos,etc.Dentrodelasestrategiasdeposicionamientoestá,enprimerlugar,labúsquedadepa-labrasclaverelacionadasconlosserviciosofrecidosenelsitio.Acontinuación,sedeberíaninstalarciertospluginsdeWordPressqueayudaranaopti-mizarelsitioweby,enconsecuencia,suposicionamiento.Lospluginsmássignificativosson:•All in One Seo Pack:permiteoptimizartodaslaspáginasparalosmotoresdebúsque-

da,perorequiererellenarloscamposdecadapáginaoentradadelsitio.• Simple Google Sitemap XML:generaautomáticamenteunapáginasitemap.xmldon-

deseindicanlaspáginasdelsitiowebquesonmásimportantesyquesepuedenenviaraGoogleenlasherramientasdelwebmasterparadecirlequelasindexe.

•WordPress Gzip Compression:esunpluginconelqueseganavelocidadderespuestaydescargadelsitioweb.Estedetalleesmuyimportanteparaelposicionamientoyparalosvisitantesdelsitio.

17.1. Recomendaciones de seguridadAlgunasnormasbásicasquecontribuiránalaseguridaddelsitiosonlassiguientes:•Mantenerelsitioactualizadoconversionesquenotenganbugsdeseguridad.Mejor

sisonversionesestables.• Utilizarcontraseñasseguras,comocombinacióndeletras,dígitosycaracteresespe-

cialespermitidos.• Intentarnoutilizarelnombreadmincomoadministrador.Cambiarelnombre.• Eliminartodoaquelloqueseinstalóenunmomentodeterminado,peroqueyanose

utiliza,comotemas,plugins,etc.• Utilizarenelarchivorobots.txtlasentenciaDisallow: / wp-*paraimpedirque

losrobotsescaneenlosarchivos.•Modificarlospermisosdelarchivoconfig.phpa640(lecturayescrituraparaeldueño

delarchivo,lecturaparaelgrupoynadaparaelrestodeusuarios).•Noutilizartemasopluginsmanipulados,yaquepuedenllevarcódigomaliciosoo

abrirpuertastraserasapotencialesatacantes.• RealizarconfrecuenciaunacopiadeseguridaddelsitioWordPressutilizandolosplu-

ginsadecuadosocontratandounserviciodehostingquerealicebackupsperiódicosdelservidordondeestáalojadoelsitio.

• Utilizarconexionessegurasenlaspáginasdeadministración.• Lospermisossobrelascarpetasyarchivosdebenserdesololectura.• Cambiarelusuarioadmin,yaque,alserconocidounposibleintruso,tieneyalami-

taddelcaminorecorrido,ahorasolonecesitaráadivinarlacontraseña.•NomostrarlaversióndeWordpress.Estopuederealizarseañadiendolosiguienteen

elarchivofunctions.php:

function hide _ vp _ vers(){ return “; }add _ filter(‘the _ generator’,’hide _ vp _ vers’);

37. ¿CómoprotegeríastusitiowebWordPress?

Actividades

Metadatos. Información sobrelosdatosdelsitioweb.Esimpor-tante definirlos para que losmotores de búsqueda puedanlocalizarelportal.SEO. Proceso de optimizacióndeunsitioqueconsisteenapli-car diversas técnicas para quelosbuscadoresdeInternetsitúenel portal basado enWordPressen lasprimerasposicionesden-trodesuspáginasderesultadosen funciónde términos y frasesclave.

Vocabulario

Enhttp://www.adseok.com/seo-para-wordpress/ tienes disponi-ble abundante información consugerenciasytrucosparahacermásvisibletusitioweb.

Web

Si el sitio web o blog no esnuevo, no conviene cambiar laestructuradelospermalinks.Solo es recomendable parasitiosnuevos.

Importante

www.mcg

raw-h

ill.es

Sistemasgestoresdecontenidos2

52

SíntesisCMS - WordPress

Elementosencuantoalaspectoy/ofuncionalidadPlantillasotemas

Extensiones:plugins

WordPress:Definiciónycaracterísticas

EsunCMSdinámicoquepermitelacreacióndesitioswebparalapublicacióndenoticias,difusióndeinformación,portalescorporativos,sitioswebparacomercioelectrónico,etc.

• Gestióncompletavíawebdeformasencilla.• Organizacióndelosartículos(entradas,post)ypáginasestáticasdelsitiowebmediantecategorías,

subcategoríasyetiquetas.• CreaciónyedicióndecontenidosutilizandouneditorWYSIWYG.• Disponibilidaddegranvariedaddeplantillasotemas(themes)descargables.• Utilizacióndewidgetsypluginsqueamplíanlafuncionalidaddelsitio.• ServidordesindicacióndenoticiasporRDF(RSS1.0),RSS2.0yAtom.• Permiteinsertarpublicidadenelsitio.• Permitelapublicaciónmediantee-mail.• PermitelabúsquedaintegradaGoogle.• Apartirdelaversión3,esmultisite(permiteconfigurarmúltiplessitios).

EstructuraURL Permalink Esunenlacepermanente.Utilizadoensitiosweb,gestoresdecontenidosoblogsparaasignarunaURLpermanenteacadaentradadelsitioyasíluegopoderreferenciarla.

UsuariosdeWordPress

1.Usuariosdeladministrador(backend):puedenaccederalaadministracióndelportal.2.Usuariosdelsitio(frontend):puedenaccederadeterminadasseccionesdelapartepública.

Extensiones

Sonaplicacionesqueañadenfuncionalidad.Convieneinstalaraquellasimprescindiblesparaelportal.

Temasoplantillas:sonlamaneraenqueWordPressmuestrasuscomponentesenelsitiowebysuaspecto,permitiendopersonalizareldiseñodelCMS.

Plugin:pequeñoprogramaquepermiteintegrarotroscontenidosenelcuerpodelartículo,comocontroles.

Sindicación Permitequelosvisitantesdelportalsesuscribanalasnoticiasqueconsiderendeinterés.WordPressmantieneyorganizalalistadesuscripcionesaRSSdelamismaformaquelohacenlosagregadores.

EstructuradeWordPress

Frontend:partepúblicadelCMS

Organizadoenzonasosecciones.CadaunadeellastieneunnombreasignadoyunprogramaenPHPquelagestiona.

Backend:paneldeadministracióndelCMS

Partenopúblicadelportalaccesiblesoloparadeterminadosperfilesdeusuario.WordPresslollamaEscritorio.

Organizacióndecontenidos

Páginas

Postoentradas

Multimedia

Enlaces

Soncontenidosdecarácterestáticoquenoseactualizanenlaportada,sinoqueofreceninformaciónpermanentealaquesepuedeaccedermediantemenúsdenavegación.

Soncontenidosdecarácterdinámico,tiponoticiasytemasnuevos,quesesitúanalcomienzodelaportadadelsitioenordencronológico.

Escontenidonotextualcomofotografías,sonidos,vídeos,etc.,incluidosenlasentradas.

SonlistasdeenlacesaotrossitioswebyquesegestionandesdeEscritorio > Enlaces. Losenlacessepuedenorganizarporcategorías.

Gestióndecontenidos

Estáticos(páginas):norequierenorganización.

Dinámicos(posts/entradas):asociadosacategoríasysubcategorías.

Widgets ProgramaominiaplicaciónejecutadoporunmotoroWidgetEngine.Facilitaelaccesoafuncionesfrecuentesyqueafectanalainformaciónvisualdelsitio.

Gestióndemenús

Puedecontener Categorías.Páginas.Enlacespersonalizados.

Vanasociadosalostemas.www.m

cgra

w-hill.

es

53

2Sistemasgestoresdecontenidos

Test de repaso

Soluciones: 1c,2b,3d,4c,5a,6b,7d,8b,9b,10c,11c.

1. ¿Cuálnoesunafuncióndelosgestoresdecontenidos?

a) Creacióndecontenido.

b) Publicacióndecontenido.

c) Seleccióndecontenido.

d) Edicióndecontenido.

2. ¿QuénoeselbackenddeunCMS?

a) UnapartedelCMS.

b) Unusuarioconprivilegios.

c) Lazonadeadministración.

d) ElgestordelCMS.

3. WordPressnotiene:

a) UneditorWYSIWYG.

b) Variedaddetemas.

c) Variedaddeplugins.

d) Módulos.

4. Indicarlaafirmaciónverdadera:

a) WordPressnopermiteinsertarpublicidad.

b) WordPressnogestionaarchivosdeaudioyvídeo.

c) WordPressrequierevalidacióndeusuario.

d) WordPressrequieresindicacióndecontenidos.

5. Indicarlaafirmaciónfalsa:

a) WordPressnorequiereunservidorweb.

b) WordPressrequiereunservidordebasesdedatos.

c) WordPressnorequiereLAMP.

d) WordPressnorequiereplantillas.

6. Lazonadesindicaciónseencuentraen:

a) ElbackenddeWordPress.

b) ElfrontenddeWordPress.

c) Laconfiguraciónglobal.

d) Noexistezonadesindicación.

7. ElperfildeusuarioEditortiene:

a) Permisosparaadministrarplantillasdecontenidos.

b) Permisosparamodificarlaestructuradelosmenús.

c) Permisosparaadministrarestadísticas.

d) Permisosparamodificarentradas.

8. Unapáginasiempretienesumenúasociado:

a) Cierto.

b) Falso.

c) Noexistenpáginasenlosmenús.

d) Ningunadelasanterioresrespuestasescierta.

9. Cuandoseborraunmenú,seeliminaelmenúseleccio-nado,peronolasentradascontenidasenél.

a) Cierto.

b) Falso.

c) Noexistenartículosenlosmenús.

d) Ningunadelasrespuestasanterioresescierta.

10. Losmetadatosdeunaentrada:

a) Indicanelautor,elniveldeaccesodelartículoylasfechasdecreaciónypublicación.

b) IndicanelidiomadelaentradayeltextoalternativodelenlaceLeer más.

c) Sonpalabrasclaveque luegoseutilizaránen lasbúsquedasparalocalizarlaentrada.

d) Noexistenmetadatosenlasentradas.

11. Si tienes una extensión instalada en el portal, peronolaestásutilizando,¿quéfrasesuponeunaactitudsegura?:

a) Nohayproblema,nomemolesta.

b) Sé que está ocupando espacio, pero tengo sufi-ciente.

c) Creoquedebería eliminarla, probablemente con-sumarecursos.

d) Sitodovabien,mejornotocarnada.

www.mcg

raw-h

ill.es

Sistemasgestoresdecontenidos2

54

Comprueba tu aprendizaje1. ¿Quéhechohistórico,deloscomentadosenestauni-

dad,fueelmásimportante,segúntucriterio?Razonayjustificaturespuesta.Buscaunhechorelacionadoconlosgestoresdecontenidoosucesoimportanteactualquenoestéreflejadoeneldocumentosobrelahistoria,U2_AW_Historia.pdf quepuedesdescargardelCEO.

2. ¿EsWordPressunsistemagestordecontenidosseguro?

3. SiquierodisponerdeunportalWordPress,¿quéesloquenecesito?

4. ¿Quésonlosmetadatos?

5. ¿CómodefiniríaslosmenúsdeWordPress?

6. ¿Qué identifica o representa el nivel de acceso enWordPress?

7. ElcampoSlugdelacategoríaidentifica:

a) Alusuarioquehacreadolacategoría.

b) Almenúquecontienedichacategoría.

c) Alapropiacategoríaenlabasededatos.

d) AlaversiónamigabledelaURLdelnombre.

8. Cuandoseeliminaunacategoría:

a) Sequedaarchivadaporsiserequieremástarde.

b) Nopuedecontenerningunaentradadecontenido.

c) Desaparece del listado, pero no de la base dedatos.

d) Ningunadelasanterioresescierta.

9. ElperfildeusuarioEditorpuede:

a) Crearmenús,peronoañadirítems.

b) Crearmenúsyañadirítems.

c) Crearentradas,peronoeditarlas.

d) Crearentradasyeditarlas.

10. ¿Quésignificaqueunaentradaestépublicadayprote-gidaconcontraseña?

11. ¿Aquéhacenreferencialasopcionesdepantalla?

12. Indicarsilasiguientefraseesverdaderaofalsa:

«Laorganizaciónjerárquicadecontenidosimplicaquedentrodeunasubcategoríapuedehaberunaomáscategoríasydentrodeunacategoríapuedehaberunoomásítemsdecontenido.»

13. ¿QuépasaríasiennuestroportalelimináramoselmenúTopMenu?

14. Losplugins deWordPress:

a) Modifican el comportamiento estándar deWord-Press.

b) Sonopcionesdemenúparainstalarcomponentes.

c) SonpartedelasplantillasdeWordPress.


15. LasplantillasenWordPress:

a) Soloexistenparalapartepúblicadelsitioweb.

b) DefinenladisposicióndelsitiowebWordPress.

c) Solodeterminanelaspectoestéticodelsitioweb.


16. ¿Creesqueseríainteresantepermitirelregistroautomá-ticodeusuarios?

17. Indicarsilafrasesiguienteesverdaderaofalsayjusti-ficarlarespuesta:

«ElmóduloSindicaciónmuestraenlacesdesindicaciónquepermitena los visitantes suscribirsea las últimasnoticiasdeunportal.»

18. EnWordPress,engeneral,esimportante:

a) Instalarmuchasextensionesparadisponerdemayorfuncionalidad.

b) Actualizarelportaldecualquierwebdisponible.

c) Trabajarsobreelportaldeproducciónparaacelerarloscambiosymejoras.


19. Creatupropioglosarioconaquellostérminosrelacio-nadosconlosCMSquenohayasentendidosuficiente-mente.Puedesutilizarunawikiparahacerelejerciciodeformacolaborativaconotroscompañeros,outilizarGoogleDocs.

20. Busca en Internet el vídeo más representativo y demayorcalidadrelacionadoconlamateriaexplicadaenlaunidad.Subeelenlacealwikideestaactividadcomentandoelmotivoporelquesehaelegidoesteentretodoslosexistentes.

21. ¿Cuálcreestúqueseríaunapreguntaadecuadaparaexaminarestaunidad?Proponlaeindicaenquépartedeestaunidadsepuedeencontrarlasolución.

www.mcg

raw-h

ill.es

Telf. contacto: 902 656 439 http://mghlibros.distriforma.es/

McGraw-Hill te facilita disponer de tus eBooks y libros

¡No esperes más para tenerlos! Un sistema rápido y cómodo al recibirlo en tu domicilio

Contacta con MGHLibros

www.mcgraw-hill.es / www.mhe.es

Distriforma y MGHLibros: Distribuidor de ebook y venta tradicional

McGraw-Hill y Distriforma colaboran gestionando la librería virtual

En esta página web puedes disponer de nuestro fondo actualmente activo

www.mcg

raw-h

ill.es

www.mcg

raw-h

ill.es

Unidad Sistemas gestores de contenidos · Sistemas gestores de contenidos 2 1.2. Características...

Documents

Transcript of Unidad Sistemas gestores de contenidos · Sistemas gestores de contenidos 2 1.2. Características...