Bufa - Recursos para webmasters - Part 2

Bufa Webmaster

Recursos web en español

Date(), cambiar hora actual del servidor

17 Jun 2010

¿Problemas con la hora actual con la función date() de php? Si tenéis un hosting con diferente horario al vuestro es probable que necesitéis utilizar la función putenv de php para actualizar la hora actual al horario actual de vuestro país. ¿Un ejemplo? por ejemplo si escribís un post y la hora de ser escrito no coincide con la verdadera hora actual en tu país.

En este caso vamos a actualizar la hora actual de un hosting (por ejemplo americano) a la hora actual es España añadiendole a la función el parámetro “TZ=Europe/Madrid”.

$hora = time();
 
echo "Hora actual del servidor es: " . date ("H:i, l j F Y", $hora);
 
// Anadir esta función justo ántes de emplear la función date()
putenv("TZ=Europe/Madrid");
 
echo "La hora actual en España es: " . date ("H:i, l j F Y", $hora);

Denunciar una página web a Google

16 Jun 2010

Hay ocasiones en las que nos vemos obligados a denunciar una determinada página web al mismísimo google. ¿Cómo? ¿Por qué? cuando vemos que esa página aparece en los primeros resultados por un determinado “anchor text” y utiliza alguna de las siguiente técnicas oscuras (Black hat seo) para mejorar su posicionamiento:

Técnicas black hat seo:

  • Texto o vínculos ocultos
  • Palabras engañosas o repetidas
  • La página no coincide con la descripción de Google
  • Página encubierta
  • Redireccionamientos engañosos
  • Páginas puerta
  • Sitio o páginas duplicadas
  • Otros…

Google dispone de un formulario https://www.google.com/webmasters/tools/spamreport?hl=es donde podemos especficar la página web a denunciar, así como la técnica que infringe…

Por experiencia google se toma muy enserio estas malas técnicas, y suele hacer caso a estas denuncias por spam… en mi caso han tardado entre 1-3 par de meses en eliminar ciertas páginas web de la competencia que infrigian alguna de las técnicas anteriores.

Texto con borde alrededor en CSS3

16 Jun 2010

Con CSS3 (más concretamente con la propiedad text-stroke)es posible crear un texto con color de fuente y además añadirle un borde alrededor del un tamaño y color determinado. Ántes para conseguir este efecto teníamos que tirar siempre de programas de retoque fotográfico y insertarlo como una imágen en el documento.

EJEMPLO

mi texto con borde

1
2
3
4
5
6
7
8
9
10
<style type="text/css"> 
.textoborde {
  font-size:30px;
  font-weight:bold;
  -webkit-text-fill-color: black;
  -webkit-text-stroke-color: red;
  -webkit-text-stroke-width: 0.75px;  
}
</style>
<span class="textoborde">mi texto con borde</span>

WordPress: Permitir al usuario “colaborador” subir archivos

12 Jun 2010

Si tenéis varios usuarios (de tipo o perfíl “colaborador“) que escriben en vuestro a tu blog e wordpress, es probable que necesitéis algún día que puedan subir archivos o fotos a los post. Esta acción por defecto esta desactivada para este tipo de usuarios (quedando oculto el menú superior del WYSIWYG de wordpress, con los iconos para poder subir imágenes, video, audio o otros objetos…).

Para activar el menu de “subir/insertar” imágenes, video, audio o otros objetos… solo tenemos que editar un poco nuestro archivo functions.php (que se encuentra en la carpeta de nuestro tema):

if ( current_user_can('contributor') && !current_user_can('upload_files') )
    add_action('admin_init', 'allow_contributor_uploads');
 
function allow_contributor_uploads() {
    $contributor = get_role('contributor');
    $contributor->add_cap('upload_files');
}

Vaciar automáticamente la papelera en WordPress

12 Jun 2010

La papelera es una nueva funcionalidad de WordPress 2.9. Cuando un artículo (post, comentarios, etc) es eliminado, va a parar a la papelera en lugar de ser eliminado definitivamente. Ahora bien, ¿cómo podemos hacer para vaciar la papelera automáticamente cada un número determinado de días (o eliminar todos los elementos que contenga)?

Solo tenemos que editar el archivo wp-config.php (que se encuentra en el raíz de tu WordPress) y pegar el siguiente código php:

define ('EMPTY_TRASH_DAYS', 10);

El segundo parámetro (en este caso hemos puesto “10″) es el número de días que han de transcurrir para vaciar la papelera.

Google fuentes

24 May 2010

Uno de los problemas más habituales que nos encontramos al desarrollar una página web viene a la hora de querer utilizar una determinada fuente (de las no habituales Arial, Verdana, etc…) que no viene por defecto en nuestro sistema operativo. Hasta que CSS3 sea admitido por la mayoría de navegadores podemos usar su defecto imágenes, javascript (cufon, sifr, etc…).

Ahora google ha desarrollado una nueva API de fuentes. Todas las fuentes en el directorio están disponibles para ser usados en su sitio web en virtud de una licencia de código abierto y servido por los servidores de Google.

Su instalación no puede ser más sencilla; basta con insertar en el head la etiqueda de estilo de la fuente en cuestión y en nuestro css llamar a dicha fuente por medio de font-family como podemos ver en el siguiente ejemplo:

<html>
  <head>
    <link rel="stylesheet" type="text/css" href="http://fonts.googleapis.com/css?family=Tangerine">
    <style>
      body {
        font-family: 'Tangerine', serif;
        font-size: 48px;
      }
    </style>
  </head>
  <body>
    <h1>Ejemplo de fuente Tangerine de Google</h1>
  </body>
