Entradas con la etiqueta html

Manual de PHP: Conceptos Básicos PHP 1

Lo primero de todo recordaros que estos post están enfocados para gente que hace poco que se ha introducido en el lenguaje HTML y también quiere hacerlo en PHP, así que intentaré seguir un lenguaje muy sencillo y aplicando ejemplos de forma que sea muy fácil de entender.

 

Introducción PHP

Los documentos PHP se interpretan en el servidor, generando una página HTML que será enviada al cliente, el cual podrá visualizarla en su navegador.

 

Si programamos localmente necesitaremos acceder  a nuestro servidor, lo más común es que accedamos a nuestro servidor mediante la dirección http://localhost o http://127.0.0.1 ya que esto depende de la configuración del servidor web.

Previamente necesitamos haber instalado un servidor web en nuestro ordenador, os pongo la dirección a WAMP, un paquete que incluye Apache, PHP5, MySQL, PHPMyAdmin, SQLiteManager y un interface para la barra de notificaciones del sistema.

Wamp (Versión para Windows)
http://www.wampserver.com/en/download.php

Mamp (Versión para Mac)
http://www.mamp.info/de/downloads/index.html

Lamp (Versión para Gnu/Linux)
http://www.apachefriends.org/en/xampp-linux.html

Primer Script php:

El código PHP se integra dentro del HTML, con la ventaja de que además de permitirnos programas e interactuar con bases de datos, el usuario verá solamente el código HTML.

En este primer ejemplo vemos que como usamos “<?php” para indicar el inicio de la etiqueta PHP. Después indicamos la sentencia y abandonamos el modo PHP usando “?>”

Lo que haremos en este primer ejemplo es mostrar: Hola Mundo usando la sentencia echo()

<html>
 <head>
  <title>Primer PHP</title>
 </head>
 <body>
  <?php echo "Hola Mundo"; ?>
 </body>
</html>   

En el caso de estar utilizando WAMP tendremos que guardar la página dentro de C:wampwww , para tenerlo más ordenado os recomiendo generar una carpeta por cada sitio web. Una vez guardada tenéis que visualizarla desde http://localhost .
No borréis el index que ya hay, este os permitirá acceder a las carpetas de forma más cómoda.

Comentarios:

Abajo tenéis un ejemplo en el que usamos varios tipos de comentarios.

<?php
    echo "Esto es una prueba";
    // comentario de una sola línea
    /* comentario multilínea
       simplemente otro tipo de comentario */
    echo " Ejemplo de PHP ";
    # comentario de una sola línea
?>

Acordaros de visualizar desde http://localhost

Variables:

Una variable es un espacio que se reserva en la memoria para almacenar datos.
En PHP las variables empiezan por el símbolo $ y no es necesario definirlas antes de usarlas, también carecen de tipo.
Para la inicialización de una variable se utiliza el signo de igual ( = )
Entre otras cosas, más adelante veremos como empleamos las variables para asignar valores enviados desde un formulario e insertarlos, borrarlos y actualizarlos en una base de datos.

Ejem1:

<html>
<head>
   <title>Ejemplo de variables</title>
</head>
<body>
<?php
   $a = 1; // asignamos un valor numérico (sin comillas)
   $b = “Hola”; //asignamos un valor alfanumérico (entre comillas)
   echo $a,"<br>",$b; // Mostramos las variable con el commando echo, también fijaros que combinanos PHP con un salto de línea de HTML <br>
?>
</body>
</html>

Ejemp2:

<html>
<head>
   <title>Ejemplo de variables</title>
</head>
<body>
<?php
   $a = $_POST["nombre"]; // en este caso no asignamos el valor directamente, sino que viene de otra página mediante un formulario, lo veremos más adelante
    echo $a;
?>
</body>
</html>

Acordaros de visualizar desde http://localhost

Artículos anteriores:

 Manual de PHP

 

Etiquetas: , , , , , , , , , , ,

De HTML a PDF/Imagen

En ocasiones habreis tenido problemas para realizar una captura de pantalla de alguna web porque necesitais visualizarla completamente, para imprimir, para estudiarla etc.

He encontrado varias utilidades a la hora de hacer los "pantallazos" en una pagina Web.

La 1ª es un complemento del navegador Mozilla Firefox llamado: iimmgg.

Lo podreis descargar desde aqui:

