Unidad 9: Diseño y presentación de páginas web.

UNIDAD 9 DISEÑO Y PRESENTACIÓN DE PÁGINAS WEB
TAREAS: DAMOS EN EL SIGUIENTE ENLACE


TEORÍA: BLOGS Y BITÁCORAS

SEGUIREMOS EL SIGUIENTE ENLACE

 1.LA HISTORIA DE LOS BLOGS 

tutorial Blogger 1 parte

tutorial blogger 2 parte 




TUTORIAL BLOGS EN WORDPRESS




APUNTES WORDPRESS 

MANUAL CREAR BLOG WORDPRESS


Como hacer blogs en blogger primeros pasos


CÓDIGOS QR

Se pueden conseguir códigos qr en imágenes de casi cualquier cosa, texto, url, redes sociales, email, ubicación etc... para ello según la explicación que di tendremos que hacer dos cosas:

1.Acceder a una página de creación de códigos
c)http://www.qrcode.es/es/generador-qr-code/
2.Descargarnos en nuestro dispositivo móvil una app de escaneo de códigos qr
1.barcode
2.qr code reader
3.qr droid code scanner


Para poner botones paypal en tiendas online

entramos en nuestra cuenta paypal

vamos a preferencias del vendedor en la parte de la izquierda

y nos fijamos en la opción botones pay pal damos a la opción cambiar crear nuevo botón rellenamos todas las opciones tal y como queramos y damos a crear botón, esto nos genera un código html que pegamos en el sitio donde queramos hacer la venta.



2.PARTE DISEÑOS Y PÁGINAS WEB 

a)HTML
b)JOOMLA


Seguiremos puntualmente las explicaciones del profesor donde aprenderemos también programación HTML

CURSO HTML
Siguiendo este curso y las explicaciones del profesor podremos dar solución a algunas cuestiones de programación en HTML

EN ESTA SECCIÓN PONDREMOS DIFERENTES CÓDIGOS HTML QUE NOS PUEDEN VENIR BIEN PARA MEJORAR NUESTRO BLOG, SI ENCONTRÁIS ALGUNO BUENO PODÉIS COMUNICARLO AL PROFESOR Y PASARLO POR EMAIL

1.Poner Texto 2 Columnas o texto e imágenes

 <div style="padding: 10px; float: left; width: 45%; text-align: justify;">Texto de la columna (lado izquierdo)</div><div style="padding: 10px; float: right; width: 45%; text-align: justify;">Texto de la columna (lado derecho)</div>

2.imagen en dos columnas
 
<div style="padding: 10px; float: left; width: 45%; text-align: justify;"><img style="margin: 0px; float: left;" src="URL de la imagen" alt="Trucos blogger” border="0" />Texto de la columna (lado izquierdo)</div><div style="padding: 10px; float: right; width: 45%; text-align: justify;">Texto de
la columna (lado derecho)</div>




Código para enlazar una imagen

<a href="AQUÍ SE PONE EL ENLACE DONDE QUERÁIS QUE SEÑALE LA IMAGEN"><img src="AQUÍ PONÉIS LA URL DE LA IMAGEN DONDE LA TENÁIS SUBIDA" / /></a>


Código para hacer un slide

<marquee scrolldelay="50" scrollamount="10" direction="right" loop="infinite" onmouseout="this.start()" onmouseover="this.stop()"><a href="AQUÍ PONÉIS DONDE QUERÁIS QUE SE ENLACE LA IMAGEN" target="_blank"><img title="PORTADA" alt="PORTADA" src="AQUÍ PONÉIS LA URL DE LA IMAGEN EN CUESTIÓN" height ="300px" width="1000px"/></a>

Podéis repetir la secuencia tantas veces como imágenes queráis poner

<marquee scrolldelay="50" scrollamount="10" direction="right" loop="infinite" onmouseout="this.start()" onmouseover="this.stop()"><a href="AQUÍ PONÉIS DONDE QUERÁIS QUE SE ENLACE LA IMAGEN" target="_blank"><img title="PORTADA" alt="PORTADA" src="AQUÍ PONÉIS LA URL DE LA IMAGEN EN CUESTIÓN" height ="300px" width="1000px"/></a><marquee scrolldelay="50" scrollamount="10" direction="right" loop="infinite" onmouseout="this.start()" onmouseover="this.stop()"><a href="AQUÍ PONÉIS DONDE QUERÁIS QUE SE ENLACE LA IMAGEN" target="_blank"><img title="PORTADA" alt="PORTADA" src="AQUÍ PONÉIS LA URL DE LA IMAGEN EN CUESTIÓN" height ="300px" width="1000px"/></a>


Slide de los botones horizontales

<a href="AQUÍ PONÉIS DONDE QUERÁIS QUE SE ENLACE LA IMAGEN" target="_blank"><img src="AQUÍ PONÉIS LA URL DE LA IMAGEN EN CUESTIÓN" title="Facebook Buttons By ButtonsHut.com" alt="Facebook Buttons By ButtonsHut.com" width="50px" border="0" /></a> <a href="http://www.youtube.com/user/viajesdemanu" target="_blank"><img src="http://www.buttonshut.com/Youtube-Buttons/youtube-badge-128x128 (565).png" title="Facebook Buttons By ButtonsHut.com" alt="Facebook Buttons By ButtonsHut.com" width="50px" border="0" /></a> <a href="http://www.facebook.com/viajesdemanu" target="_blank"><img src="http://www.buttonshut.com/Facebook-Buttons/Facebook-Buttons-56-64-.png" title="Facebook Buttons By ButtonsHut.com" alt="Facebook Buttons By ButtonsHut.com" width="50px" border="0" /></a><a href="http://www.facebook.com/viajesdemanu" target="_blank"><img src="https://tecnodemanu.files.wordpress.com/2015/01/google.png" title="Facebook Buttons By ButtonsHut.com" alt="Facebook Buttons By ButtonsHut.com" width="50px" border="0" /></a><a href="http://www.facebook.com/viajesdemanu" target="_blank"><img src="https://tecnodemanu.files.wordpress.com/2015/01/instagram.png" title="Facebook Buttons By ButtonsHut.com" alt="Facebook Buttons By ButtonsHut.com" width="50px" border="0" /></a><a href="http://www.facebook.com/viajesdemanu" target="_blank"><img src="https://tecnodemanu.files.wordpress.com/2015/01/email.png" title="Facebook Buttons By ButtonsHut.com" alt="Facebook Buttons By ButtonsHut.com" width="50px" border="0" /></a><a href="http://www.viajesdemanu.wordpress.com" target="_blank"><img src="https://tecnodemanu.files.wordpress.com/2015/01/y1psta7lm8niy1ouqb7yr0u6xqjxmtzinwct-2ihqyjt3lzpboaaik4r31qtdkhko9bajou0ev53jxpvmy_eua6lw.gif" title="Facebook Buttons By ButtonsHut.com" alt="Facebook Buttons By ButtonsHut.com" width="50px" border="0" /></a>

Se puede repetir tantas veces como botones pongáis

Como conseguir las URL'S de las imágenes:

-Abrimos una cuenta en wordpress, entramos en la administración de mi sitio, nos vamos a la opción media, añadir nuevo, buscamos la imagen y la subimos, cuando la tengamos vamos a la biblioteca y editar y allí en la derecha tenemos nuestra url. Copiamos y pegamos donde corresponda
para hacer esto necesitamos tener una cuenta en la plataforma wordpress

Comentarios

Publicar un comentario