Sentido Web

HTML5 Rocks ha publicado 3 tutoriales muy interesantes sobre desarrollo de HTML5.

El primero de ellos trata sobre cómo mejorar el rendimiento de las aplicaciones en HTML5, a parte de alguna que es puramente Javascript y no HTML5 (como guardar en una variable un elemento DOM y no buscarlo cada vez que vayamos usarlo), la mayoría de ellas trata sobre el uso de transiciones CSS3 por parte del navegador y no mediante el uso de Javascript, ya que así sería el navegador el que se encargue de ello y pueda optimizar su ejecución, por ejemplo:

  var elem = evt.target;
  // Modernizr es una librería que nos indica que elementos CSS3 y HTML5 dispone el navegador
  if (Modernizr.csstransforms && Modernizr.csstransitions) {
    // Mediante CSS3
    elem.style.transition = 'all 3s ease-out';
    elem.style.transform = 'translateX(600px)';
  } else {
    // Mediante jQuery
    jQuery(elem).animate({ 'left': '600px'}, 3000);
  }

El siguiente tutorial nos indica cómo meterle efectos CSS3 a nuestros textos, y la verdad es que alguno está muy currado. Claro que yo no soy muy partidario de usarlos según que tipo de publicación (se puede abusar mucho de ello), pero la verdad es que nos puede venir muy bien.

Y por último consejos HTML5 y CSS para convertir nuestra web a formato adaptado para móviles. Algunos trucos de rencimiento como el uso del almacenamiento local y algo bastante interesante cómo indicar la orientación o el viewport de la página:

<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=yes">
<meta name=viewport content="width=device-width, initial-scale=1.0, minimum-scale=0.5 maximum-scale=1.0">
<meta name="viewport" content="target-densitydpi=device-dpi">

Improving the Performance of your HTML5 App

Typographic effects in canvas

“Mobifying” Your HTML5 Site

Si queremos que el contenido de nuestros formularios de contacto generados con el plugin Contact Form 7 sean traducidos, tan sólo deberemos añadir a nuestro functions.php lo siguiente:

function translate_shortcode($tag) {
  if (isset($tag['values']) && count($tag['values']) > 1) return __($tag['values'][1], $tag['values'][0]);
  return "";
}
wpcf7_add_shortcode('translate', 'translate_shortcode', true);

Una vez añadido esto, podremos incluir en nuestro formulario lo siguiente:

[translate null "diccionario" "Texto que quiero traducir"]

El valor null es porque el plugin busca en el primer parámetro el ID del campo, el segundo campo es el nombre de diccionario que hayamos incluido con la función load_theme_textdomain, y por último el texto que vayamos a traducir.

WordPress se puede utilizar para muchas cosas y no sólo para crear un blog. En el caso de que quieras realizar un blog multi-idioma y necesites traducir el blog según el idioma del navegador del usuario, no el contenido, que para eso hay algún plugin, tan sólo deberemos añadir lo siguiente a nuestro functions.php:

function set_language($locale) {
  if (isset($_SERVER ["HTTP_ACCEPT_LANGUAGE"])) {
    $langs = $_SERVER ["HTTP_ACCEPT_LANGUAGE"];
    $langs = explode(',', $langs);
    $langs = $langs[0];
    $langs = explode('-', $langs);
    return $langs[0].'_'.strtoupper($langs[1]);
  } else {
    return $locale;
  }
}
add_filter( 'theme_locale', 'set_language');

Con esto conseguimos que si el lenguaje de nuestro navegador sea es-es, pase a es_ES y con ese locale, pues podemos usarlo en la traducción del theme junto a la función load_theme_textdomain

De lo que se entera uno, Facebook te ofrece la posibilidad de crearte usuarios de prueba para realizar tus aplicaciones en Facebook.

Mediante la API de Graph podemos entre otras cosas:

Crear usuarios

POST /app_id/accounts/test-users?installed=true&permissions=read_stream