https://addons.mozilla.org/es-ES/firefox/addon/8290

Cuando lo tengais instalado os recomiendo poner el complemento en la barra de herramientas del navegador.

Para ello debereis realizar lo siguiente:

  1. Barra de menu -> Herramientas -> Complementos.
  2. Pulsar el boton que pone "Extensiones".
  3. Busca el complemento iimmgg.com Tools y seleccionalo.
  4. Pulsa en el boton que pone Opciones
  5. En la primera frase donde pone:  Quieres poner un boton de captura en la barra de herramientas. Seleciconais que Si.
  6. A jugar.

Cuando tengais el boton en la barra de herramientas, ya podreis realizar capturas de pantalla de la pagina entera, Pagina visible o de un area determinada por vosotros. Una vez realizada la captura os saldra una ventana, teneis que presiona en: Capturar y Grabar en disco.

La 2ª forma de realizar esto,  para mi es la mas comoda, es a partir de una Web muy sencilla en la que te captura toda la pagina y te crea un pdf.
Podeis hacer una prueba a partir de este enlace:

http://html-pdf-converter.com/convert.php?u=creativethings.es&x=0&y=0

 

Espero que estas utilidades os ayuden. A mi ,me han ayudado mucho a la hora de presentar Webs en algun Power Point,  para imprimirlas, enseñarlas etc.

Un saludo.

Etiquetas:

Galería de imágenes que se desplaza con javascript

Os adjunto una galería de imágenes en capas con javascript, bastará con pulsar encima de las flechas y se desplazará solo.
Si queréis que haga algún comportamiento al pulsar encima de cada una de las imágenes ya es cosa vuestra.

Leer el resto de esta entrada »

Etiquetas: , ,

Personalizar el scroll de las capas

Hola, os adjunto un zip en el que encontraréis un ejemplo sencillo para personalizar el scroll de las capas, dentro hay la página HTML, el Javascript el CSS de la capa y del scroll.

Espero que os sirva.
Un saludo.

Etiquetas: , ,

Centrar capas desde CSS

hola, os paso el código para alinear las capas tanto vertical como horizontalmente. 
#centrado { position: absolute; /*Posicionamiento absoluto*/ top: 50%; /*Desde arriba, colocar al 50% de la pantalla*/ left: 50%; /*Desde la izquierda, colocar al 50% de la pantalla*/ height: 400px; /*Le ponemos el valor del alto*/ width: 500px; /*Le ponemos el valor del ancho*/ margin-top: -200px; /*Restamos la mitad de alto para centrarlo verticalmente*/ margin-left: -250px; /*Restamos la mitad de ancho para centrarlo horizontalmente*/ background-color: #00FF00; /*Color de fondo para distinguir la capa*/}

Leer el resto de esta entrada »

Etiquetas: ,

Se busca Diseñador/Programador CSS

Letras CSSDe nuevo una oferta de empleo. Parece que en el momento que vivimos el oficio de desarrollador sigue siendo necesario. Supongo que la crisis favorecerá a los que estén mejor capacitados y lo pondrá mas difícil a los que hasta ahora se han podido permitir el lujo de trabajar en el sector sin una formación sólida.

Leer el resto de esta entrada »

Etiquetas: , , ,

Edib colabora con ACABB (Asociació contra l’anorèxia i bulimia de balears).

Logotipo ACABB

Hace unos meses Linda Pieri, tesorera de la asociación ACABB, se puso en contacto con la escuela Edib y nos propuso crearles una página web para ellos. Nos pareció una idea muy interesante a la vez que altruista.

Leer el resto de esta entrada »

Etiquetas: , , ,

Arranque del curso de creación web

Hola, soy Paco Blaya, uno de los profesores de informática de la escuela Edib. La asignatura que imparto es la de creación de páginas web, además de ser un mundo que me parece muy atractivo ya que combina a la perfección diseño y programación, también tiene una gran salida laboral, y a menudo te da la opción de trabajar como freelance añadiendo unos cuantos eurillos a tus arcas. Prueba de ello es que dos de los alumnos que tenía el año pasado ya fueron capaces de sacar beneficios de lo aprendido en clase antes de acabar el primer cuatrimestre, creando sendas páginas web y cobrando un dinerillo extra por ellas.

Por si os puede interesar os pasa el temario que imparto.

Un saludo.

Leer el resto de esta entrada »

Etiquetas: , ,