Initial Commit: desarrollando un tema de WordPress (hijo) para WikiToki

estructura-base-de-datos-wikitoki

Desde el grupo de comunicación de WikiToki, aka KITKAT , hemos desarrollado un tema hijo de WordPress para empezar a presentarnos en Internet en wikitoki.org. Hemos partido del tema de WordPress Spacious y sobre él vamos a desarrollar las nuevas funciones que necesitamos de momento La idea era no dedicar apenas tiempo al diseño, lo dejamos para otra ocasión.

Puedes ver el código que estamos usando en el repositorio que hemos abierto de github. Github es una web que te permite gestionar un repositorio de código utilizando git. También te ofrece otros servicios como una wiki, gestión de bugs (problemas) o poder ver todos los cambios hechos al código (commits) de un modo centralizado y sencillo. Como es un child-theme tendrás que tener instalado previamente el tema padre Spacious para poder usar el de WikiToki.

Las dos funcionalidades básicas que hemos añadido son:

Crear el custom post type (CPT) de actividades

Para ello basta con registrar Actividad como nuevo tipo de post (commit relacionado). Luego hay que crear un template de página para listar las actividades (commit). Puedes ver el listado de actividades en http://wikitoki.org/actividades/ Para los campos extra (lugar, fecha, organizador) usamos custom meta boxes.

Gestión de Usuarios (o Wikitokers)

WikiToki está compuesto de personas y grupos (colectivos, empresas, asociaciones) de personas. A la hora de mostrar Quiénes somos había que tener un sistema versátil que listara o bian los grupos o a las personas, a elección de cada cual. En vez de crear un nuevo CPT para grupos, se utilizó el sistema de usuairos por defecto de WordPress. Crear taxonomías y nuevos campos para los usuarios es más engorroso que para cualquier CPT con custom meta boxes (añade campos extras o crear taxonomías para los usuarios). Para las imágenes asociadas a usuarios hemos usado el plugin WP User Avatar.

Un usuario se listará en la página que los lista (Quiénes) si el usuario ha seleccionado la taxonomía “colectivo”.

Cuando entramos a ver un usuario (author.php), además de mostrar todos los apartados y bio/perfil se listan los grupos a los que pertenece o los usuarios que pertenecen al usuario. ¿Cómo se hace es esto? Se han hecho dos loops que se incluyen en el template para usuairo author.php:

Loop para listar los grupos a los que pertenece un usuario (Ej: Juan pertence a los grupos WikiTroli y Tromba). Extrae los términos “wp_get_object_terms($author_ID, ‘user-group’);” que contiene la taxnomía “user group” luego con un “foreach” saca los links:

			<?php
			//Displays groups where the user belongs
			//gets the terms in the user-group taxonomy
			//Only displays information if user belongs to a group
			$user_groups = wp_get_object_terms($author_ID, 'user-group');
			if(!empty($user_groups) && !is_wp_error( $user_groups )){

					echo "<h2>Grupos a los que pertenece</h2>";
					echo '<ul>';
					foreach($user_groups as $user_group){
						$usergroup_slug = strtolower (str_replace(" ","-",$user_group->name));
						echo '<li><a href="/author/'.$usergroup_slug.'">'.$user_group->name.'</a></li>'; //TODO it would be better to dynamically generate the link (not hardcode ur)
					}
					echo '</ul>';
			}
			?>

Loop para listar los usuarios que pertencen a un grupo:

<?php
			//Lists all the users that have the slug of this user we are displaying now as taxonomy user-group
			$args = '';
			$tax_slug = "user-group";
			$term_slug = $user_login; //uses the user_login of the user as term of the taxonomy
			$term_object = get_term_by('slug',$term_slug,$tax_slug);

			if(!empty($term_object)){ //checks if there is no term for that taxonomy
				$userids = get_objects_in_term( $term_object->term_id, $tax_slug );
				$args['include'] = $userids;
				$wp_user_query = new WP_User_Query($args);
				$authors = $wp_user_query->get_results();

				if(!empty($authors) && !is_wp_error( $authors)){
					echo "<h2>Personas que pertenecen a este grupo</h2>";
					foreach ( $authors as $auth ) {
						$author_ID = $auth->ID;
						$author_meta = array_map( function( $a ){ return $a[0]; }, get_user_meta( $author_ID ) );
						$author = get_userdata($author_ID); //array with all the user data
						$auth_username = $author->user_nicename;
						?>
						<div>
							<div style="float:left;margin:10px"><?php echo get_wp_user_avatar($author_ID, 40); ?></div>
							<h4><a href="<?php echo get_author_posts_url( $author_ID); ?>"><?php echo $auth_username ?></a></h4>
						</div>
						<hr>
					<?php
					}
				}
			}
			?>

