{"id":4793,"date":"2014-05-05T08:44:37","date_gmt":"2014-05-05T07:44:37","guid":{"rendered":"http:\/\/www.rusalia.com\/?p=4793"},"modified":"2015-11-24T23:41:44","modified_gmt":"2015-11-24T22:41:44","slug":"widgets-wordpress","status":"publish","type":"post","link":"https:\/\/www.rusalia.com\/widgets-wordpress\/","title":{"rendered":"Widgets de WordPress: c\u00f3mo darles formato y hacerlos multiling\u00fces"},"content":{"rendered":"

Los widgets son un complemento ideal para dise\u00f1ar p\u00e1ginas web en WordPress. Su uso se ha ido haciendo cada vez m\u00e1s generalizado de manera que algunos temas de WordPress ya permiten dise\u00f1ar p\u00e1ginas enteras mediante widgets. En esta entrada te explico qu\u00e9 son los widgets,\u00a0qu\u00e9 clases de widgets hay y c\u00f3mo puedes dotarlos de funcionalidades extra: hacerlos multiling\u00fces, darles formato de manera f\u00e1cil sin tener conocimientos de html, hacerlos fijos o flotantes, etc.<\/strong><\/em><\/p>\n

\"WPML<\/p>\n

Cuando empec\u00e9 a utilizar WordPress entend\u00ed m\u00e1s o menos de manera r\u00e1pida lo que era un plugin, c\u00f3mo se instalaba y c\u00f3mo se pod\u00eda configurar. Sin embargo, el concepto de widget era algo que se me escapaba<\/strong>, ya que dependiendo de que utilizara un tema u otro ve\u00eda c\u00f3mo los widgets eran diferentes. Tambi\u00e9n ve\u00eda widgets que aparec\u00edan de repente en mi panel. En realidad, algunos de ellos eran widgets que se instalaban junto con plugins, otros eran complementos de dichos widgets, con lo cual no acababa de entenderlos muy bien.<\/p>\n

Cuando empec\u00e9 a redactar esta entrada iba a hablar \u00fanicamente de un widget que acababa de salir en el repositorio de plugins de WordPress (WPML Widgets<\/a>), pero conforme escrib\u00eda se me ocurri\u00f3 que ser\u00eda bueno hacer una entrada m\u00e1s gen\u00e9rica sobre c\u00f3mo manejar los widgets y dotarlos de funcionalidades extra.<\/p>\n

1. \u00bfQu\u00e9 es un widget de WordPress?<\/h2>\n

Los widgets de WordPress<\/a> son bloques que realizan una funci\u00f3n concreta y que suelen a\u00f1adirse en el sidebar (barra lateral). Como puedes ver en esta web son las cajitas situadas a tu\u00a0derecha: formulario de\u00a0suscripci\u00f3n al blog, mi\u00a0perfil de autora del blog, tem\u00e1ticas principales, b\u00fasqueda, art\u00edculos destacados, redes sociales, etc.<\/p>\n

Los widgets fueron creados originalmente para de manera f\u00e1cil y r\u00e1pida\u00a0dise\u00f1ar y dar estructura a un sitio web<\/strong>. Se manejan de manera muy f\u00e1cil arrastr\u00e1ndolos y solt\u00e1ndolos en una \u00e1rea espec\u00edfica destinada para ellos. Puedes encontrar la lista de widgets disponibles y las \u00e1reas destinadas a\u00a0widgets en Apariencia > Widgets<\/strong>.<\/p>\n

No hay que confundir los widgets propiamente dichos con las zonas habilitadas en las que podemos colocar los mismos<\/strong>. As\u00ed, las \u00e1reas destinadas a Widgets habitualmente est\u00e1n en la barra lateral pero tambi\u00e9n pueden estar en la cabecera, footer, debajo del contenido y en cualquier \u00e1rea.<\/p>\n

Las \u00e1reas disponibles para widgets var\u00edan de unos temas a otros. Por ejemplo, esta p\u00e1gina web est\u00e1 dise\u00f1ada con el Framework Genesis<\/a> y me permite realizar enteramente la\u00a0p\u00e1gina de inicio<\/a> (Homepage) mediante widgets. Tambi\u00e9n me permite insertar widgets al final de cada entrada (Widget After Entry). As\u00ed mismo, tambi\u00e9n puedo crear nuevos sidebars para asignarlos a p\u00e1ginas o entradas concretas (para ello utilizo el plugin Genesis Simple Sidebars<\/a>). El tema de Themeforest que utilizaba antes\u00a0s\u00f3lo me permit\u00eda utilizar widgets en la barra lateral (sidebar) y en el footer. Ah\u00ed va una captura de pantalla de los widgets\u00a0y \u00e1reas de widgets\u00a0que estoy utilizando en esta web.<\/p>\n

\"Widgets<\/p>\n

2. Clases de widgets<\/h2>\n

Para que sea f\u00e1cil de entender clasificar\u00eda los widgets en 3 grandes clases<\/strong> atendiendo a su procedencia: los widgets que se instalan por defecto con WordPress, los widgets que vienen con tu tema y los widgets que se instalan junto con plugins.<\/p>\n

2.1.\u00a0Widgets de\u00a0Wordpress<\/h3>\n

Existen una serie de widgets que se instalan por defecto en WordPress<\/a>:\u00a0categor\u00edas, nube de etiquetas, men\u00fa de navegaci\u00f3n, calendario, b\u00fasqueda, entradas recientes, etc.<\/p>\n

\"Panel<\/p>\n

2.2. Widgets\u00a0de tu tema de WordPress<\/h3>\n

Cada tema de WordPress tambi\u00e9n puede traer sus propios widgets<\/strong>. Por ejemplo, el Genesis Framework<\/a> viene con widgets adicionales como: p\u00e1gina destacada, entradas destacadas, perfil de usuario, etc. Cada uno de estos widgets tiene\u00a0sus propias opciones de configuraci\u00f3n. Adem\u00e1s, el child theme que utilizo en esta web<\/a>\u00a0(dise\u00f1ado con Genesis) tambi\u00e9n introduce nuevos widgets personalizables como por ejemplo la zona situada debajo de la imagen de portada en la que explico\u00a0los servicios que ofrezco. En la siguiente captura de pantalla de la p\u00e1gina de inicio de esta web he marcado en amarillo todos los widgets que utilizo y que me sirven para montar la Homepage un puzle. As\u00ed, en mi p\u00e1gina de inicio utilizo varios tipos de widgets: hay tanto widgets de WordPress (Widget de texto) como widgets del Genesis Framework<\/a> (como por ejemplo el Widget Perfil de Autor) y widgets del tema que utilizo<\/a> (Web Savvy CTA Widget que es un widget espec\u00edfico del tema).<\/p>\n

\"P\u00e1gina<\/p>\n

2.3. Widgets instalables\u00a0junto con plugins<\/h3>\n

Existen muchos widgets que puedes instalar de manera adicional junto con plugins<\/strong>. A su vez los dividir\u00eda estos widgets en dos subclases:<\/p>\n