ver y aparecer: febrero 2013

martes, 5 de febrero de 2013

Edición del formato de un textarea en HTML con TinyMce

Buenas a tod@s!!!

Hoy traigo una solución fácil, rápida y bonita para que el usuario pueda editar un textarea de nuestra web como si se tratara de un de un fichero de Word, para luego poder guardarlo y mostrarlo; es el TinyMce, una librería basada en JavaScript y HTML.

Varios ejemplos para los que nos vendría bien utilizar esta plataforma es:
En foros, para la gente edite el formato de sus mensajes.
En esta misma entrada que estoy escribiendo la cual puedo modificar la fuente como me apetezca sin saber de HTML ni CSS.
En una tienda online para hacer una descripción bonita de los productos.
(...)

Vamos con unas nociones básicas para empezar a utilizar el tinymce lo más rápido y de la manera más fácil:

Lo primero es descargarnos la librería, nos bajamos la versión más reciente aquí. Y lo ponemos en la carpeta dónde trabajaremos.

Seguidamente creamos un fichero HTML, para ver el editor de textarea, dónde copiaremos el siguiente código (el código es casi el mismo que la web de tinyMce):

tinyMCE.html

Creamos ahora otro archivo, este .PHP, dónde recogeremos por POST el texto con formato que ha elaborado el usuario y lo mostraremos.

tinyMce_post.php

<?php
if ($_SERVER["REQUEST_METHOD"] == "POST") {
var_dump($_POST["content"]);
echo $_POST["content"];
}
?>

lunes, 4 de febrero de 2013

Como hacer un buen scrolling (JQuery)

Buenas a tod@s!!

Hoy vamos a ver como hacer un scrolling de manera bonita, sin que el usuario quede desubicado y no sepa donde está.

Primero veamos como se hace el scrolling tradicional en javascript (el que te desmonta cuando estás navegando y le das)

<html>
<head>
<script>
function scroll() {
window.scrollBy(0,50);
}
</script>
</head>
<body>
<a href="#" onclick="scroll(); return false;">scroll down</a>

</body>
</html>

La función scrollBy hace un scroll en las coordenadas x e y respectivamente.
Lógicamente si ejecutáis este código no habrá mucho con lo que hacer scroll, llenad la página de texto o saltos de línea para comprobarlo.

Ahora vamos a utilizar JQuery para hacer un scroll bonito, esté bajará suavemente permitiendo una mejor experiencia para el usuario.

<html>
<head>
<script src="http://code.jquery.com/jquery-latest.js"></script>
function scroll() {
$.scrollTo($("#abajo"), 1000, {axis:'y'});
}
</script>
</head>
<body>
<a href="#" onclick="scroll(); return false;">scroll down</a>
<br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/>
<p id="abajo"> Bajar aquí </p>
</body>
</html>

Con la función scrollTo, lo que hacemos es situar el scroll en la id que seleccionamos en el primer parámetro, con un retardo (animación) de 1000 ms (2º parámetro), y afectando al eje y que seleccionamos en el tercer parámetro.

sábado, 2 de febrero de 2013

Sessions y cookies en PHP (Parte 2: Cookie)

Eyyy! buenas a tod@s!!!
Hoy traigo la segunda parte de las sessions y cookies, concretamente tocarán las segundas!!!

Ayer hable sobre lo que hacían cada una, así que iré al grano y comenzaré a explicar como se utilizan las cookies.

Lo primero es definir las cookies:

cookie.php

<?php
setcookie("nombre", "Pepe", time()+3600);
setcookie("apellido", "Botella", time()+3600);
?>

<a href="ver_cookie.php"> Ver cookie </a><br/>
<a href="eliminar_cookie.php"> Eliminar cookie </a>

Vemos que se han creado dos cookies una con el nombre del usuario y la otra con el apellido, la duración de ambas es de una hora (el tiempo actual + 3600 segundos).
Es importante destacar que no se puede mostrar la cookie nada más crearla, como vemos a continuación:

cookie_no_funciona.php

<?php
setcookie("nombre", "Pepe", time()+3600);
setcookie("apellido", "Botella", time()+3600);
echo $_COOKIE["nombre"]." ".$_COOKIE["apellido"];
?>

Esto no funcionaria a menos que la cookie se hubiera creado anteriormente (dónde visualizaremos la cookie anterior y no la que acabamos de crear).
Para visualizarla debemos hacer un link como el que tenemos arriba, "ver cookie" y acceder en él.

ver_cookie.php

<?php
echo $_COOKIE["nombre"]." ".$_COOKIE["apellido"];
?>

Aquí ya podremos visualizar la cookie.

Para eliminar una cookie, el método es un poco feo en mi opinión, basta con darle un tiempo que ya haya pasado para que esta expire y de ese modo se borre.

eliminar_cookie.php

<?php
setcookie("nombre", "Pepe", time()-3600);
setcookie("apellido", "Botella", time()-3600);
?>

Le asignamos el tiempo una hora antes y la cookie desaparece.

Hasta aquí una breve introducción de las cookies en PHP, alguna duda o sugerencia, comentad!

Saludos!!!

viernes, 1 de febrero de 2013

Sessions y cookies en PHP (Parte 1: Session)

Buenas a tod@s!!!

Hoy traigo un pequeño tutorial sobre como identificar un usuario que se conecte a nuestra página web.
Lo dividiremos en dos partes, hoy emplearemos las variables de session y mañana lo haremos con cookies.

Para los que ven por primera vez las palabras session y cookies, vamos a introducir brevemente estos conceptos:
Los dos sirven, como hemos comentado antes, para identificar un usuario que visita nuestra plataforma web;
la diferencia entre ambos reside principalmente en que la cookie se almacena en el navegador del cliente mientras que la session se almacena en el servidor de la página.

Vamos con el código:

Para definir una session:

index.php

<?php
session_start();
$_SESSION["nombre"]='Pepe';
$_SESSION["apellido"]='Botella';
echo "<a href='ver_cookie.php'>Ver cookie</a>";
?>

Es importante que la función session_start esté antes del código html.

Para comprobar que funciona correctamente vamos a crear otro php que accederemos desde el link anterior.

ver_cookie.php

<?php

session_start();

echo $_SESSION["nombre"]." ".$_SESSION["apellido"];

Para destruir la session basta con que el usuario deje de hacer peticiones a nuestra página durante un tiempo determinado o utilizar el siguiente código:

<?php
session_start();
if(isset($_SESSION['nombre']) && isset($_SESSION['apellido'])){ unset($_SESSION['nombre']);
unset($_SESSION['apellido']);
}

O este otro método para eliminar toda la información asociada con la sesión actual:

<?php
session_destroy();
?>

Nos vemos!!!