El resto del tema funciona todo como el tema Spacious, como buen tema hijo que es. Eso quiere decir que coge de /spacious los archivos . para los archivos no especificados en este tema

Este post también se publica también en wikitoki.org (posts hermanos).

 

Cómo aumentar el tamaño máximo de subida de archivos en wordpress en gandi.net

Desde hace un tiempo en motnera34 estamos mudando todas nuestras páginas a un hosting en gandi.net. Después de superar los problemas de bases de datos de wordpress de más de 10Mb con BigDump, parece que todo estaba solucionado. Lo que pasa es que nos habíamos olvidado del tamaño máximo de subida de archivos desde el propio escritorio de wordpress, por defecto es 2Mb. Para aumentarlo, al menos en gandi.net, basta con incluir ahcer una pequeña modificación en el .htaccess. El .htaccess está en el directorio raiz de tu servidor, cuando lo descargues es probable que no puedas verlo, tendrás que dar en tu navegador de archivos a “ver archivos ocultos”, que son todos aquellos que tienen un punto delante.

Edita el .htaccess y añade estas líneas:
php_value upload_max_filesize 64M
php_value post_max_size 64M
php_value max_execution_time 300
php_value max_input_time 300

Vuelve a subirlo donde lo habías encontrado, en el raiz de tu servidor.

Encontré la solución tras probar las diferentes opciones que contaban en wpbeginner.

 

 

Los 8 pasos para instalar WordPress en tu propio ordenador

wordpress-phpmyadmin
Estos son los pasos que he seguido para instalar WordPress en local. Para ello necesitaremos tener un servidor, y mySQL para alojar la base de datos. Habitualmente suelo desarrollar los temas de WordPress en un servidor remoto, con la consecuente pérdida de tiempo que lleva tener que subir vía ftp o ssh los archivos para poder ver los cambios realizados. Ahora ya no necesito internet para desarrollar y probar temas. Algo básico, pero que no me había puesto a aprender hasta hoy.