Añadir usuarios a tu app:

POST /app_id/accounts/test-users?installed=true&permissions=read_stream
&uid=[test_user_id]&owner_access_token=[app_access_token_of_current_owner_app]

Acceder a ellos:

GET  /app_id/accounts/test-users

Eso sí, tiene ciertas limitaciones:

• Número limitado de usuarios que puedes crear
• Los usuarios de prueba pueden interactuar con otros usuarios de prueba pero no con usuarios reales.
• Los usuarios de prueba no pueden hacerse fan de páginas públicas o crear contenido público como escribir en el muro de una página.
• Pueden ser usados por los desarrolladores de la aplicación.
• Un usuario de prueba jamás se puede convertir en usuario real.

Si por un casual necesitas que tu WordPress realice las búsquedas por el título del post y que ignore el contenido, tan sólo hay que añadir un filtro a tu functions.php, lo cual también sirve para editar las condiciones de búsquedas y añadirle o quitarle condiciones:

add_filter('posts_search', 'mi_search_title');
function mi_search_title($search) {
  preg_match('/%([^%]+)%/', $search, $m);
  if (isset($m[1])) {
    // Original
    // " AND (((wp_posts.post_title LIKE '%termino%') OR (wp_posts.post_content LIKE '%termino%')))  AND (wp_posts.post_password = '') "
    return " AND wp_posts.post_title LIKE '%$m[1]%' AND (wp_posts.post_password = '') ";
  } else {
    return $search;
  }
}

Uno de los problemas con los que nos podemos encontrar en WordPress con mayor frecuencia es que los plugins son tal y como el desarrollador quiere y no como a ti te gustaría, y uno de los fallos más frecuentes es el añadir scripts y styles con wp_enqueue_script o wp_enqueue_style sin tener en cuenta en qué páginas se usan sus plugins (por ejemplo Contact Form 7).

Para quitar esos .js o .css molestos y sobrantes tan sólo hay que añadir lo siguiente en nuestro functions.php (caso particular para Contact Form 7):

function mi_remove_styles() {
  if (!is_page('contactar')) {
    wp_deregister_style("contact-form-7");
  }
}
 
function mi_remove_scripts() {
  if (!is_page('contactar')) {
    wp_deregister_script("contact-form-7");
  }
}
add_action( 'wp_print_styles', 'mi_remove_styles' );
add_action( 'wp_print_scripts', 'mi_remove_scripts' );

La verdad es que no tengo ni idea del éxito/uso de Google Buzz, dicen que es un fracaso, pero claro, a saber lo que es un fracaso comparado con otras redes sociales (no Twitter o Facebook, claro), por lo que no está mal saber que existe una librería y que te permite trabajar con Google Buzz.

 
// Include the library files
require_once "google-api-php-client/src/apiClient.php";
require_once "google-api-php-client/src/contrib/apiBuzzService.php";
 
// Create the apiClient and Buzz service classes:
$apiClient = new apiClient();
$buzz = new apiBuzzService($apiClient);
 
// Add the OAuth authentication flow to your app:
// If a oauth token was stored in the session, use that- and otherwise go through the oauth dance
session_start();
if (isset($_SESSION['auth_token'])) {
  $apiClient->setAccessToken($_SESSION['auth_token']);
} else {
  // In a real application this would be stored in a database, and not in the session!
  $_SESSION['auth_token'] = $apiClient->authenticate();
}
 
// Make an API call
$activities = $buzz->listActivities('@consumption', '@me');
 
// And echo the returned activities
echo "<pre>Activities:\n" . print_r($activities, true) . "</pre>";

buzz-php-client

La API de Google para acortar URLs permite acortar URLs, recuperar info del link original y las URLs acortadas de un usuario, aunque para usarlo se necesita crear una clave y dar de alta proyecto.

