Para poner WordPress en modo mantenimiento, cuando actualizamos el theme o plugins y nos va a llevar un tiempo, o en otra ocasión, tan solo tendremos que crear un fichero con nombre .maintenance en el raíz de WordPress.
Si además queremos mostrar un HTML específico, podemos crear el fichero /wp-content/maintenance.php que se cargará si existe.
Actualización 12/02/2015
El fichero .maintenance debe tener definida la variable $upgrading con un timestamp, según dice el código de WordPress, con el valor del momento en el que el fichero fue creado, pero luego viendo el código comprueba que hayan pasado 10 minutos. Yo en mi caso le he asignado el valor de time() y ya borraré yo el fichero cuando haya acabado.
Uno de los aspectos más complicados para aquellos que empiezan dentro del diseño web es la realización de pestañas (tabs). Si necesitas una ayuda para generarlos, puede venirte bien esta clase PHP que con unas simples líneas de código podrás obtener unas pestañas con un resultado más que decente.
Tan solo habrá que ejecutar el siguiente código y se incluirán en tu HTML las etiquetas necesarias para mostrar los tabs, los cuales pueden ser activos, seleccionados y desactivados.
Redimensionar imágenes con PHP es algo de lo que se ha hablado mucho, y no voy a contar nada nuevo, pero el tutorial que enlazo me parece bastante bueno y sencillo y nos puede ahorrar el crear los métodos nosotros mismos, porque no suele ser tan sencillo como hacer un resize, sino que a veces es necesario ajustar a un tamaño en particular y si son de diferentes aspect ratio pues entonces hay que pensar si dejar espacio neutro en los laterales o arriba/abajo.
Lo único que no me gusta es que para abrir la imagen se fija en la extensión del fichero, cuando puede usarse otro método y así podremos abrir la imagen que sea, por ejemplo desde una URL.
Uno de las cosas que no me gustan de WordPress es la costumbre de añadir las clases a los elementos basados en el ID del mismo y no en su slug. Esto ocurre en todo, pero en este caso es con la lista de categorías generadas por wp_list_categories, devolviendo un HTML parecido a este:
Si queremos indicar estilos específicos para estas categorías, por ejemplo para añadir un icono a cada categoría, no nos sirve el class basado en ID, porque nos encontramos con que dependiendo de cuando se genere esta categoría, habrá que cambiar el css, siendo más lógico obtener un código como este:
JSON es un formato de datos de intercambio de Javascript que el auge de AJAX ha hecho muy popular. En javascript es mucho más cómodo trabajar con JSON frente a XML ya que podemos analizarlo rápidamente utilizando eval().
Cuando queremos trabajar con API´s como las de Amazon, Technorati, del.icio.us o Ficrk vía REST nos encontramos con que todas ellas devuelven los datos en XML. Gracias a PHP5 y utilizando sus extensiones DOM y XSL podemos transformar un documento XML en JSON de forma muy sencilla.
Veamos un ejemplo de cómo hacer esto con una consulta a la API de Technorati:
En primer lugar vamos a componer la URL con la que haremos nuestra consulta:
Y ahora creamos un nuevo objeto DOM y cargamos nuestro el fichero XML que nos devuelve la consulta:
$inputdom = new DomDocument();
$inputdom->load($request);
Para transformar los datos utilizaremos un xml2json.xsl, un fichero XSLT que tiene las instrucciones para transformar XML en JSON. Lo cargamos en un nuevo objeto DOM:
$xslt = "xml2json.xsl";
$xsl = new DomDocument();
$xsl->load($xslt);
Hace bastante que no escribía, sobre todo por falta de tiempo, pero quería escribir sobre este pequeño truco de WordPress. Cuando añadimos una imagen destacada en un post de WordPress nos podemos encontrar con que la imagen ocupa todo el ancho (lo más normal) o que no ocupa tanto, con lo que nos encontramos que la imagen queda muy sola y el diseño queda feo.
Para solucionar esto, deberemos añadir un filtro, comprobar el tamaño de la imagen y el del ancho del contenido y en el caso de que creamos que es conveniente (por ejemplo la mitad del ancho del contenido) añadir una clase a la imagen:
function mi_post_thumbnail_html($html) {
// Se suele recomendar definir la variable $content_width para ocasiones como esta
global $content_width;
preg_match('#width="([^"]+)"#', $html, $s);
if (isset($s[1]) && $s[1] < $content_width/2) {
preg_match('#class="([^"]+)"#', $html, $c);
if (isset($c[1]) && strpos($c[1], "right") === FALSE) {
return str_replace('class="'.$c[1].'"', 'class="'.$c[1].' right"', $html);
}
}
return $html;
}
add_filter('post_thumbnail_html', 'mi_post_thumbnail_html');
WordPress 3.4 ha añadido la opción de theme customizer, la cual permite modificar las opciones del theme y darle el aspecto que deseas de forma muy visual y sencilla. En estos momentos, por lo que he podido ver, solo permite modificar el background y poco más. Pero viendo y pegándome con el código he podido ver cómo añadir mis propias opciones.
El ejemplo que voy a poner permite elegir entre tres tipos de fuente de Google Webfonts y modificar las css para usar ese tipo de letra.
Aviso que el código quizás no sea el mejor, pero realizar ingeniería inversa no siempre es fácil y tampoco he visto otro sitio donde lo hagan.
Lo primero que se tiene que hacer es crear las opciones en el panel de customizer. Para ello hay que crear una sección (section “Fuente”) y asignarle unas opciones (settings) y añadirle unos controles (control) a las opciones. Existen controles por defecto, el de elegir el color está muy bien, pero en mi caso me he creado uno personalizado que muestra un control radio modificado para que el label del radio muestre la tipo de letra en cuestión.
add_action('customize_register', 'mi_theme_customizer', 1);
function mi_theme_customizer() {
global $customize;
if($customize) {
// La seccion
$customize->add_section('mi_font', array(
'title'=>'Fuente'
) );
// La opcion
$customize->add_setting( 'mi_font_family', array(
'control' => 'color', // esto ni idea de para que sirve, realmente no es un control tipo color y funciona
'type' => 'option'
) );
$customize->add_control( 'mi_font_family', array(
'settings' => 'mi_font_family',
'section' => 'mi_font',
'type' => 'font_radio',
'choices' => array('Trocchi', 'Great Vibes', 'Bad Script') // las fuentes de google
) );
}
}
Una vez creado los controles, añado el código que dibuja (render) mi control personalizado, primero añado los css para que dibuje las fuentes de Google y luego dibujo el control en sí. He usado Javascript en vez de PHP porque parece ser que el código no está del todo completo, y no hay un filtro para crear tu propio control, por lo que tengo que añadirlo mediante jQuery a un elemento para que el Javascript del customizer tenga en cuenta cuando selecciono una opción y refresque el preview del theme.
// Añado los css de google webfonts mediante javascript para tener luego el nombre de las fuentes y usarlo para crear los radio buttons
add_action('customize_controls_print_scripts', 'mi_customize_scripts');
function mi_customize_scripts() {
$fonts = array('Trocchi', 'Great Vibes', 'Bad Script');
?>
type == 'font_radio') {
if ( empty( $control->choices ) )
return;
$name = '_customize-font-radio-' . $control->id;
?>
label ); ?>
Y ya por último solo falta usar la opción guardada para mostrarla en el theme
add_action('wp_head', 'mi_custom_styles');
function mi_custom_styles() {
$option = get_option('mi_font_family');
// El customizer modifica este filtro para refrescar el preview
$option = apply_filters('option_mi_font_family', $option);
if ($option) {
echo "";
echo '';
}
}
Y esto es todo, no sé si hay una forma mejor de hacerlo, estoy abierto a sugerencias.
vaya, no tenÃa ni idea de esto. normalmente aconsejan hacerlo con un plugin, pero qué duda cabe que esta forma es mucho más rápida y limpia. gracias.