Aprendiz de Ilusiones http://www.aprendizdeilusiones.com Tue, 09 Mar 2010 13:36:02 +0000 en hourly 1 Como crear un widget en Wordpress con Widget API http://www.aprendizdeilusiones.com/2010/03/07/wordpress/como-crear-un-widget-en-wordpress-con-widget-api/ http://www.aprendizdeilusiones.com/2010/03/07/wordpress/como-crear-un-widget-en-wordpress-con-widget-api/#comments Sun, 07 Mar 2010 18:45:29 +0000 Aprendiz de Ilusiones http://www.aprendizdeilusiones.com/?p=35 Con la versión de Wordpress 2.8 se incorpora una API que facilita la tarea de crear un widget.

Con la intención de mostrar una imagen aleatoria en la barra lateral me dije voy a descargarme un widget que lo haga pero los que probé tenian alguna que otra pega y para no andar modificandolos dije: “Hagamos uno” y eso haremos.

Lo que mostrare aquí como la intención básica es crear el widget en sí más que lo que muestre hagamos un simple Hola Mundo Widget.

No llevará mas de un archivo php y se podría crear un simple plugin formado por un solo archivo pero por si acaso en un futuro se añadiesen mas ficheros lo mejor sería crear un directorio con el nombre del plugin y dentro el fichero.

En nuestro caso llamamos al directorio y fichero adi-hola-mundo-widget (el nombre es lo de menos pongo adi delante para evitar que ningún otro plugin se llame así)

Y dentro del empezamos a escribir:

Primero añadimos la información de nuestro widget que sera la que se mostrara en el listado de widget de nuestro wordpress

<?php
/*
 * Plugin Name: Hola Mundo Widget
 * Version: 1.0
 * Plugin URI: http://www.aprendizdeilusiones.com/2010/03/07/otros/como-crear-un-widget-en-wordpress-con-widget-api/
 * Description: Widget de ejemplo con la nueva API Widget
 * Author: Aprendiz de Ilusiones
 * Author URI: http://www.aprendizdeilusiones.com
 */
?>

Ahora crearemos nuestro widget. Con la esta API podemos crear una clase que extienda de WP_Widget con tres funciones (constructor (que sera igual que el nombre de la clase), widget, update y form)

<?php
class AdiHolaMundoWidget extends WP_Widget {
	//Constructor
	function AdiHolaMundoWidget () {
 
	}
	//Como se mostrara el widget en la web
	function widget($args, $instance) {
	}
	//Función para guardar la configuración del widget en el panel de control
	function update($new_instance, $old_instance) {
 
	}
	//Muestra el formulario del widget en el panel de control
	function form($instance) {
 
	}
}
?>

Ahora veamos las funciones paso por paso.

<?php
	function AdiHolaMundoWidget() {
		//Clase CSS que usara el widghet y la descripción que se mostrará en la selección de widget en el Panel de Control
		$widget_ops = array( 'classname' => 'adiHolaMundo', 'description' => __('Widget de ejemplo') );
 
		//Configuración del widget en el panel de control.
		$control_ops = array( 'width' => 200, 'height' => 350);
 
		// Creamos el widget. El idbase que se usa en el formulario de configuración, Titulo del Widget en el panel de control,
		// y las opciones del widget y en control
		$this->WP_Widget( 'idAdiHolaMundoWidget', __('Adi Hola Mundo Widget'), $widget_ops, $control_ops );
	}
?>

El detalle a tener en cuenta como ya he dicho antes es que el constructor tenga el mismo nombre de la clase (como en casi cualquier lenguaje de programación), lo demás tampoco hay que darle mucha mas vuelta…. Copiar, Pegar y Editar con lo que se quiera :D 

<?php
	/**
	 * Como se mostrara el widget en la web
	 */
	function widget( $args, $instance ) {
		extract( $args );
 
		$title = apply_filters('widget_title', $instance['title'] );
		$nombre= $instance['nombre'];
 
		echo $before_widget;
 
		/* Nuestro widget */
		if ( $title )
			echo $before_title . $title . $after_title;
 
		echo "Hola Mundo soy ".$nombre;
 
		echo $after_widget;
	}
?>

Con esta función configuramos el widget como aparecerá en la barra de widget de la página web.  Las opciones $before_widget,$after_widget,$before_title y $after_title son valores que se configuran el theme cuando registras las sidebar. (Siempre las he visto en el fichero functions.php)

<?php
	 /**
	 * Funcion para guardar la configuración del widget en el panel de control
	 */
	function update( $new_instance, $old_instance ) {
		$instance = $old_instance;
 
		//Usar strip_tags y stripslases para controlar el texto insertado en los campos de texto
		$instance['title'] = strip_tags( stripslashes($new_instance['title'] ));
		$instance['nombre'] = strip_tags( stripslashes($new_instance['nombre'] ));
 
		return $instance;
	}
?>