</html>

Directorio de fuentes: http://code.google.com/webfonts
API Google fonts : http://code.google.com/intl/es-ES/apis/webfonts/docs/getting_started.html

Proteger carpetas con contraseña con .htaccess y .htpasswd

23 May 2010

Para proteger una/s determinada carpeta de nuestro hosting con un usuario y contraseña podemos utilizar estos 2 archivos (.htaccess y .htpasswd) que debemos crear en nuestro site.

Configuración del .htaccess:

  • AuthUserFile: aquí debemos incluir la ruta completa (por ejemplo: /home/public_html/midominio.com/.htpasswd) donde se encuentre el htpasswd en nuestra web, para conocer la ruta de tu hosting puedes utilizar esta función en php: echo dirname(__FILE__);
  • AuthName: aquí podemos poner el nombre que queramos, teniendo cuidado que no tenga espacios entre palabras.
  • AuthType: aquí lo dejamos como esta (Basic)
  • require user: aquí insertamos el nombre de nuestro usuario (en este caso se llamará “miusuario”)
# ESTE ES UN EJEMPLO DE .htaccess
AuthUserFile /ruta_completa_hosting/.htpasswd
AuthName MiAccesoPrivado
AuthType Basic
require user miusuario

Configuración del .htpasswd:
Este archivo guarda el usuario y clave de la siguiente forma. usuario:contraseña
Como veis la clave esta encriptada, para ello podeis utilizar alguna de las herramientas online (por ejemplo esta) para generar la clave del htpasswd.

# ESTE ES UN EJEMPLO DE .htpasswd
miusuario:$apr1$ws8GS/..$OyfS0gDep/UgN4YPKMGIp0

Afrobeat font

22 May 2010

Los chicos de resistenza han desarrollado una magnífica tipografía donde los ritmos tribales de la música afrobeat se expresan a través de esta nueva fuente de marca psicodélica, llamada afrobeat. Cada letra se convierte en arte como cada letra está elegantemente colocada una al lado de la otra, como notas musicales, creando música para los ojos.

El afrobeat es un estilo musical interpretado por muchos artistas africanos como Fela Kuti, Femi Kuti, Antibalas y muchos más, una fusión de jazz, funk, y rock psicodélico, originarios de los años 60 y se basó en los movimientos políticos de Nigeria.

La fuente es perfecta para cuando necesites utilizar llamativos textos grande para cualquier cosa, desde carteles y folletos para conciertos, eventos, fiestas, para carátulas de CD, anuncios, y el arte, pero es especialmente llamativo para los proyectos impresos.

http://www.resistenza.es/afrobeatfont/

Reproductor de video html5 con jQuery

22 May 2010

JW Player es un reproductor de video con soporte para HTML5. Esta basado en jQuery y una de sus mejores característicvas es que funciona perfectamente con los navegadores que actualmente no soportan HTML5 ya que al detectar un navegador no compatible con esta tecnología (html5), muestra el player del reproductor Flash.

<script type="text/javascript" src="/scripts/jquery.js"></script>
<script type="text/javascript" src="/scripts/jquery.jwplayer.js"></script>
<script type="text/javascript">
  $('#player').jwplayer({
    flashplayer:'/files/player.swf',
    skin:'/files/five.xml'
  });
</script>
<video height="270" id="player" poster="/files/bunny.jpg" src="/files/bunny.mp4" width="480"></video>

Fuente:
http://www.longtailvideo.com/support/jw-player

Comprimir código fuente html con PHP

16 May 2010

Vamos a ver una función en php muy interesante si queremos reducir el peso de nuestras páginas web, eliminando espacios en blanco innecesarios en nuestro código html final. Quedándonos nuestro código fuente final limpio de espacios en blanco innecesarios, tabulaciones, etc…

En la función se utilizan expresiones irregulares, pero debemos tener cuidado con ella ya que consumen bastantes recursos en el servidor, pero si las utilizamos por ejemplo para para subir el contenido bienen muy bien.

<?php 
//habilitamos el uso de búferes de salida
ob_start('comprimir_pagina'); 
?>
<html>
<head>
<title>Mi web</title>
</head>
 
<body>
 
    <div>
        Realizamos un par de tabulaciones
    </div>
 
</body>
</html>
<?php
// Una vez que el búfer almacena nuestro contenido utilizamos "ob_end_flush" para usarlo y deshabilitar el búfer
ob_end_flush(); 
// Función para eliminar todos los espacios en blanco
function comprimir_pagina($buffer) { 
	$busca = array('/\>[^\S ]+/s','/[^\S ]+\</s','/(\s)+/s'); 
	$reemplaza = array('>','<','\\1'); 
	return preg_replace($busca, $reemplaza, $buffer); 
} 
?>

Resultado del código fuente final:

<html><head><title>Mi web</title></head><body> <div> Realizamos un par de tabulaciones </div></body></html>
Bufa en Twiter

77 post | 40 comentarios | 110 tags | suscriptores

Acerca de

bufa.es es una página web montada sobre wordpress que tiene como finalidad compartir la mayoría de recursos web (scripts, php, css, jquery, wordpress, plugins, posicionamiento web, etc...) utilizados por mi en el desarrollo web.

Entries (RSS) | Comments (RSS)

© 2010 Bufa Webmaster | valid XHTML and CSS | Powered by Wordpress and design bufa