El resto es fácil, acceso mediante CURL y listo:

    define('GOOGLE_API_KEY', '[insert your key here]');
    define('GOOGLE_ENDPOINT', 'https://www.googleapis.com/urlshortener/v1');
 
    function shortenUrl($longUrl)
    {
        // initialize the cURL connection
        $ch = curl_init(
            sprintf('%s/url?key=%s', GOOGLE_ENDPOINT, GOOGLE_API_KEY)
        );
 
        // tell cURL to return the data rather than outputting it
        curl_setopt($ch, CURLOPT_RETURNTRANSFER, true);
 
        // create the data to be encoded into JSON
        $requestData = array(
            'longUrl' => $longUrl
        );
 
        // change the request type to POST
        curl_setopt($ch, CURLOPT_POST, true);
 
        // set the form content type for JSON data
        curl_setopt($ch, CURLOPT_HTTPHEADER, array('Content-type: application/json'));
 
        // set the post body to encoded JSON data
        curl_setopt($ch, CURLOPT_POSTFIELDS, json_encode($requestData));
 
        // perform the request
        $result = curl_exec($ch);
        curl_close($ch);
 
        // decode and return the JSON response
        return json_decode($result, true);
    }
 
    $response = shortenUrl('http://phpriot.com');
 
    echo sprintf(
        '%s was shortened to %s',
        $response['longUrl'],
        $response['id']
    );

Shortening URLs for goo.gl with Google’s URL Shortener API

Vía / PHPDeveloper.org

MemcacheQ es una interesante implementación de Memcache que permite realizar una cola de mensajes que luego podremos utilizar en nuestras aplicaciones de formas variadas, por ejemplo, si tenemos un proceso largo que queremos dividir y realizar partes en background, podemos crear una cola de mensajes e ir añadiendo distintas tareas para luego ir recuperándolas una a una.

MemcacheQ permite crear distintas colas y cuando se recupera un valor de la cola se borrará de esta. Imaginemos que tenemos un blog en el que cuando se publica un post se deben realizar una serie de tareas complejas, y no queremos tener a WordPress o Drupal o lo que usemos esperando para dar el OK de post publicado, lo que haríamos sería añadir un mensaje en la cola y luego con una tarea usando el cron, ir ejecutándolas una a una:

/* Método de publicación */
// Conectamos al servidor 
$memcache_obj = memcache_connect('memcacheq_host', 21201);
// Añadimos el mensaje a la cola
memcache_set($memcache_obj, /* id_cola */ 'tareas_del_blog', /* mensaje */ $id_post, 0, 0);
memcache_close($memcache_obj);
/* Método del cron */
// Conectamos al servidor 
$memcache_obj = memcache_connect('memcacheq_host', 21201);
$id_post = memcache_get($memcache_obj, 'tareas_del_blog');
tarea_enorme($id_post);
memcache_close($memcache_obj);

MemcacheQ

Vía / PDPDeveloper.org

Si queremos modificar las búsquedas que ofrece WordPress para que devuelva lo que nosotros queremos tan solo hay que hacer dos funciones para dos filtros:

add_filter('posts_results', 'mi_search');
function mi_search($posts) {
  $s = get_query_var('s');
  if (condicion($s)) {
    $posts = array();
    $paged = intval(get_query_var('paged'));
    if ($paged < 1) $paged = 1;
    $posts_per_page = intval(get_query_var('posts_per_page'));
    $from = ($paged-1)*$posts_per_page;
    global $wpdb;
    $_posts = $wpdb->get_results("select post_id from $wpdb->posts where loquesea order by post_id desc limit $from, $posts_per_page");
    foreach($_posts as $p) {
      $posts[] = get_post($p->post_id);
    }
  }
  return $posts;
}
 
add_filter('found_posts', 'mi_found_posts');
function mi_found_posts($n) {
  $s = get_query_var('s');
  if (condicion($s)) {
    global $wpdb;
    $res = $wpdb->get_results("select count(*) as n from $wpdb->posts where condicion ");
    $n = $res[0]->n;
  }
 
  return $n;
}