Una función muy sencillita que lo unico que tenemos que hacer es actualizar los nuevos valores de la configuración. Aquí es donde tenemos que comprobar que los datos introducidos sean los correctos. Si pide un valor que el usuario no introduzca un texto… esos fallos que nunca se comprobaban en programación y la profesora te echaba bronca y tu decías.

“Pero profe no creo que el usuario sea tan estúpido, si pone introduce un número y pulsa una letra… ajo y agua.” Pero no, no colaba :D 

<?php
	/**
	 * Muestra el formulario del widget en el panel de control
	 */
	function form( $instance ) {
 
		//Establecemos algunos datos por defecto
		$defaults = array( 'title' => __('Ejemplo del Hola Mundo'), 'nombre' => __('Aprendiz'));
		$instance = wp_parse_args( (array) $instance, $defaults );
?>
 
		<p>
			<label for="<?php echo $this->get_field_id( 'title' ); ?>"><?php _e('Titulo:'); ?></label>
			<input id="<?php echo $this->get_field_id( 'title' ); ?>" name="<?php echo $this->get_field_name( 'title' ); ?>" value="<?php echo $instance['title']; ?>" style="width:100%;" />
		</p>
		<p>
			<label for="<?php echo $this->get_field_id( 'nombre' ); ?>"><?php _e('nombre:'); ?></label>
			<input id="<?php echo $this->get_field_id( 'nombre' ); ?>" name="<?php echo $this->get_field_name( 'nombre' ); ?>" value="<?php echo $instance['nombre']; ?>" style="width:100%;" />
		</p>
	<?php
	}
?>

Y el método que faltaba, que sirve para mostrar la configuración del widget en el panel de control.

Primero creamos los valores por defecto y los inicializamos en la instancia y luego el formulario con las etiquetas y campos que queramos sin preocuparnos por los botones de guardar ni borrar. Para las id y nombres del campo mejor usar las nuevas funciones get_field_id() y get_field_name().

Finalmente debemos decirle a Wordpress que registre nuestro widget cuando inicialice los widget.

<?php
add_action( 'widgets_init', 'adiHolaMundoWidget_load' );
 
function adiHolaMundoWidget_load() {
	register_widget( 'AdiHolaMundoWidget' );
}
?>

Cuando wordpress inicialice los widgets con widgets_ini llamara a nuestra función y con register_widget registrará el nuestro

El código completo:

  1. <?php
  2. /*
  3.  * Plugin Name: Adi Hola Mundo Widget
  4.  * Version: 1.0
  5.  * Plugin URI: http://www.aprendizdeilusiones.com/2010/03/07/otros/como-crear-un-widget-en-wordpress-con-widget-api/
  6.  * Description: Widget de ejemplo con la nueva API Widget
  7.  * Author: Aprendiz de Ilusiones
  8.  * Author URI: http://www.aprendizdeilusiones.com
  9.  */
  10. ?>
  11. <?php
  12. class AdiHolaMundoWidget extends WP_Widget {
  13.  
  14. 	function AdiHolaMundoWidget() {
  15. 		//Clase CSS que usara el widghet y la descripción que se mostrará en la selección de widget en el Panel de Control
  16. 		$widget_ops = array( 'classname' => 'adiHolaMundo', 'description' => __('Widget de ejemplo') );
  17.  
  18. 		//Configuración del widget en el panel de control.
  19. 		$control_ops = array( 'width' => 200, 'height' => 350);
  20.  
  21. 		// Creamos el widget. El idbase que se usa en el formulario de configuración, Titulo del Widget en el panel de control,
  22. 		// y las opciones del widget y en control
  23. 		$this->WP_Widget( 'idAdiHolaMundoWidget', __('Adi Hola Mundo Widget'), $widget_ops, $control_ops );
  24. 	}
  25.  
  26. 	/**
  27. 	 * Como se mostrara el widget en la web
  28. 	 */
  29. 	function widget( $args, $instance ) {
  30. 		extract( $args );
  31.  
  32. 		$title = apply_filters('widget_title', $instance['title'] );
  33. 		$nombre= $instance['nombre'];
  34.  
  35. 		echo $before_widget;
  36.  
  37. 		/* Nuestro widget */
  38. 		if ( $title )
  39. 			echo $before_title . $title . $after_title;
  40.  
  41. 		echo "Hola Mundo soy ".$nombre;
  42.  
  43. 		echo $after_widget;
  44. 	}
  45.  
  46. 	 /**
  47. 	 * Funcion para guardar la configuración del widget en el panel de control
  48. 	 */
  49. 	function update( $new_instance, $old_instance ) {
  50. 		$instance = $old_instance;
  51.  
  52. 		//Usar strip_tags y stripslases para controlar el texto insertado en los campos de texto
  53. 		$instance['title'] = strip_tags( stripslashes($new_instance['title'] ));
  54. 		$instance['nombre'] = strip_tags( stripslashes($new_instance['nombre'] ));
  55.  
  56. 		return $instance;
  57. 	}
  58.  
  59. 	/**
  60. 	 * Muestra el formulario del widget en el panel de control
  61. 	 */
  62. 	function form( $instance ) {
  63.  
  64. 		//Establecemos algunos datos por defecto
  65. 		$defaults = array( 'title' => __('Ejemplo del Hola Mundo'), 'nombre' => __('Aprendiz'));
  66. 		$instance = wp_parse_args( (array) $instance, $defaults );
  67. ?>
  68.  
  69. 		<p>
  70. 			<label for="<?php echo $this->get_field_id( 'title' ); ?>"><?php _e('Titulo:'); ?></label>
  71. 			<input id="<?php echo $this->get_field_id( 'title' ); ?>" name="<?php echo $this->get_field_name( 'title' ); ?>" value="<?php echo $instance['title']; ?>" style="width:100%;" />
  72. 		</p>
  73. 		<p>
  74. 			<label for="<?php echo $this->get_field_id( 'nombre' ); ?>"><?php _e('Nombre:'); ?></label>
  75. 			<input id="<?php echo $this->get_field_id( 'nombre' ); ?>" name="<?php echo $this->get_field_name( 'nombre' ); ?>" value="<?php echo $instance['nombre']; ?>" style="width:100%;" />
  76. 		</p>
  77. 	<?php
  78. 	}
  79. }
  80. add_action( 'widgets_init', 'adiHolaMundoWidget_load' );
  81.  
  82. function adiHolaMundoWidget_load() {
  83. 	register_widget( 'AdiHolaMundoWidget' );
  84. }
  85. ?>
]]> http://www.aprendizdeilusiones.com/2010/03/07/wordpress/como-crear-un-widget-en-wordpress-con-widget-api/feed/ 11 Unity3D http://www.aprendizdeilusiones.com/2010/03/06/unity/unity3d/ http://www.aprendizdeilusiones.com/2010/03/06/unity/unity3d/#comments Sat, 06 Mar 2010 13:56:38 +0000 Aprendiz de Ilusiones http://www.aprendizdeilusiones.com/?p=22 Hace un mes me hablaron de esta herramienta, bueno miento, me hablaron hace ya hace un tiempecillo pero por falta de tiempo lo dejé ignorado, pero entonces me enseñaron un videojuego que habían realizado para un trabajo de clase y la verdad que me volvió el gusanillo de intentar hacer videojuegos. Antes ya lo había intentado en flash, pero al final como todo por falta de tiempo…. esperemos conseguir esta vez algo fructífero, la programación no sera problema (espero) pero el modelado y demás…

