lunes, 24 de abril de 2017

lunes, 17 de abril de 2017

Mobincube, creación de una App gratuita

Vamos a crear una App totalmente gratuita en Mobincube. Para ello lo primero que haremos será registrarnos y darle a crear App. Después podremos modificarlo a nuestro gusto usando diferentes plantillas o colores. Podemos inventar un nuevo bar o restaurante o simplemente hablar de nuestro bar favorito, añadiendo información sobre él o imágenes para que sea más atractivo.


Podemos inventar un nuevo bar o restaurante o simplemente hablar de nuestro bar favorito, añadiendo información sobre él o imágenes para que sea más atractivo.


Una vez creada la aplicación añadimos hacemos una captura de pantalla para tener nuestro código QR y lo subimos a nuestro blog en un Gadget.


martes, 4 de abril de 2017

Mockup

Creamos una interfaz con Pidoco para la Semana Cultural del CUM. Entramos en la página Pidoco y nos registramos. Una vez registrado ya podemos realizar nuestro calendario para la Semana Cultural.

Para empezar a personalizar nuestra página arrastramos hasta la pantalla lo que queramos ir poniendo (texto, imágenes, gráficas...) También podemos darle el color que más nos guste al texto que pongamos.

El resultado final de nuestro calendario para la Semana Cultural es este:


Cuando hemos terminado exportamos nuestro código HTML a nuestro Index.html y así se añadirá a nuestro blog.

sábado, 25 de marzo de 2017

Audio y vídeo con YouTube y Soundation

Ambos son gratuitos y bastante fáciles de usar. Tienen infinidad de audios (Soundation) y vídeos (YouTube) y pueden quedar resultados muy atractivos.

Para empezar nos metemos en la página de Soundation y nos registramos con nuestra cuenta de Google+, p. ej. A continuación accedemos a Studio y ahí podremos hacer "magia". Cada persona puede hacer un ritmo-canción totalmente diferente, el mezclar los sonidos es bastante divertido.


Cuando hemos terminado de crear nuestra BSO para el Blog, le damos a Share y copiamos el HTML para colocarlo en un Gadget.

Para crear un vídeo en YouTube tendremos que hacernos una cuenta (nos servirá la de la universidad) y después nos valdrá con editar un par de vídeos. Podemos unir vídeos, colocar música, ponerle transiciones e incluso títulos o letras de las canciones. Lo personalizamos a nuestro gusto.



Para terminar copiamos el código HTML y lo volvemos a pegar a un Gadget.

Los resultados finales podréis verlos al final del Blog y a la derecha de este.

Bootstrap

Vamos a crear una página nueva con HTML, después haremos una pequeña modificación como es subir una imagen.

Para empezar nos descargamos un Bootstrap gratuitamente, a continuación tendremos 3 archivos con los siguientes nombres: CSS, FONTS y JS.
Nos vamos a ejemplos y elegimos la página que más nos guste, yo he elegido esta:



Cuando tengamos guardada la plantilla y elijamos lo que queremos cambiar hacemos click con el derecho e inspeccionamos, esto nos dará el código HTML de lo que posteriormente cambiaremos.
Abrimos la página descargada con Blog de notas y buscamos el código que vamos a cambiar, yo he nombrado a mis foto: 1/2/3.jpg. Estas son las imágenes:


Sustituimos el código por el nuevo nombre de la imagen:


Y ya podríamos ver la modificaicón desde nuestra página web creada en Bootstrap.

Resultado final: Bootstrap-HappyHome


jueves, 16 de marzo de 2017

Archivo JavaScript

Creamos un archivo .js y lo llamamos Javascript, este lo subiremos a Hostinger con lo siguiente: 

En el archivo HTML que habíamos subido en las prácticas anteriores, tenemos que colocar los botones correspondientes para las funciones que hemos creado para el JavaScript. 

Estas funciones nos abrirán ventanas a los 5 minutos de haber entrado en la página, nos darán la bienvenida e incluso nos saludarán, entre otras funciones. También podemos hacer click en "Hazme click!" y nos redirigirá a la página principal de nuestro blog.


Estos son algunos de los ejemplos.

lunes, 6 de marzo de 2017

Modificando con JavaScript

Anteriormente habíamos creado dos archivos (HTML y CSS) que subiríamos a la cuenta creada en Hostinguer; estos dos archivos crearían un acceso a nuestro espacio personal desde nuestro blog. 
A continuación creamos otro archivo CSS que llamaremos final3.css, modificamos los colores* (por ejemplo), aunque podríamos cambiar el estilo de fuente. Cuando hemos subido el archivo a Hostinguer haremos una serie de cambios en el archivo HTML que habíamos subido anteriormente. 
Añadimos un identificador al final de <link href="final.css" rel="stylesheet" type="text/css">, solo poniendo: id="estilo"

Colocaremos por encima de <head>:

<script type="text/javascript" language="JavaScript">
function cambio(archivo){
document.getElementById("estilo").href= archivo;
}
</script>

Esto hará que haya una opción que cambia nuestro espacio personal y para ello necesitaremos también "botones" que nos lo indiquen y tendremos que colocarlos justo debajo de la etiqueta <body>

<button type="button" onclick="cambio('final3.css')">¡Cambio de estilo!</button>

<button type="button" onclick="cambio('final.css')">¡Vuelta al inicio!</button>

En nuestro caso se llamarán así, pero podemos personalizarlo a nuestro gusto.

Resultado final:
Inicio:
Cambio:
*http://www.color-hex.com/