Este manual ha sido realizado junto con @skotperez en Ubuntu 10.04 Lucid Lynx, aunque muchos de los pasos son igualmente válidos para Windows y Mac.

  1. Instalar apache 2 (in ubuntu, open a terminal and type “sudo apt-get install apache2”
  2. Instalar mySQL (sudo apt-get install mysql-server)
  3. Instalar phpMyAdmin (vía Ubuntu Software Center)
  4. Crear base de datos
    Hay dos caminos posibles:

    1. Desde phpMyAdmin:
      1. Puedes acceder a la base de datos vía phpMyAdmin en http://localhost/phpmyadmin
      2. Haz login con el usuario y contraseña con el que hayas configurado mySQL (en mi caso es la misma que la contraseña para mi usuario de ubuntu). En mi caso el usuario es root.
      3. Crea base de datos “Create new database“. Pon un nombre a tu base de datos. Collation y utf8 están bien como opciones por defecto
      4. Entra en la base de datos a través del menú de la izquierda y vete a la pestaña “privileges” para crear un usuario y contraseña.
    2. Desde mysql:
      1. Si el comando
        mysql no te funciona, prueba con
        mysql -h localhost -u root
      2. Una vez dentro de la consola de mysql:
        CREATE DATABASE sname_of_database;
        GRANT ALL PRIVILEGES ON name_of_database.*
        TO 'name_of_database'@'localhost'
        IDENTIFIED BY 'databasepassword';
        SHOW GRANTS FOR 'name_of_database'@'localhost';
      3. Puedes comprobar que la base de datos se ha creado con el comando:
        SHOW DATABASES;
      4. Sal de mysql con
        exit
  5. Descarga wordpress http://wordpress.org/download/ y descomprime el zip. En mi caso en la carpeta /home/numeroteca/wordpress
  6. Cambio el nombre de wp-config-sample.php por wp-config.php. Pongo los datos de la recién creada base de datos en el wp-config.php. Que quedará como:
    define('DB_NAME', 'name_of_database')
    define('DB_USER', 'name_of_database');
    define('DB_PASSWORD', 'databasepassword')
    define('DB_HOST', 'localhost');
  7. El directorio por defecto de apache es /var/www/
    Todo lo que hay en ese directorio es visible desde http://localhost. Para no tener que trasladar todos los archivos de wordpress a la carpeta /var/www/ (o a la carpeta /var/www/html) creamos una liga blanda (o enlace simbólico) desde allí:

    1. Navegamos hasta ahí /var/www/
      cd /var/www/ o cd /var/www/html
    2. Creamos liga blanda:
      ln -s /home/path/to/the_files/where/wordpress/files/are
      Por ejemplo
      ln -s /home/numeroteca/wordpress
      Probablemente tengas que usar sudo ln -s /home/numeroteca/wordpress, ya que necesitas permisos especiales para editar en ese directorio.
  8. Ahora si vas a http://localhost/wordpress podrás acceder al wordpress y realizar la instalación (si el wp-config.php está bien configurado).

Actualización 15 de marzo 2013: Si después de instalar worpdress añades carpetas al tema en que estás trabajando (me pasó añadiendo las carpetas de bootstrap a un tema), si estás no tienen los permisos necesario, el navegador no podrá leerlas. Asegúrate de darles permisos con: chmod a+rwx nombre-de-carpeta (lo vi en webtechquery.com)

Actualización 30 de marzo 2013: Esto de los permisos tiene más jugo. Para poder actualizar los plugins tienes que cambiar el propietario de los archivos de wordpress. (solución vía varios post, entre otros este).

Para saber quién es el propietario al que tienes que otorgarle los permisos, inserta  <?php echo(exec("whoami")); ?> en cualquiera de las páginas de wordpress.

Mira en el navegador a ver qué sale como resultado del echo “who I am”. En micaso es “www-data”. Por lo tanto deberás cambiar los el propietario de la carpeta donde tienes instalado el wordpess a “www-data” (change owner = chown):

sudo chown -hR www-data carpeta-donde-tienes-instalado-wordpress/*

[no lo he probado, pero probablemente no haga falta cambiar el propietario de todas carpetas de tu instalación de wordpress, sino solo unas pocas].
Esta acción cambiará el propietario detodos los archivos y carpetas, de forma que cuando vayas a editar tu tema de wordpress o el wp-config.php no te dejará salvarlo. Para eso tienes que otorgarte de nuevo la propiedad de esos archivos o carpetas utilizando el mismo método. Por ejemplo, para que el archivo wp-config.php vuelva a ser de tu propiedad (tu usuario de ubuntu, en mi caso “numeroteca”):

sudo chown -hR numeroteca wp-config.php

También puede funcionar añadir al wp-config.php la línea, como sugieren por ahí cuando no tienes acceso ftp, me funcionó en otra instalación:
define('FS_METHOD', 'direct');

How to make a newsletter in Hindi

It’s the second time I have to make a newsletter in Hindi. A short how to guide to make this process easier for next time.

I received a .docx in Hindi and copy pasting it didn’t work. That’s what I did:

  1. Install the font in Hindi to be able to see the text.
  2. Use converter to convert the Hindi text into Unicode.
    1. Select the font you are using (in my case
    2. Paste in the left box what you’ve copied from the .docx document. It’ll look something like “dukZVd ds fofHkUu Hkkxksa ls vk, dbZ o;kso`) ukxfjdksa lfgr”
    3. Select Hindi and clickconvert.
    4. Now you can copy the result and paste it in your blog.
  3. Some corrections were needed so I had to install Indec IME  plugin in wordpress to be able to write with Hindi characters.
  4. To remove what shows up in your header change line 43 from the file indicime.php  (find it at /wp-content/plugins/indic-ime):
    1. from  “add_action(‘wp_head’, array(&$this, ‘add_css’)); “
    2. to  “//add_action(‘wp_head’, array(&$this, ‘add_css’));”
      now that this action is commented, no banner will appear.
  5. [update 25.09.12] To remove what shows in your footer
    1. Commented in line 71 “<!–div style=’float:left’><img src='” + indicime_bu + “img/pin2.gif’ id=’indicpin’ onclick=\”indictl(‘indicpin’,’indiccontent’);\” style=’cursor: pointer; cursor: hand;’ title=’Toggle IndicIME visibility’></div><div id=’indiccontent’ style=’DISPLAY:inline’>&nbsp;Type in <select name=’indicscript’ id=’indicscript’ onchange=’indicChange(this.id ,this.options[this.selectedIndex].value);’ style=’font-family:verdana, arial, helvetica, sans-serif; font-size:10px;’>”
    2. Commented in line 91 “<!–img src='” + indicime_bu + “img/help.gif’ id=’indichp’ onclick=\”indictl(‘indichp’,’indiccmc’);return false;\” style=’cursor: pointer; cursor: hand;’ title=’Toggle help description’>”
  6. Enjoy.

See the results at the Alliance of Indian Wastepickers (AIW) Newsletter August 2012 in Hindi.