Unity3D es una herramienta de desarrollo de videojuegos tanto 3d como 2d que en un principio fue realizada para MAC pero hace un año la implementaron también para Windows, puedes hacer juegos para MAC, para PC, para poder jugar en una web como se harían en flash (evidentemente hay que descargar un pequeño plug-in), para el iphone e incluso para la Wii y lo mejor es que desde hace unos meses es gratis, bueno la versión básica pero se puede hacer casi de todo, tiene algunas limitaciones, como no se pueden poner reflejos (espejos, agua..) no hay se permiten sobras tiempo real, si haces un juego web saldrá un pequeño logotipo los primeros segundos y no puedes ganar con estos juegos un dinero superior a 100.000$ al año… que bueno… si ganas 100.000$ te puedes permitir el lujo de pagar 2000$ por la versión PRO. Bueno y para programar para el Iphone también hay que comprar una versión especial y en la wii primero tienes que ser desarrollador certificado.

Si queréis ver ejemplos podéis encontrarlos en http://unity3d.com/gallery/live-demos/

Dentro puedes ver el ejemplo del proyecto que viene por defecto en Unity. Una Isla paradisiaca donde puedes moverte con el teclado y el ratón como cualquier FPS.

Please view the full post to see the Unity content.

]]> http://www.aprendizdeilusiones.com/2010/03/06/unity/unity3d/feed/ 14 Comenzamos (Otra vez) http://www.aprendizdeilusiones.com/2010/03/02/otros/comenzamos-otra-vez/ http://www.aprendizdeilusiones.com/2010/03/02/otros/comenzamos-otra-vez/#comments Tue, 02 Mar 2010 22:07:06 +0000 Aprendiz de Ilusiones http://www.aprendizdeilusiones.com/?p=1 Debe ser la tercera o cuarta vez que intento empezar este blog y siendo realista no creo que sea la última aunque intentaré que no sea así.

Ilusión (segun la RAE)
(Del lat. illusĭo, -ōnis).
1. f. Concepto, imagen o representación sin verdadera realidad, sugeridos por la imaginación o causados por engaño de los sentidos.
2. f. Esperanza cuyo cumplimiento parece especialmente atractivo.
3. f. Viva complacencia en una persona, una cosa, una tarea, etc.
4. f. Ret. Ironía viva y picante.

Todos en esta vida tenemos algún tipo de ilusiones y hay que tener una cosa en cuenta…

No hay nada imposible, tan solo improbable

Suerte y bienvenido

]]> http://www.aprendizdeilusiones.com/2010/03/02/otros/comenzamos-otra-vez/feed/ 0