tag:blogger.com,1999:blog-91992128392783992432024-03-13T01:48:21.864+01:00ManualesPequeñas ayudas para el mundo del blogjmhttp://www.blogger.com/profile/06735669513942778347noreply@blogger.comBlogger43125tag:blogger.com,1999:blog-9199212839278399243.post-87862076874433509082015-01-14T21:56:00.006+01:002013-01-07T21:27:23.561+01:00El Blog en la red<div style="text-align: center;">En el Blog podemos incluir ......</div><div align="center"><iframe align="center" frameborder="0" height="615" scrolling="no" src="http://dl.dropbox.com/u/4910414/photowidget/example.html" width="615"></iframe></div><div style="text-align: center;">El límite: lo decides tú..</div></br> </br> </br> </br> jmhttp://www.blogger.com/profile/06735669513942778347noreply@blogger.comtag:blogger.com,1999:blog-9199212839278399243.post-73443393815739524452012-01-04T02:07:00.001+01:002012-02-11T14:30:02.587+01:00Webcam Estación Espacial Internacional<br />
Un ejemplo de Vídeo en Streaming directo que podemos incluir en nuestro Blog.
<br />
<br />
<center>
<object classid="CLSID:22D6f312-B0F6-11D0-94AB-0080C74C7E95" codebase="http://activex.microsoft.com/activex/controls/mplayer/en/nsmp2inf.cab#Version=6,4,7,1112" height="480" id="MediaPlayer" standby="Loading Windows Media Player components..." type="application/x-oleobject" width="580">
<param name="filename" value="http://www.nasa.gov/multimedia/isslivestream.asx">
<param name="Showcontrols" value="True">
<param name="autoStart" value="FALSE">
<embed type="application/x-mplayer2" src="http://www.nasa.gov/multimedia/isslivestream.asx" height="480" width="580">
</object>
<br /><i>Live Space Station Video - © NASA</i>
</center>
<br />
En algunos momentos del día la señal se corta debido a la perdida de cobertura de la estación.
<br />
Próximos días de paso por nuestros cielos de la Estación:
<br />
<br />
<br />
<br />
<br />
<br />
<center>
<iframe align="middle" frameborder="1" height="600" scrolling="yes" src="http://spaceflight1.nasa.gov/realdata/sightings/cities/skywatch.cgi?country=Spain" width="760"></iframe>
</center>
<br />
<br />
La página de <a href="http://www.n2yo.com/" target="_blank">www.n2yo.com</a> nos muestra la trayectoria de la Estación en cada momento y a traves de nuestra IP determina nuestra posición.<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="http://dl.dropbox.com/u/4910414/img/EEI1.jpeg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="368" src="http://dl.dropbox.com/u/4910414/img/EEI1.jpeg" width="688" /></a></div>
<br />
En el lateral derecho, si hacemos clic en <u><b>5 DAY PREDICTIONS</b></u>, nos muestra las rutas cercanas a nuestra localización durante los próximos días.<br />
<br />
Nos aparece una tabla en la parte izquierda (días visibles) y un mapa en el lado derecho con nuestra localización. Si hacemos clic en el cuadrado de Map de cualquier día aparecerá sobre el mapa la trayectoria que seguirá la Estación .<b></b><br />
<div style="background-color: white; border: medium none; color: black; overflow: hidden; text-align: left; text-decoration: none;">
</div>
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="http://dl.dropbox.com/u/4910414/img/EEI2.jpeg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="444" src="http://dl.dropbox.com/u/4910414/img/EEI2.jpeg" width="640" /></a></div>
<br />
<br />
<br />
<br />
<br />
<br />
<br />
Código para incluir en cualquier entrada de nuestro Blog el vídeo desde la Estación Espacial Internacional:<br />
<br />
<center><br />
<object id="MediaPlayer" classid="CLSID:22D6f312-B0F6-11D0-94AB-0080C74C7E95" standby="Loading Windows Media Player components..." type="application/x-oleobject" codebase="http://activex.microsoft.com/activex/controls/mplayer/en/nsmp2inf.cab#Version=6,4,7,1112" height="380" width="480"><br />
<param name="filename" value="http://www.nasa.gov/multimedia/isslivestream.asx"><br />
<param name="Showcontrols" value="True"><br />
<param name="autoStart" value="FALSE"><br />
<embed type="application/x-mplayer2" src="http://www.nasa.gov/multimedia/isslivestream.asx" height="380" width="480"><br />
</object><br />
<br><i>Live Space Station Video - © NASA</i><br />
</center>jmhttp://www.blogger.com/profile/06735669513942778347noreply@blogger.comtag:blogger.com,1999:blog-9199212839278399243.post-23522098033035582462011-12-24T13:43:00.001+01:002012-01-04T00:29:56.696+01:00Gimp<div style="text-align: center;">
*****</div>
<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="http://dl.dropbox.com/u/4910414/img/EnConstruccion.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="200" src="http://dl.dropbox.com/u/4910414/img/EnConstruccion.jpg" width="200" /></a></div>
GIMP fue desarrollado como una herramienta libre para trabajar con
imágenes . Lee y escribe la mayoría
de los formatos de ficheros gráficos, entre ellos jpg, gif, png, pcx,
tiff, y los de Photoshop, además de poseer su propio formato de
almacenamiento de ficheros. También es capaz de importar ficheros
en pdf e imágenes vectoriales en formato svg creadas, por
ejemplo, con Inkscape.<br />Al igual que Photoshop, posee capas, canales,
caminos y distintos tipos de brochas que permiten combinar imágenes de
muchas maneras diferentes<br /><br />Posee numerosas herramientas de selección, pintado, modificación de escala, de
inclinación, de deformación, clonado en perspectiva o brocha de curado y un largo ect.. <br />
<br />
<br />
<iframe allowfullscreen="" frameborder="0" height="480" src="http://www.youtube.com/embed/videoseries?list=PL7C890F5938B4EFC5&hl=es_ES" width="750"></iframe>jmhttp://www.blogger.com/profile/06735669513942778347noreply@blogger.comtag:blogger.com,1999:blog-9199212839278399243.post-88976033035710211152011-12-24T13:42:00.003+01:002013-05-18T13:58:04.822+02:00Blender<table border="0" cellpadding="2" cellspacing="2" style="text-align: center; width: 100%;"><tbody>
<tr> <td><img alt="" src="http://dl.dropbox.com/u/4910414/blenderpres/img/blender.jpeg" /> </td> <td><object data="https://dl.dropboxusercontent.com/u/4910414/blenderpres/dewslider.swf?xml=https://dl.dropboxusercontent.com/u/4910414/blenderpres/presentacion.xml" height="255" type="application/x-shockwave-flash" width="550"> <param name="movie" value="https://dl.dropboxusercontent.com/u/4910414/blenderpres/dewslider.swf?xml=https://dl.dropboxusercontent.com/u/4910414/blenderpres/presentacion.xml" /></object></td></tr>
</tbody> </table>Blender es multiplataforma y podemos usarlo para la creación y visualizaciones 3D, tanto imágenes estáticas como vídeos de alta calidad. Incorpora un motor de 3D en tiempo real que permite la creación de contenido interactivo, incluyendo modelado, mapeado uv, texturizado, animación, simulación de partículas, cuerpos blandos, simulación de fluidos, renderizado, composición, post-producción y creación de juegos. Podemos descargar la última versión del programa para nuestro sistema operativo desde su <a href="http://www.blender.org/" target="_blank">Web</a>. En la red podemos encontrar amplia información sobre Blender. Como ejemplo : * Selección de videotutoriales de <a href="http://www.javierpedraja.com" target="_blank">Javier Pedraja</a>. <div align="left"><iframe align="middle" frameborder="0" height="560" marginheight="2" marginwidth="2" name="todos en uno" scrolling="no" src="http://dl.dropbox.com/u/4910414/blendervid/index.html" width="708"></iframe></div>* Videotutoriales de <a href="http://www.redbaron85.com/" target="_blank">Francesco Milanese</a> (Curso completísimo para Blender 2.5- 2.6). <iframe allowfullscreen="" frameborder="0" height="480" src="http://www.youtube.com/embed/videoseries?list=PL14D01C33E4CC9963&hl=es_ES" width="700"></iframe> Los vídeos incluyen subtítulos. Para traducirlos a español: Al pulsar play se activa CC (en rojo), hacemos clic sobre CC y seleccionamos <b>Traducir subtítulos</b>. Sobre el reproductor aparece una pequeña ventana con los idiomas (comienza por Afrikaans) pulsamos sobre este idioma y buscamos español. Clic en <b>aceptar</b>. Tutorial sobre el nuevo motor de Render Cycles (en Blender 2.61) <iframe width="700" height="480" src="http://www.youtube.com/embed/bL6rzHGnrPM" frameborder="0" allowfullscreen></iframe>jmhttp://www.blogger.com/profile/06735669513942778347noreply@blogger.comtag:blogger.com,1999:blog-9199212839278399243.post-44483126807064787212011-12-21T13:17:00.002+01:002011-12-22T20:01:09.160+01:00Inkscape<div style="text-align: center;">
<br /></div>
<div style="text-align: justify;">
Inkscape es un editor de gráficos vectoriales de código abierto, con
capacidades similares a Illustrator, Freehand, CorelDraw o Xara X. Las características soportadas incluyen: formas, trazos, texto,
marcadores, clones, mezclas de canales alfa, transformaciones,
gradientes, patrones, agrupamientos, edición de nodos, capas, operaciones
complejas con trazos, vectorización de archivos gráficos, texto en
trazos, alineación de textos, edición de XML directo y mucho más.<br />
Como introducción y mucho más a Inkscape: <br />
<br />
* Selección de 40 vídeos del Canal de Thinway sobre Inkscape en youtube.
<br />
<br />
<iframe allowfullscreen="" frameborder="0" height="480" src="http://www.youtube.com/embed/videoseries?list=PLB49D68DDBBC436E0&hl=es_ES" width="700"></iframe>
<br />
<br />
* Logo a logo (2ª edición) de <a href="http://joaclintistgud.wordpress.com/">Joaclint Istgud</a>
<br />
<br />
<iframe frameborder="0" src="http://docs.google.com/gview?url=http://dl.dropbox.com/u/4910414/inkscape/logo_a_logo_segunda_edicion.pdf&embedded=true" style="height: 750px; width: 725px;"></iframe>
<br />
<br />
</div>jmhttp://www.blogger.com/profile/06735669513942778347noreply@blogger.comtag:blogger.com,1999:blog-9199212839278399243.post-55024357290146324172011-12-14T20:35:00.000+01:002013-01-27T20:57:35.604+01:00Buscador de entradas en el Blog
<div class="separator" style="clear: both; text-align: center;">
<a href="http://dl.dropbox.com/u/4910414/blog/buscador.jpeg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="http://dl.dropbox.com/u/4910414/blog/buscador.jpeg" /></a></div>
<br />
Si queremos incluir este campo de búsqueda para las entradas de nuestro Blog :<br />
<br />
Entramos en ... <b>Diseño</b>...... <b>Añadir gadget</b>... tipo HTML/Javascript.<br />
<br />
Copiamos el código siguiente y lo pegamos en el cuerpo del gadget.<br />
<br />
<form id="searchthis" action="/search" style="display:inline;" method="get"><br /><input id="search-box" name="q" type="text"/><br /><input id="search-btn" value="<span style="background-color: #f9cb9c;">Buscar en el Blog</span>" type="submit"/></form><br />
<br />
<br />
Podemos cambiar <b>Buscar en el Blog</b>, por lo que queramos que aparezca.<br />
<br />Éste buscador sólo mira al interior de nuestro Blog, al escribir cualqier palabra en el campo, mostraria todas aquellas entradas del Blog que contengan esa palabra en el título.<br />
<br />jmhttp://www.blogger.com/profile/06735669513942778347noreply@blogger.comtag:blogger.com,1999:blog-9199212839278399243.post-60393217160534122682011-12-05T00:08:00.003+01:002012-08-25T02:08:06.471+02:00PureCssMenu en mi Blog 2<ul class="pureCssMenu pureCssMenum"><li class="pureCssMenui0"><a class="pureCssMenui0" href="http://jm-manuales.blogspot.com/2011/12/purecssmenu-en-mi-blog-m2.html">Página Inicio</a></li>
<li class="pureCssMenui0"><a class="pureCssMenui0" href="http://jm-manuales.blogspot.com/2011/12/purecssmenu-en-mi-blog-m2.html">Página 1</a> <ul class="pureCssMenum"><li class="pureCssMenui"><a class="pureCssMenui" href="http://jm-manuales.blogspot.com/2011/12/purecssmenu-en-mi-blog-m2.html">Página 1.1</a></li>
<li class="pureCssMenui"><a class="pureCssMenui" href="http://jm-manuales.blogspot.com/2011/12/purecssmenu-en-mi-blog-m2.html">Página 1.2</a></li>
<li class="pureCssMenui"><a class="pureCssMenui" href="http://jm-manuales.blogspot.com/2011/12/purecssmenu-en-mi-blog-m2.html">Página 1.3</a> <ul class="pureCssMenum"><li class="pureCssMenui"><a class="pureCssMenui" href="http://jm-manuales.blogspot.com/2011/12/purecssmenu-en-mi-blog-m2.html">Página 1.3.1</a></li>
<li class="pureCssMenui"><a class="pureCssMenui" href="http://jm-manuales.blogspot.com/2011/12/purecssmenu-en-mi-blog-m2.html">Página 1.3.2</a></li>
<li class="pureCssMenui"><a class="pureCssMenui" href="http://jm-manuales.blogspot.com/2011/12/purecssmenu-en-mi-blog-m2.html">Página 1.3.3</a></li>
</ul></li>
</ul></li>
<li class="pureCssMenui0"><a class="pureCssMenui0" href="http://jm-manuales.blogspot.com/2011/12/purecssmenu-en-mi-blog-m2.html">Página 2</a> <ul class="pureCssMenum"><li class="pureCssMenui"><a class="pureCssMenui" href="http://jm-manuales.blogspot.com/2011/12/purecssmenu-en-mi-blog-m2.html">Página 2.1</a></li>
<li class="pureCssMenui"><a class="pureCssMenui" href="http://jm-manuales.blogspot.com/2011/12/purecssmenu-en-mi-blog-m2.html">Página 2.2</a></li>
<li class="pureCssMenui"><a class="pureCssMenui" href="http://jm-manuales.blogspot.com/2011/12/purecssmenu-en-mi-blog-m2.html">Página 2.3</a></li>
</ul></li>
<li class="pureCssMenui0"><a class="pureCssMenui0" href="http://jm-manuales.blogspot.com/2011/12/purecssmenu-en-mi-blog-m2.html">Página 3</a> <ul class="pureCssMenum"><li class="pureCssMenui"><a class="pureCssMenui" href="http://jm-manuales.blogspot.com/2011/12/purecssmenu-en-mi-blog-m2.html">Página 3.1</a> <ul class="pureCssMenum"><li class="pureCssMenui"><a class="pureCssMenui" href="http://jm-manuales.blogspot.com/2011/12/purecssmenu-en-mi-blog-m2.html">Página 3.1.1</a></li>
<li class="pureCssMenui"><a class="pureCssMenui" href="http://jm-manuales.blogspot.com/2011/12/purecssmenu-en-mi-blog-m2.html">Página 3.1.2</a></li>
<li class="pureCssMenui"><a class="pureCssMenui" href="http://jm-manuales.blogspot.com/2011/12/purecssmenu-en-mi-blog-m2.html">Página 3.1.3</a> <ul class="pureCssMenum"><li class="pureCssMenui"><a class="pureCssMenui" href="http://jm-manuales.blogspot.com/2011/12/purecssmenu-en-mi-blog-m2.html">Página 3.1.3.1</a></li>
<li class="pureCssMenui"><a class="pureCssMenui" href="http://jm-manuales.blogspot.com/2011/12/purecssmenu-en-mi-blog-m2.html">Página 3.1.3.2</a></li>
</ul></li>
</ul></li>
<li class="pureCssMenui"><a class="pureCssMenui" href="http://jm-manuales.blogspot.com/2011/12/purecssmenu-en-mi-blog-m2.html">Página 3.2</a></li>
<li class="pureCssMenui"><a class="pureCssMenui" href="http://jm-manuales.blogspot.com/2011/12/purecssmenu-en-mi-blog-m2.html">Página 3.3</a></li>
<li class="pureCssMenui"><a class="pureCssMenui" href="http://jm-manuales.blogspot.com/2011/12/purecssmenu-en-mi-blog-m2.html">Página 3.4</a> <ul class="pureCssMenum"><li class="pureCssMenui"><a class="pureCssMenui" href="http://jm-manuales.blogspot.com/2011/12/purecssmenu-en-mi-blog-m2.html">Página 3.4.1</a></li>
<li class="pureCssMenui"><a class="pureCssMenui" href="http://jm-manuales.blogspot.com/2011/12/purecssmenu-en-mi-blog-m2.html">Página 3.4.2</a></li>
</ul></li>
</ul></li>
<li class="pureCssMenui0"><a class="pureCssMenui0" href="http://jm-manuales.blogspot.com/2011/12/purecssmenu-en-mi-blog-m2.html">Página 4</a> <ul class="pureCssMenum"><li class="pureCssMenui"><a class="pureCssMenui" href="http://jm-manuales.blogspot.com/2011/12/purecssmenu-en-mi-blog-m2.html">Página 4.1</a></li>
<li class="pureCssMenui"><a class="pureCssMenui" href="http://jm-manuales.blogspot.com/2011/12/purecssmenu-en-mi-blog-m2.html">Página 4.2</a> <ul class="pureCssMenum"><li class="pureCssMenui"><a class="pureCssMenui" href="http://jm-manuales.blogspot.com/2011/12/purecssmenu-en-mi-blog-m2.html">Página 4.2.1</a></li>
<li class="pureCssMenui"><a class="pureCssMenui" href="http://jm-manuales.blogspot.com/2011/12/purecssmenu-en-mi-blog-m2.html">Página 4.2.2</a></li>
<li class="pureCssMenui"><a class="pureCssMenui" href="http://jm-manuales.blogspot.com/2011/12/purecssmenu-en-mi-blog-m2.html">Página 4.2.3</a></li>
</ul></li>
</ul></li>
<li class="pureCssMenui0"><a class="pureCssMenui0" href="http://jm-manuales.blogspot.com/2011/12/purecssmenu-en-mi-blog-m2.html">Página 5</a> <ul class="pureCssMenum"><li class="pureCssMenui"><a class="pureCssMenui" href="http://jm-manuales.blogspot.com/2011/12/purecssmenu-en-mi-blog-m2.html">Página 5.1</a></li>
<li class="pureCssMenui"><a class="pureCssMenui" href="http://jm-manuales.blogspot.com/2011/12/purecssmenu-en-mi-blog-m2.html">Página 5.2</a></li>
</ul></li>
<li class="pureCssMenui0"><a class="pureCssMenui0" href="http://jm-manuales.blogspot.com/2011/12/purecssmenu-en-mi-blog-m2.html">Página 6</a> <ul class="pureCssMenum"><li class="pureCssMenui"><a class="pureCssMenui" href="http://jm-manuales.blogspot.com/2011/12/purecssmenu-en-mi-blog-m2.html">Página 6.1</a></li>
<li class="pureCssMenui"><a class="pureCssMenui" href="http://jm-manuales.blogspot.com/2011/12/purecssmenu-en-mi-blog-m2.html">Página 6.2</a></li>
</ul></li>
</ul><div style="text-align: center;"><div style="text-align: justify;"><br />
<br />
Venimos de: <a href="http://jm-manuales.blogspot.com/2011/12/purecssmenu-en-mi-blog.html">PureCssMenu en mi Blog</a>. <br />
Antes de que veamos como colocar nuestro Menú en el Blog, debemos de asegurarnos de que si algo sale mal, podamos retroceder sin recibir ningun daño ( que nuestro Blog quede ileso).</div><div style="text-align: justify;"><br />
</div><div class="separator" style="clear: both; text-align: center;"><a href="http://dl.dropbox.com/u/13192487/menus/menu12.jpeg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="316" src="http://dl.dropbox.com/u/13192487/menus/menu12.jpeg" width="640" /></a></div><div style="text-align: justify;"><br />
En la pestaña <b>Diseño</b>, hacemos clic en <b>Edición de HTML</b>, y como vemos en la imagen , hacemos clic en <u><b>Descargar plantilla completa</b></u>. Anotamos el nombre del fichero y donde lo hemos descargado (siempre es: template........xml).</div><div style="text-align: justify;"><b><span style="color: #4c1130;">Si algo nos fuera mal</span></b> (blog vuelto loco...) entrariamos de nuevo en <b>Diseño</b>, hacemos clic en <b>Edición de HTML</b>, y en la sección Crear copia de seguridad/Restaurar plantilla, en la segunda línea : Clic en <span style="background-color: #cccccc;">Elegir un archivo</span>, seleccionamos el archivo que descargamos antes y hacemos clic en <span style="background-color: #cccccc;">Subir</span> .<br />
Guardamos nuestros cambios y todo vuelve a la normalidad.<br />
<br />
Este proceso es <b style="background-color: #fce5cd;">indispensable</b> como medida de seguridad. <b>Si algo puede fallar...</b>.<br />
<div style="text-align: center;">**************</div><br />
Para comenzar ya con nuestro Menú el preceso a realizar es el siguiente :<br />
<br />
1º.- <b>Preparar nuestra Plantilla</b> . <br />
<br />
Entramos en <b>Diseño</b>... <b>Edición de HTML</b> . <br />
Pulsamos <b>Ctrl+F </b> se nos abrirá un campo de búsqueda (en Firefox abajo de nuestra pantalla, en otros navegadores en la parte de arriba).<br />
En ese campo de búsqueda escribimos : section class= . Abrá buscado de inmediato. Comprobamos que ....section class=... se encuentra dentro de esta línea:<br />
<br />
<b:section class='tabs' id='crosscol' maxwidgets='1' showaddelement='yes'><br />
Si no es así, le damos a buscar siguiente hasta que nos aparezca. Cuando tengamos esta línea debemos borrar de ella: <b>class='tabs'</b> <br />
La línea debe de quedar así:<br />
<br />
<b:section id='crosscol' maxwidgets='1' showaddelement='yes'><br />
Seguimos:<br />
Volvemos al campo de búsqueda y buscamos ahora : /* tabs<br />
<br />
<div class="separator" style="clear: both; text-align: center;"></div><div style="text-align: justify;">Debemos de encontrar:<br />
<br />
/* Tabs <br />
----------------------------------------------- */ <a href="http://dl.dropbox.com/u/13192487/menus/dereparaciones.jpeg" style="margin-left: 1em; margin-right: 1em;"><br />
</a></div>Como vemos en esta imagen.<br />
<div class="separator" style="clear: both; text-align: center;"><a href="http://dl.dropbox.com/u/4910414/blogger/crontrolf06.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="176" src="http://dl.dropbox.com/u/4910414/blogger/crontrolf06.jpg" width="640" /></a></div><br />
Debemos de eliminar todas las lineas de código que siguen a la línea : <br />
<br />
----------------------------------------------- */</div><div style="text-align: justify;">(sin eliminar ésta) hasta que veamos :</div><div style="text-align: justify;"></div><div style="text-align: justify;">/* Headings</div><div style="text-align: justify;">----------------------------------------------- */</div><div style="text-align: justify;"></div><div class="separator" style="clear: both; text-align: center;"><a href="http://dl.dropbox.com/u/4910414/blogger/crontrolf08.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><br />
</a></div><div style="text-align: justify;">Todas esas líneas de código que hemos borrado las vamos a sustituir por las siguientes (copiar de aqui mismo):</div><div style="text-align: justify;"></div><div style="text-align: left;">ul {z-index: 200; padding:0 !important;} <br />
li:hover {position:relative;} <br />
#crosscol ul li {padding:0 !important;}</div><div style="text-align: justify;"><br />
<br />
El código debe de quedar como en esta imagen:<br />
<br />
<div class="separator" style="clear: both; text-align: center;"><a href="http://dl.dropbox.com/u/4910414/blogger/crontrolf10.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="155" src="http://dl.dropbox.com/u/4910414/blogger/crontrolf10.jpg" width="400" /></a></div><br />
<br />
<b>Ahora sí</b> podemos guardar los cambios a nuestra Plantilla, que ya estaría preparada para poder colocarle nuestro Menú (que ya se podrá desplegar sin problemas).<br />
<div style="text-align: center;"><br />
</div><div style="text-align: center;">******</div><b>¿Cómo colocamos el Menú?:</b><br />
<b></b><br />
El fichero comprimido que descargamos de http://purecssmenu.com contiene una carpeta nombrada <b>images </b>y un fichero <b>purecssmenu.html</b>. Las imágenes de la carpeta debemos de subirlas a nuestro espacio en la Web (Dropbox por ejemplo) <br />
El fichero <b>purecssmenu.html</b> debemos de abrirlo ( con Gedit, Notepad... o cualquier editor Web). Sustituir en su código la dirección de las imágenes por las de nuestro espacio en la Web.<br />
background-image:url(<span style="background-color: #f9cb9c;">./images/arrv_white.gif</span>);<br />
Ésta es una de las lineas del código, que debemos cambiar. La parte sombreada es la que debo sustituir con la url de la imagen en mi espacio Web (así con todas).<br />
Una vez que hemos cambiado las direcciones de las imágenes, nos centramos en el código de este fichero:<br />
Nuestro Menú está definido en su <b>estilo</b> y <b>contenido</b> por dos partes diferenciadas del código (las primeras líneas del código no pertenecen al menú en sí) que deben de incluirse en distintos lugares cada una.<br />
<br />
La primera parte define el estilo del menú :<br />
<br />
<b><!-- Start PureCSSMenu.com STYLE --> </b><br />
<style></div><div style="text-align: justify;">.<br />
.<br />
.<br />
.<br />
</style> <br />
<b><!-- End PureCSSMenu.com STYLE --></b><br />
<br />
Todo este contenido de estilo debemos de copiarlo y pegarlo dentro de la etiqueta <head> de nuestra Plantilla (volvemos a entrar en Diseño, Edición de HTML si hubieramos salido).<br />
<br />
En el campo de búsqueda (Control+F) escribimos <head> y en el código de nuestra Plantilla justo debajo de <head> colocamos el cursor y pegamos .<br />
<br />
<b>Guardamos los cambios</b> a nuestra plantilla y podemos salir de E<b>dición de HTML</b>.<br />
<br />
La segunda parte que contiene el Menú en sí está definida justo debajo de la parte de estilo :<br />
<b><!-- Start PureCSSMenu.com MENU --></b>.<br />
.<br />
.<br />
.<br />
<b><!-- End PureCSSMenu.com MENU --></b><br />
<br />
Todo este contenido debemos de copiarlo y pegarlo <u><b>allí donde queramos que el Menú aparezca</b></u>. Entramos en Diseño, Elementos de Página .... Añadir Gadget . ...... tipo Html/Javascript (si lo queremos en la cabecera de nuestro Blog). Pegamos (dejamos al gadget sin título). Guardamos.<br />
<br />
Sí hacemos clic en ver el Blog, nuestro Menú ya aparecerá colocado.<br />
<br />
<br />
</div><div class="separator" style="clear: both; text-align: center;"><a href="http://dl.dropbox.com/u/4910414/blogger/menu3003.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="339" src="http://dl.dropbox.com/u/4910414/blogger/menu3003.jpg" width="640" /></a></div><br />
<div style="text-align: justify;"></div><div style="text-align: justify;"></div></div>jmhttp://www.blogger.com/profile/06735669513942778347noreply@blogger.comtag:blogger.com,1999:blog-9199212839278399243.post-63251081452621024832011-12-05T00:06:00.002+01:002012-08-25T02:06:31.503+02:00PureCssMenu en mi Blog<ul class="pureCssMenu pureCssMenum"><li class="pureCssMenui0"><a class="pureCssMenui0" href="http://jm-manuales.blogspot.com/2011/12/purecssmenu-en-mi-blog.html">Página Inicio</a></li>
<li class="pureCssMenui0"><a class="pureCssMenui0" href="http://jm-manuales.blogspot.com/2011/12/purecssmenu-en-mi-blog.html">Página 1</a> <ul class="pureCssMenum"><li class="pureCssMenui"><a class="pureCssMenui" href="http://jm-manuales.blogspot.com/2011/12/purecssmenu-en-mi-blog.html">Página 1.1</a></li>
<li class="pureCssMenui"><a class="pureCssMenui" href="http://jm-manuales.blogspot.com/2011/12/purecssmenu-en-mi-blog.html">Página 1.2</a></li>
<li class="pureCssMenui"><a class="pureCssMenui" href="http://jm-manuales.blogspot.com/2011/12/purecssmenu-en-mi-blog.html">Página 1.3</a> <ul class="pureCssMenum"><li class="pureCssMenui"><a class="pureCssMenui" href="http://jm-manuales.blogspot.com/2011/12/purecssmenu-en-mi-blog.html">Página 1.3.1</a></li>
<li class="pureCssMenui"><a class="pureCssMenui" href="http://jm-manuales.blogspot.com/2011/12/purecssmenu-en-mi-blog.html">Página 1.3.2</a></li>
<li class="pureCssMenui"><a class="pureCssMenui" href="http://jm-manuales.blogspot.com/2011/12/purecssmenu-en-mi-blog.html">Página 1.3.3</a></li>
</ul></li>
</ul></li>
<li class="pureCssMenui0"><a class="pureCssMenui0" href="http://jm-manuales.blogspot.com/2011/12/purecssmenu-en-mi-blog.html">Página 2</a> <ul class="pureCssMenum"><li class="pureCssMenui"><a class="pureCssMenui" href="http://jm-manuales.blogspot.com/2011/12/purecssmenu-en-mi-blog.html">Página 2.1</a></li>
<li class="pureCssMenui"><a class="pureCssMenui" href="http://jm-manuales.blogspot.com/2011/12/purecssmenu-en-mi-blog.html">Página 2.2</a></li>
<li class="pureCssMenui"><a class="pureCssMenui" href="http://jm-manuales.blogspot.com/2011/12/purecssmenu-en-mi-blog.html">Página 2.3</a></li>
</ul></li>
<li class="pureCssMenui0"><a class="pureCssMenui0" href="http://jm-manuales.blogspot.com/2011/12/purecssmenu-en-mi-blog.html">Página 3</a> <ul class="pureCssMenum"><li class="pureCssMenui"><a class="pureCssMenui" href="http://jm-manuales.blogspot.com/2011/12/purecssmenu-en-mi-blog.html">Página 3.1</a> <ul class="pureCssMenum"><li class="pureCssMenui"><a class="pureCssMenui" href="http://jm-manuales.blogspot.com/2011/12/purecssmenu-en-mi-blog.html">Página 3.1.1</a></li>
<li class="pureCssMenui"><a class="pureCssMenui" href="http://jm-manuales.blogspot.com/2011/12/purecssmenu-en-mi-blog.html">Página 3.1.2</a></li>
<li class="pureCssMenui"><a class="pureCssMenui" href="http://jm-manuales.blogspot.com/2011/12/purecssmenu-en-mi-blog.html">Página 3.1.3</a> <ul class="pureCssMenum"><li class="pureCssMenui"><a class="pureCssMenui" href="http://jm-manuales.blogspot.com/2011/12/purecssmenu-en-mi-blog.html">Página 3.1.3.1</a></li>
<li class="pureCssMenui"><a class="pureCssMenui" href="http://jm-manuales.blogspot.com/2011/12/purecssmenu-en-mi-blog.html">Página 3.1.3.2</a></li>
</ul></li>
</ul></li>
<li class="pureCssMenui"><a class="pureCssMenui" href="http://jm-manuales.blogspot.com/2011/12/purecssmenu-en-mi-blog.html">Página 3.2</a></li>
<li class="pureCssMenui"><a class="pureCssMenui" href="http://jm-manuales.blogspot.com/2011/12/purecssmenu-en-mi-blog.html">Página 3.3</a></li>
<li class="pureCssMenui"><a class="pureCssMenui" href="http://jm-manuales.blogspot.com/2011/12/purecssmenu-en-mi-blog.html">Página 3.4</a> <ul class="pureCssMenum"><li class="pureCssMenui"><a class="pureCssMenui" href="http://jm-manuales.blogspot.com/2011/12/purecssmenu-en-mi-blog.html">Página 3.4.1</a></li>
<li class="pureCssMenui"><a class="pureCssMenui" href="http://jm-manuales.blogspot.com/2011/12/purecssmenu-en-mi-blog.html">Página 3.4.2</a></li>
</ul></li>
</ul></li>
<li class="pureCssMenui0"><a class="pureCssMenui0" href="http://jm-manuales.blogspot.com/2011/12/purecssmenu-en-mi-blog.html">Página 4</a> <ul class="pureCssMenum"><li class="pureCssMenui"><a class="pureCssMenui" href="http://jm-manuales.blogspot.com/2011/12/purecssmenu-en-mi-blog.html">Página 4.1</a></li>
<li class="pureCssMenui"><a class="pureCssMenui" href="http://jm-manuales.blogspot.com/2011/12/purecssmenu-en-mi-blog.html">Página 4.2</a> <ul class="pureCssMenum"><li class="pureCssMenui"><a class="pureCssMenui" href="http://jm-manuales.blogspot.com/2011/12/purecssmenu-en-mi-blog.html">Página 4.2.1</a></li>
<li class="pureCssMenui"><a class="pureCssMenui" href="http://jm-manuales.blogspot.com/2011/12/purecssmenu-en-mi-blog.html">Página 4.2.2</a></li>
<li class="pureCssMenui"><a class="pureCssMenui" href="http://jm-manuales.blogspot.com/2011/12/purecssmenu-en-mi-blog.html">Página 4.2.3</a></li>
</ul></li>
</ul></li>
<li class="pureCssMenui0"><a class="pureCssMenui0" href="http://jm-manuales.blogspot.com/2011/12/purecssmenu-en-mi-blog.html">Página 5</a> <ul class="pureCssMenum"><li class="pureCssMenui"><a class="pureCssMenui" href="http://jm-manuales.blogspot.com/2011/12/purecssmenu-en-mi-blog.html">Página 5.1</a></li>
<li class="pureCssMenui"><a class="pureCssMenui" href="http://jm-manuales.blogspot.com/2011/12/purecssmenu-en-mi-blog.html">Página 5.2</a></li>
</ul></li>
<li class="pureCssMenui0"><a class="pureCssMenui0" href="http://jm-manuales.blogspot.com/2011/12/purecssmenu-en-mi-blog.html">Página 6</a> <ul class="pureCssMenum"><li class="pureCssMenui"><a class="pureCssMenui" href="http://jm-manuales.blogspot.com/2011/12/purecssmenu-en-mi-blog.html">Página 6.1</a></li>
<li class="pureCssMenui"><a class="pureCssMenui" href="http://jm-manuales.blogspot.com/2011/12/purecssmenu-en-mi-blog.html">Página 6.2</a></li>
</ul></li>
</ul><br />
<br />
<br />
<div style="text-align: center;"><div style="text-align: justify;">PureCssMenu nos va ha permitir colocar un Menú desplegable en nuestro Blog. Cabecera del Blog, lateral, páginas estáticas, entradas... Allí donde lo necesitemos.</div><div class="separator" style="clear: both; text-align: center;"><a href="http://dl.dropbox.com/u/13192487/menus/menucss.jpeg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="432" src="http://dl.dropbox.com/u/13192487/menus/menucss.jpeg" width="640" /></a></div><div style="text-align: justify;"><br />
</div><div style="text-align: justify;"><br />
Nada más escribir su dirección en nuestro navegador nos aparece el editor con todas sus opciones. Un menú de ejemplo, la vista previa...<br />
Lo primero será dirigirnos a la parte inferior y hacer clic en <b>register</b>.<br />
<br />
<div class="separator" style="clear: both; text-align: center;"><a href="http://dl.dropbox.com/u/13192487/menus/menu18.jpeg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="276" src="http://dl.dropbox.com/u/13192487/menus/menu18.jpeg" width="640" /></a></div><br />
</div><div style="text-align: justify;">Sólo necesitamos para registrarnos indicar una dirección de correo y un nombre, pulsamos Register. La clave nos la envía a nuestro correo de forma inmediata.<br />
Al entrar de nuevo en la página y en <b>Login </b>indicarle nuestro correo y la clave proporcionada, la página de inicio de <b>PureCssmenu</b> tiene un cambio:<br />
<br />
<div class="separator" style="clear: both; text-align: center;"><a href="http://dl.dropbox.com/u/13192487/menus/menu20.jpeg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="377" src="http://dl.dropbox.com/u/13192487/menus/menu20.jpeg" width="640" /></a></div><br />
Se ha incorporado el botón <b>Download</b>, que pulsaremos para descargar los archivos necesarios, cuando tengamos nuestro menú totalmente definido.<br />
<br />
Si nos fijamos a la izquierda en la pantalla tenemos los botones Items, Parameters y Templates. Para cada Item o elemento del menú, le debemos indicar el texto que aparecerá (campo Text) y su URL exacta (campo Link) . El campo Target (indica donde veremos cada enlace) podemos dejarlo tal cual o desplegarlo y marcar la opción que deseemos. Por defecto nos aparece en la opción <b>_self</b> (el enlace se vería en la misma pestaña del nevegador), si algún enlace queremos que sea vea en una pestaña nueva, desplegamos y seleccionamos <b>_blank</b>.<br />
<br />
Los Items Parameters y Templates, nos permiten seleccionar el aspecto visual te tendrá nuestro menú.<br />
<br />
<div align="center"><table bgcolor="" border="0" cellpadding="5" style="width: 75%;"><tbody>
<tr><td><div class="separator" style="clear: both; text-align: center;"><a href="http://dl.dropbox.com/u/13192487/menus/menu21.jpeg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="228" src="http://dl.dropbox.com/u/13192487/menus/menu21.jpeg" width="258" /></a></div><div class="separator" style="clear: both; text-align: center;"><a href="http://dl.dropbox.com/u/4910414/blogger/menu30.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="121" src="http://dl.dropbox.com/u/4910414/blogger/menu30.jpg" width="200" /></a></div><br />
</td><td><div class="separator" style="clear: both; text-align: center;"><a href="http://dl.dropbox.com/u/13192487/menus/menu22.jpeg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="394" src="http://dl.dropbox.com/u/13192487/menus/menu22.jpeg" width="254" /></a></div><br />
</td></tr>
</tbody> </table><div style="text-align: justify;"></div></div></div></div>Para cambiar colores: dentro de Parameters, haceclos clic dentro del campo donde está el código del color y nos aparece una pequeña ventana de muestra, para que con el ratón seleccionemos el nuevo color.<a href="http://html-color-codes.info/codigos-de-colores-hexadecimales/" target="_blank"></a><br />
<br />
Una vez definido totalmente nuestro Menú pulsamos <b>Download </b>para descargar el archivo .zip, que contiene lo necesario para hacer funcionar el menú.<br />
<br />
Las instrucciones para modificar nuestra plantilla y que el menú funcione:<br />
<br />
<div style="text-align: center;"><a href="http://jm-manuales.blogspot.com/2011/12/purecssmenu-en-mi-blog-m2.html">PureCssMenu en mi Blog 2</a></div>jmhttp://www.blogger.com/profile/06735669513942778347noreply@blogger.comtag:blogger.com,1999:blog-9199212839278399243.post-86589567547587547682011-12-02T03:52:00.003+01:002013-05-31T14:05:53.707+02:00Nube de entradas<object allowscriptaccess="always" bgcolor="#CBE1AE" data="http://dl.dropbox.com/u/4910414/nubeentradas/tagcloud.swf" height="500" id="tagcloudflash" name="tagcloudflash" quality="full" type="application/x-shockwave-flash" width="750" wmode="transparent"> <param name="movie" value="http://dl.dropbox.com/u/4910414/nubeentradas/tagcloud.swf" /><param name="bgcolor" value="#333333" /><param name="flashvars" value="tcolor=0x007F7F7Fcc&mode=tags&distr=false&tspeed=100&tagcloud=<tags>
<a href='http://jm-manuales.blogspot.com/search/label/Crear%20un%20Blog%20en%20Blogger'style='10'>CREAR BLOG</a>
<a href='http://jm-manuales.blogspot.com/2011/11/editar-y-publicar-entradas.html' style='10'>CREAR ENTRADAS</a>
<a href='http://jm-manuales.blogspot.com/2011/11/paginas-en-el-blog.html' style='10'>CREAR PÁGINAS</a>
<a href='http://jm-manuales.blogspot.com/search/label/Crear%20un%20Blog%20en%20Blogger%20%3A%20%20%20%20%20%20%20%20Configuraci%C3%B3n' style='10'>CONFIGURACIÓN</a>
<a href='http://jm-manuales.blogspot.com/search/label/Plantillla%20%20del%20Blog' style='10'>PLANTILLA DEL BLOG</a>
<a href='http://jm-manuales.blogspot.com/search/label/Enlaces%20en%20mi%20Blog' style='10'>ENLACES DEL BLOG</a>
<a href='http://jm-manuales.blogspot.com/search/label/Im%C3%A1genes%20y%20v%C3%ADdeos%20en%20el%20Blog' style='10'>IMÁGENES Y VÍDEOS</a>
<a href='http://jm-manuales.blogspot.com/search/label/Im%C3%A1genes%20y%20v%C3%ADdeos%3A%20Picasa' style='10'>PICASA EN EL BLOG</a>
<a href='http://jm-manuales.blogspot.com/search/label/V%C3%ADdeos%20en%20el%20Blog%3A%20Vimeo' style='10'>VÍDEOS DE VIMEO</a>
<a href='http://jm-manuales.blogspot.com/search/label/V%C3%ADdeos%20en%20el%20Blog%3A%20Youtube' style='10'>VÍDEOS DE YOUTUBE</a>
<a href='http://jm-manuales.blogspot.com/2011/01/documentos-con-scribd.html' style='10'>DOCUMENTOS CON SCRIBD</a>
<a href='http://jm-manuales.blogspot.com/search/label/M%C3%BAsica%20en%20el%20Blog' style='10'>MÚSICA EN EL BLOG</a>
<a href='http://jm-manuales.blogspot.com/search/label/Tablas%20en%20el%20Blog' style='10'>TABLAS EN EL BLOG</a>
<a href='http://jm-manuales.blogspot.com/search/label/V%C3%ADdeotutorial%20en%20entrada%20del%20Blog' style='10'>VIDEOTUTORIALES EN EL BLOG</a>
<a href='http://jm-manuales.blogspot.com/2011/01/jclic-hot-potatoes-en-mi-blog.html' style='10'>JCLIC - HOT POTATOES</a>
<a href='http://jm-manuales.blogspot.com/2011/11/menus-para-el-blog.html' style='10'>MENÚS PARA EL BLOG</a>
<a href='http://jm-manuales.blogspot.com/2011/02/video-tutoriales-activinspire.html' style='10'>PIZARRA PROMETHEAN</a>
<a href='http://jm-manuales.blogspot.com/2011/10/videotutoriales-smartboard.html' style='10'>PIZARRA SMART</a>
<a href='http://jm-manuales.blogspot.com/search/label/Manual%20ActivInspire' style='10'>MANUAL ACTIVINSPIRE</a>
</tags>" /></object>
Éste es un efecto de WP-cumulus para Wordpress de <a href="http://www.roytanck.com/2008/03/15/wp-cumulus-released/" target="_blank">Roy Tanck</a>, que podemos utilizar en nuestro Blog de Blogger utilizando un fichero .swf (tagcloud.swf). En el código aparece colocado en un espacio de Dropbox. Podemos <a href="https://mega.co.nz/#!94RURAjI!byZlZHs-ifbVJEEbxl1oXAc0Df1ab4Mw1AngoY4kHj8" target="_blank">descargarlo </a>si queremos y cambiar la dirección URl por la nuestra.
código:
<br />
<div style="background-color: transparent;">
<span id="internal-source-marker_0.15463936561718583" style="background-color: transparent; color: black; font-family: 'Courier New'; font-size: 15px; font-style: normal; font-variant: normal; font-weight: normal; text-decoration: none; vertical-align: baseline; white-space: pre-wrap;"><object type="application/x-shockwave-flash" data="https://dl.dropboxusercontent.com/u/4910414/nubeentradas/tagcloud.swf" id="tagcloudflash" name="tagcloudflash" bgcolor="#CBE1AE" quality="full" wmode="transparent" width="<span style="background-color: #f6b26b;">230</span>" height="<span style="background-color: #f6b26b;">250</span>" allowscriptaccess="always"></span>
<span style="background-color: transparent; color: black; font-family: 'Courier New'; font-size: 15px; font-style: normal; font-variant: normal; font-weight: normal; text-decoration: none; vertical-align: baseline; white-space: pre-wrap;"><param name="movie" value="http://dl.dropbox.com/u/4910414/nubeentradas/tagcloud.swf" /></span>
<span style="background-color: transparent; color: black; font-family: 'Courier New'; font-size: 15px; font-style: normal; font-variant: normal; font-weight: normal; text-decoration: none; vertical-align: baseline; white-space: pre-wrap;"><param name="bgcolor" value="#333333" /></span>
<span style="background-color: transparent; color: black; font-family: 'Courier New'; font-size: 15px; font-style: normal; font-variant: normal; font-weight: normal; text-decoration: none; vertical-align: baseline; white-space: pre-wrap;"><param name="flashvars" value="tcolor=0x0000cc&amp;mode=tags&amp;distr=false&amp;tspeed=100&amp;tagcloud=&lt;tags&gt;</span>
<span style="background-color: transparent; color: black; font-family: 'Courier New'; font-size: 15px; font-style: normal; font-variant: normal; font-weight: normal; text-decoration: none; vertical-align: baseline; white-space: pre-wrap;">&lt;a href=&#39;<span style="background-color: #f9cb9c;">http://TAG</span>&#39; style=&#39;10&#39;&gt;<span style="background-color: #f6b26b;">TITULO</span>&lt;/a&gt;</span>
<span style="background-color: transparent; color: black; font-family: 'Courier New'; font-size: 15px; font-style: normal; font-variant: normal; font-weight: normal; text-decoration: none; vertical-align: baseline; white-space: pre-wrap;">&lt;a href=&#39;<span style="background-color: #f6b26b;">http://TAG</span>&#39; style=&#39;10&#39;&gt;<span style="background-color: #f9cb9c;">TITULO</span>&lt;/a&gt;</span>
<span style="background-color: transparent; color: black; font-family: 'Courier New'; font-size: 15px; font-style: normal; font-variant: normal; font-weight: normal; text-decoration: none; vertical-align: baseline; white-space: pre-wrap;">&lt;a href=&#39;<span style="background-color: #f6b26b;">http://TAG</span>&#39; style=&#39;10&#39;&gt;<span style="background-color: #f9cb9c;">TITULO</span>&lt;/a&gt;</span>
<span style="background-color: transparent; color: black; font-family: 'Courier New'; font-size: 15px; font-style: normal; font-variant: normal; font-weight: normal; text-decoration: none; vertical-align: baseline; white-space: pre-wrap;">&lt;/tags&gt;" /></span>
<span style="background-color: transparent; color: black; font-family: 'Courier New'; font-size: 15px; font-style: normal; font-variant: normal; font-weight: normal; text-decoration: none; vertical-align: baseline; white-space: pre-wrap;"></object></span></div>
Sombreado en el código anchura y altura (modificamos a nuestra necesidad).
Sustituimos : <span style="background-color: #f9cb9c;">http://TAG</span> por la URL de nuestra entrada y <span style="background-color: #f9cb9c;">TITULO</span> por el título de nuestra entrada o lo que queremos que aparezca.
Cada línea muestra el título con su enlace, podemos añadir todos los que necesitemos, copiamos la línea completa y sustituimos, siempre antes de <span style="background-color: transparent; color: black; font-family: 'Courier New'; font-size: 15px; font-style: normal; font-variant: normal; font-weight: normal; text-decoration: none; vertical-align: baseline; white-space: pre-wrap;">&lt;/tags&gt;" /></span>jmhttp://www.blogger.com/profile/06735669513942778347noreply@blogger.comtag:blogger.com,1999:blog-9199212839278399243.post-49249063250474534242011-12-01T21:15:00.003+01:002012-08-25T02:26:19.391+02:00Menú de imágenes<div align="center"><table bgcolor="" border="0" cellpadding="1"><tbody>
<tr><td><a href="http://jm-manuales.blogspot.com/search/label/Crear%20un%20Blog%20en%20Blogger" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;"><img border="0" src="http://dl.dropbox.com/u/4910414/menuwidget/img/iconosminis/blogger.jpg" title="Crear un Blog en Blogger" /></a></td><td><a href="http://jm-manuales.blogspot.com/2011/11/editar-y-publicar-entradas.html" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;"><img border="0" src="http://dl.dropbox.com/u/4910414/menuwidget/img/iconosminis/entradas.jpg" title="Crear y publicar entradas" /></a></td><td><a href="http://jm-manuales.blogspot.com/2011/11/paginas-en-el-blog.html" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;"><img border="0" src="http://dl.dropbox.com/u/4910414/menuwidget/img/iconosminis/paginas.jpg" title="Páginas en el Blog" /></a></td><td><a href="http://jm-manuales.blogspot.com/search/label/Crear%20un%20Blog%20en%20Blogger%20%3A%20%20%20%20%20%20%20%20Configuraci%C3%B3n" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;"><img border="0" src="http://dl.dropbox.com/u/4910414/menuwidget/img/iconosminis/configuracion.jpg" title="Configuración del Blog" /></a></td><td><a href="http://jm-manuales.blogspot.com/search/label/Plantillla%20%20del%20Blog" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;"><img border="0" src="http://dl.dropbox.com/u/4910414/menuwidget/img/iconosminis/plantillas.jpg" title="Plantilla del Blog" /></a></td><td><a href="http://jm-manuales.blogspot.com/search/label/Enlaces%20en%20mi%20Blog" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;"><img border="0" src="http://dl.dropbox.com/u/4910414/menuwidget/img/iconosminis/enlaces.jpg" title="Enlaces en mi Blog " /></a></td><td><a href="http://jm-manuales.blogspot.com/search/label/Im%C3%A1genes%20y%20v%C3%ADdeos%20en%20el%20Blog" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;"><img border="0" src="http://dl.dropbox.com/u/4910414/menuwidget/img/iconosminis/imagenesvid.jpg" title="Imágenes y vídeos en el Blog" /></a></td></tr>
<tr><td><a href="http://jm-manuales.blogspot.com/search/label/Im%C3%A1genes%20y%20v%C3%ADdeos%3A%20Picasa" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;"><img border="0" src="http://dl.dropbox.com/u/4910414/menuwidget/img/iconosminis/picasa.jpg" title="Álbumes de Picasa" /></a> </td><td><a href="" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;"><img border="0" src="http://dl.dropbox.com/u/4910414/menuwidget/img/iconosminis/picnik%20.jpg" title="Imágenes con Picnik" /></a> </td><td><a href="http://jm-manuales.blogspot.com/search/label/V%C3%ADdeos%20en%20el%20Blog%3A%20Google" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;"><img border="0" src="http://dl.dropbox.com/u/4910414/menuwidget/img/iconosminis/google_video1.jpg" title="Vídeos de Google" /></a></td><td><a href="http://jm-manuales.blogspot.com/search/label/V%C3%ADdeos%20en%20el%20Blog%3A%20Vimeo" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;"><img border="0" src="http://dl.dropbox.com/u/4910414/menuwidget/img/iconosminis/vimeo.jpg" title="Vídeos de Vimeo" /></a> </td><td><a href="http://jm-manuales.blogspot.com/search/label/V%C3%ADdeos%20en%20el%20Blog%3A%20Youtube" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;"><img border="0" src="http://dl.dropbox.com/u/4910414/menuwidget/img/iconosminis/youtube.jpg" title="Vídeos de Youtube" /></a></td><td><a href="http://jm-manuales.blogspot.com/2011/01/documentos-con-scribd.html" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;"><img border="0" src="http://dl.dropbox.com/u/4910414/menuwidget/img/iconosminis/scribd.jpg" title="Documentos con Scribd" /></a></td><td><a href="http://jm-manuales.blogspot.com/2010/11/musica-en-en-blog.html" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;"><img border="0" src="http://dl.dropbox.com/u/4910414/menuwidget/img/iconosminis/Musica.jpg" title="Música en el Blog" /></a></td></tr>
<tr><td><a href="http://jm-manuales.blogspot.com/search/label/Tablas%20en%20el%20Blog" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;"><img border="0" src="http://dl.dropbox.com/u/4910414/menuwidget/img/iconosminis/www.tablas5.jpg" title="Tablas en el Blog" /></a></td><td><a href="http://jm-manuales.blogspot.com/search/label/V%C3%ADdeotutorial%20en%20entrada%20del%20Blog" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;"><img border="0" src="http://dl.dropbox.com/u/4910414/menuwidget/img/iconosminis/videotut.jpg" title="Videoturiales en el Blog" /></a></td><td><a href="http://jm-manuales.blogspot.com/search/label/Espacios%20en%20la%20red%3A%20Dropbox" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;"><img border="0" src="http://dl.dropbox.com/u/4910414/menuwidget/img/iconosminis/dropbox.jpg" title="Espacios en la red: Dropbox" /></a> </td><td><a href="http://jm-manuales.blogspot.com/2011/01/jclic-hot-potatoes-en-mi-blog.html" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;"><img border="0" src="http://dl.dropbox.com/u/4910414/menuwidget/img/iconosminis/jclic.jpg" title="Jclic-Hot Potatoes" /></a></td><td><a href="http://jm-manuales.blogspot.com/2011/11/menus-para-el-blog.html" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;"><img border="0" src="http://dl.dropbox.com/u/4910414/menuwidget/img/iconosminis/menu.jpg" title="Jclic-Hot Potatoes" /></a></td><td><a href="http://jm-manuales.blogspot.com/search/label/Instalar%20ActivInspire" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;"><img border="0" src="http://dl.dropbox.com/u/4910414/menuwidget/img/iconosminis/ActivInspire.jpg" title="Instalar ActivInspire" /></a></td><td><a href="http://jm-manuales.blogspot.com/search/label/Manual%20ActivInspire" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;"><img border="0" src="http://dl.dropbox.com/u/4910414/menuwidget/img/iconosminis/manual%20activinsopire.jpg" title="Manual ActivInspire" /></a></td></tr>
<tr><td><a >="" href="http://jm-manuales.blogspot.com/2011/01/manuales-del-blog.html" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;"><img border="0" src="http://dl.dropbox.com/u/4910414/img/imag_04.jpg" title="Manuales del Blog" /></a></td><td><a href="http://jm-manuales.blogspot.com/2011/11/menu-blog.html" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;"><img border="0" src="http://dl.dropbox.com/u/4910414/img/menusicono.jpg" title="Nube de entradas" /></a></td><td><a href="http://jm-manuales.blogspot.com/2011/01/multimedia-en-el-blog.html" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;"><img border="0" src="http://dl.dropbox.com/u/4910414/img/icono_02.jpg" title="Multimedia en el Blog" /></a></td><td><a href="http://jm-manuales.blogspot.com/2010/12/ver-un-pdf-en-mi-blog.html" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;"><img border="0" src="http://dl.dropbox.com/u/4910414/img/icono.jpg" title="Documentos en el Blog" /></a></td><td><a href="http://jm-manuales.blogspot.com/2010/11/prueba_1837.html" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;"><img border="0" src="http://dl.dropbox.com/u/4910414/img/iconopres.jpg" title="Fotografías en el Blog" /></a></td><td><a href="http://jm-manuales.blogspot.com/2011/02/video-tutoriales-activinspire.html" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;"><img border="0" src="http://dl.dropbox.com/u/4910414/img/inspire02.jpg" title="Videotutoriales ActivInspire" /></a></td><td><a href="http://jm-manuales.blogspot.com/2011/10/videotutoriales-smartboard.html" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;"><img border="0" src="http://dl.dropbox.com/u/4910414/img/smartboard%20.jpg" title="Videotutoriales SmartBoard" /></a></td></tr>
</tbody></table></div><br />
<br />
Para una entrada o página de nuestro Blog, puede resultar interesante o llamativo mostrar un menú de este tipo. No requiere más que colocar las imágenes con su enlace dentro de una <a href="http://jm-manuales.blogspot.com/search/label/Tablas%20en%20el%20Blog">tabla</a>.<br />
<br />
Ejemplo de código html de una tabla con dos filas y tres columnas:<br />
(sin color de fondo,borde "1", y 40% de la anchura de la entrada)<br />
<br />
<div align="center"><br />
<table bgcolor="" border="1" cellpadding="1" style="width:40%;"><br />
<tbody><br />
<tr><td> imagen 1</td><td>imagen 2</td><td> imagen 3</td></tr><br />
<tr><td> imagen 4</td><td>imagen 5</td><td> imagen 6</td></tr> <br />
</tbody><br />
</table> <br />
</div><br />
<br />
<div align="center"><table bgcolor="" border="1" cellpadding="1" style="width: 40%;"><tbody>
<tr><td>imagen 1</td><td>imagen 2</td><td>imagen 3</td></tr>
<tr><td>imagen 4</td><td>imagen 5</td><td>imagen 6</td></tr>
</tbody> </table></div><br />
Si sustituimos donde aparece imagen nº por el código (en <a href="http://jm-manuales.blogspot.com/2011/11/menus-para-el-blog.html">Menús para el Blog</a>):<br />
<br />
<a href="....." style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;"><img border="0" src="......." title="......" /></a><br />
<br />
<br />
Obtendríamos una tabla centrada en la entrada o página, con las imágenes y sus enlaces. <br />
Añadimos filas: <tr> </tr> (antes de cerrar el cuerpo de la tabla </tbody>) <br />
Añadimos celdas: <td> </td> (dentro de cada fila)jmhttp://www.blogger.com/profile/06735669513942778347noreply@blogger.comtag:blogger.com,1999:blog-9199212839278399243.post-57449945498918185662011-11-28T20:24:00.005+01:002011-11-28T22:39:07.818+01:00Entradas del Blog<object type="application/x-shockwave-flash" data="https://sites.google.com/site/sulcavier/home/tagcloud.swf" id="tagcloudflash" name="tagcloudflash" bgcolor="#CBE1AE" quality="full" wmode="transparent" width="750" height="500" allowscriptaccess="always"> <param name="movie" value="https://sites.google.com/site/sulcavier/home/tagcloud.swf" /><param name="bgcolor" value="#333333" /><param name="flashvars" value="tcolor=0x007F7F7Fcc&mode=tags&distr=false&tspeed=100&tagcloud=<tags>
<a href='http://jm-manuales.blogspot.com/search/label/Crear%20un%20Blog%20en%20Blogger'style='10'>CREAR BLOG</a>
<a href='http://jm-manuales.blogspot.com/2011/11/editar-y-publicar-entradas.html' style='10'>CREAR ENTRADAS</a>
<a href='http://jm-manuales.blogspot.com/2011/11/paginas-en-el-blog.html' style='10'>CREAR PÁGINAS</a>
<a href='http://jm-manuales.blogspot.com/search/label/Crear%20un%20Blog%20en%20Blogger%20%3A%20%20%20%20%20%20%20%20Configuraci%C3%B3n' style='10'>CONFIGURACIÓN</a>
<a href='http://jm-manuales.blogspot.com/search/label/Plantillla%20%20del%20Blog' style='10'>PLANTILLA DEL BLOG</a>
<a href='http://jm-manuales.blogspot.com/search/label/Enlaces%20en%20mi%20Blog' style='10'>ENLACES DEL BLOG</a>
<a href='http://jm-manuales.blogspot.com/search/label/Im%C3%A1genes%20y%20v%C3%ADdeos%20en%20el%20Blog' style='10'>IMÁGENES Y VÍDEOS</a>
<a href='http://jm-manuales.blogspot.com/search/label/Im%C3%A1genes%20y%20v%C3%ADdeos%3A%20Picasa' style='10'>PICASA EN EL BLOG</a>
<a href='http://jm-manuales.blogspot.com/search/label/Im%C3%A1genes%20y%20v%C3%ADdeos%3A%20Picnik' style='10'>IMÁGENES CON PICNIK</a>
<a href='http://jm-manuales.blogspot.com/search/label/V%C3%ADdeos%20en%20el%20Blog%3A%20Google' style='10'>VÍDEOS DE GOOGLE</a>
<a href='http://jm-manuales.blogspot.com/search/label/V%C3%ADdeos%20en%20el%20Blog%3A%20Vimeo' style='10'>VÍDEOS DE VIMEO</a>
<a href='http://jm-manuales.blogspot.com/search/label/V%C3%ADdeos%20en%20el%20Blog%3A%20Youtube' style='10'>VÍDEOS DE YOUTUBE</a>
<a href='http://jm-manuales.blogspot.com/2011/01/documentos-con-scribd.html' style='10'>DOCUMENTOS CON SCRIBD</a>
<a href='http://jm-manuales.blogspot.com/search/label/M%C3%BAsica%20en%20el%20Blog' style='10'>MÚSICA EN EL BLOG</a>
<a href='http://jm-manuales.blogspot.com/search/label/Tablas%20en%20el%20Blog' style='10'>TABLAS EN EL BLOG</a>
<a href='http://jm-manuales.blogspot.com/search/label/V%C3%ADdeotutorial%20en%20entrada%20del%20Blog' style='10'>VIDEOTUTORIALES EN EL BLOG</a>
<a href='http://jm-manuales.blogspot.com/search/label/Espacios%20en%20la%20red%3A%20Dropbox' style='10'>EN LA RED: DROPBOX</a>
<a href='http://jm-manuales.blogspot.com/2011/01/jclic-hot-potatoes-en-mi-blog.html' style='10'>JCLIC - HOT POTATOES</a>
<a href='http://jm-manuales.blogspot.com/2011/11/menus-para-el-blog.html' style='10'>MENÚS PARA EL BLOG</a>
<a href='http://jm-manuales.blogspot.com/2011/02/video-tutoriales-activinspire.html' style='10'>PIZARRA PROMETHEAN</a>
<a href='http://jm-manuales.blogspot.com/2011/10/videotutoriales-smartboard.html' style='10'>PIZARRA SMART</a>
<a href='http://jm-manuales.blogspot.com/search/label/Manual%20ActivInspire' style='10'>MANUAL ACTIVINSPIRE</a>
</tags>" /></object>jmhttp://www.blogger.com/profile/06735669513942778347noreply@blogger.comtag:blogger.com,1999:blog-9199212839278399243.post-39930324328847526072011-11-28T02:36:00.018+01:002013-05-29T12:58:25.987+02:00Menús para el Blog<div style="text-align: center;">
<div style="text-align: justify;">
Si necesitamos para nuestro Blog un menú de navegación, Blogger nos ofrece algunas posibilidades que pueden parecernos útiles y suficientes:</div>
</div>
<br />
<b style="background-color: #d9ead3; color: #783f04;">1ª.-</b><span style="background-color: #d9ead3; color: #783f04;"> </span>Utilizar el Gadget de páginas y colocarlo en el lugar deseado, normalmente debajo de la cabecera del Blog.<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="http://dl.dropbox.com/u/13192487/menus/menus.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="307" src="http://dl.dropbox.com/u/13192487/menus/menus.jpg" width="640" /></a></div>
<br />
Si tenemos cierto numero de páginas, Blogger las coloca como vemos en la imagen.<br />
<br />
<b style="background-color: #d9ead3; color: #783f04;">2ª.-</b><span style="background-color: #d9ead3; color: #783f04;"> </span>Utilizar el Gadget Lista de enlaces, que normalmente colocamos en la zona lateral de nuestro Blog.<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://dl.dropboxusercontent.com/u/13192487/menus/menu701.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="245" src="https://dl.dropboxusercontent.com/u/13192487/menus/menu701.jpg" width="320" /></a></div>
<br />
Para configurar la lista, le indicamos el <b>Título</b> (Contenido, Índice...), la <b>dirección URL</b> exacta de la entrada o página a mostrar y el nombre que queremos que aparezca en la lista. La URL exacta de una entrada la obtenemos :<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://dl.dropboxusercontent.com/u/13192487/menus/menu702.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://dl.dropboxusercontent.com/u/13192487/menus/menu702.jpg" /></a></div>
<br />
En nuestra lista de entradas, hacemos clic en la opción <b>Ver</b>.<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="http://dl.dropbox.com/u/13192487/menus/menu8.jpeg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="242" src="http://dl.dropbox.com/u/13192487/menus/menu8.jpeg" width="400" /></a></div>
<br />
<br />
Una vez que tenemos la entrada en pantalla copiamos la dirección.<br />
Si un enlace se dirige a una página, hacemos clic en <b>Páginas</b>. En nuestra lista de páginas , hacemos clic en la opción Ver . Una vez en la pantalla copiamos la dirección.<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://dl.dropboxusercontent.com/u/13192487/menus/menu704.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="333" src="https://dl.dropboxusercontent.com/u/13192487/menus/menu704.jpg" width="400" /></a></div>
<br />
<br />
<br />
<br />
<br />
Si lo que nos interesa en nuestra lista de enlaces es que aparezcan algunos de esta forma:<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="http://dl.dropbox.com/u/13192487/menus/menu5.jpeg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="400" src="http://dl.dropbox.com/u/13192487/menus/menu5.jpeg" width="221" /></a></div>
<br />
Podemos utilizar otra posibilidad.<br />
<br />
<b style="background-color: #d9ead3; color: #783f04;">3ª.-</b><span style="background-color: #d9ead3; color: #783f04;"> </span>Utilizar el Gadget <b>HTML/Javascript</b> y escribir el código completo que nos permita visualizar la lista de esa forma.<br />
<div class="separator" style="clear: both; text-align: center;">
</div>
<br />
Este es el código de los primeros enlaces de mi Menú de Contenidos. Los puntos suspensivos es donde deben de estar colocadas las URL exactas de la entrada o página correspondiente.<br />
<br />
<a href="........................................................................">Crear un Blog en Blogger</a><br /><br />
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp<a href=".................">Crear y publicar entradas</a><br /> <br />
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp<a href=".................">Páginas en el Blog</a><br /> <br />
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp<a href=".................">Configuración del Blog</a><br /><br />
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp<a href=".................">Plantilla del Blog</a><br /><br />
<a href="........................................................................">Enlaces en mi Blog </a> <br /><br />
<br />
Se puede copiar de aquí mismo (pegar en Edición Html), sustituir los puntos suspensivos por la Url correspondiente y cambiar los títulos que apareceran en el menú.<br />
<br />
<br />
<b style="background-color: #d9ead3; color: #783f04;">4ª.-</b><span style="color: #783f04;"> </span>Utilizar un menú con imágenes que aparte de llamativo (según lo consideremos) nos permite aprovechar el espacio disponible en nuestra plantilla . En este Blog utilizo un menú lateral de este tipo.<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="http://dl.dropbox.com/u/4910414/img/menuimg.jpeg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><br />
</a></div>
<br />
<br />
<br />
<a href=".........." style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;"><img border="0" src="................." title="............"/></a><br />
<a href=".........." style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;"><img border="0" src="................." title="............"/></a><br />
<a href=".........." style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;"><img border="0" src="................." title="............"/></a><a href=".........." style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;"><img border="0" src="................." title="............"/></a><br />
<br />
<br />
Éste es el código colocado en un gadget lateral de este Blog. Lo podemos copiar y sustituir :<br />
Los puntos suspensivos de<b> href </b> por la <b>url a visitar.</b> <br />
Los puntos suspensivos de<b> src </b>por la <b>url de nuestra imagen.</b><br />
Los puntos suspensivos de<b> title </b>por <b>el texto emergente </b>que aparece al pasar el ratón sobre la imagen.<br />
<br />
Cuidado con eliminar las comillas.<br />
<br />
Podemos utilizar un <a href="http://jm-manuales.blogspot.com/2011/12/menu-de-imagenes.html">menú de imágenes</a> en el contenido de una entrada o página de nuestro Blog, si lo consideramos necesario o llamativo.<br />
<br />
<center>
<a href="http://dl.dropbox.com/u/4910414/img/menuimg.jpeg" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="185" src="http://dl.dropbox.com/u/4910414/img/menuimg.jpeg" width="320" /></a><br />
<br />
</center>
<div style="text-align: center;">
</div>
<b style="background-color: #d9ead3; color: #783f04;">5ª.-</b><span style="color: #783f04;"> </span><br />
<br />
Por último, si lo queremos es algo mucho más complejo:<br />
<br />
<ul class="pureCssMenu pureCssMenum">
<li class="pureCssMenui0"><a class="pureCssMenui0" href="http://jm-manuales.blogspot.com/2011/11/menus-para-el-blog.html">Página Inicio</a></li>
<li class="pureCssMenui0"><a class="pureCssMenui0" href="http://jm-manuales.blogspot.com/2011/11/menus-para-el-blog.html">Página 1</a> <ul class="pureCssMenum">
<li class="pureCssMenui"><a class="pureCssMenui" href="http://jm-manuales.blogspot.com/2011/11/menus-para-el-blog.html">Página 1.1</a></li>
<li class="pureCssMenui"><a class="pureCssMenui" href="http://jm-manuales.blogspot.com/2011/11/menus-para-el-blog.html">Página 1.2</a></li>
<li class="pureCssMenui"><a class="pureCssMenui" href="http://jm-manuales.blogspot.com/2011/11/menus-para-el-blog.html">Página 1.3</a> <ul class="pureCssMenum">
<li class="pureCssMenui"><a class="pureCssMenui" href="http://jm-manuales.blogspot.com/2011/11/menus-para-el-blog.html">Página 1.3.1</a></li>
<li class="pureCssMenui"><a class="pureCssMenui" href="http://jm-manuales.blogspot.com/2011/11/menus-para-el-blog.html">Página 1.3.2</a></li>
<li class="pureCssMenui"><a class="pureCssMenui" href="http://jm-manuales.blogspot.com/2011/11/menus-para-el-blog.html">Página 1.3.3</a></li>
</ul>
</li>
</ul>
</li>
<li class="pureCssMenui0"><a class="pureCssMenui0" href="http://jm-manuales.blogspot.com/2011/11/menus-para-el-blog.html">Página 2</a> <ul class="pureCssMenum">
<li class="pureCssMenui"><a class="pureCssMenui" href="http://jm-manuales.blogspot.com/2011/11/menus-para-el-blog.html">Página 2.1</a></li>
<li class="pureCssMenui"><a class="pureCssMenui" href="http://jm-manuales.blogspot.com/2011/11/menus-para-el-blog.html">Página 2.2</a></li>
<li class="pureCssMenui"><a class="pureCssMenui" href="http://jm-manuales.blogspot.com/2011/11/menus-para-el-blog.html">Página 2.3</a></li>
</ul>
</li>
<li class="pureCssMenui0"><a class="pureCssMenui0" href="http://jm-manuales.blogspot.com/2011/11/menus-para-el-blog.html">Página 3</a> <ul class="pureCssMenum">
<li class="pureCssMenui"><a class="pureCssMenui" href="http://jm-manuales.blogspot.com/2011/11/menus-para-el-blog.html">Página 3.1</a> <ul class="pureCssMenum">
<li class="pureCssMenui"><a class="pureCssMenui" href="http://jm-manuales.blogspot.com/2011/11/menus-para-el-blog.html">Página 3.1.1</a></li>
<li class="pureCssMenui"><a class="pureCssMenui" href="http://jm-manuales.blogspot.com/2011/11/menus-para-el-blog.html">Página 3.1.2</a></li>
<li class="pureCssMenui"><a class="pureCssMenui" href="http://jm-manuales.blogspot.com/2011/11/menus-para-el-blog.html">Página 3.1.3</a> <ul class="pureCssMenum">
<li class="pureCssMenui"><a class="pureCssMenui" href="http://jm-manuales.blogspot.com/2011/11/menus-para-el-blog.html">Página 3.1.3.1</a></li>
<li class="pureCssMenui"><a class="pureCssMenui" href="http://jm-manuales.blogspot.com/2011/11/menus-para-el-blog.html">Página 3.1.3.2</a></li>
</ul>
</li>
</ul>
</li>
<li class="pureCssMenui"><a class="pureCssMenui" href="http://jm-manuales.blogspot.com/2011/11/menus-para-el-blog.html">Página 3.2</a></li>
<li class="pureCssMenui"><a class="pureCssMenui" href="http://jm-manuales.blogspot.com/2011/11/menus-para-el-blog.html">Página 3.3</a></li>
<li class="pureCssMenui"><a class="pureCssMenui" href="http://jm-manuales.blogspot.com/2011/11/menus-para-el-blog.html">Página 3.4</a> <ul class="pureCssMenum">
<li class="pureCssMenui"><a class="pureCssMenui" href="http://jm-manuales.blogspot.com/2011/11/menus-para-el-blog.html">Página 3.4.1</a></li>
<li class="pureCssMenui"><a class="pureCssMenui" href="http://jm-manuales.blogspot.com/2011/11/menus-para-el-blog.html">Página 3.4.2</a></li>
</ul>
</li>
</ul>
</li>
<li class="pureCssMenui0"><a class="pureCssMenui0" href="http://jm-manuales.blogspot.com/2011/11/menus-para-el-blog.html">Página 4</a> <ul class="pureCssMenum">
<li class="pureCssMenui"><a class="pureCssMenui" href="http://jm-manuales.blogspot.com/2011/11/menus-para-el-blog.html">Página 4.1</a></li>
<li class="pureCssMenui"><a class="pureCssMenui" href="http://jm-manuales.blogspot.com/2011/11/menus-para-el-blog.html">Página 4.2</a> <ul class="pureCssMenum">
<li class="pureCssMenui"><a class="pureCssMenui" href="http://jm-manuales.blogspot.com/2011/11/menus-para-el-blog.html">Página 4.2.1</a></li>
<li class="pureCssMenui"><a class="pureCssMenui" href="http://jm-manuales.blogspot.com/2011/11/menus-para-el-blog.html">Página 4.2.2</a></li>
<li class="pureCssMenui"><a class="pureCssMenui" href="http://jm-manuales.blogspot.com/2011/11/menus-para-el-blog.html">Página 4.2.3</a></li>
</ul>
</li>
</ul>
</li>
<li class="pureCssMenui0"><a class="pureCssMenui0" href="http://jm-manuales.blogspot.com/2011/11/menus-para-el-blog.html">Página 5</a> <ul class="pureCssMenum">
<li class="pureCssMenui"><a class="pureCssMenui" href="http://jm-manuales.blogspot.com/2011/11/menus-para-el-blog.html">Página 5.1</a></li>
<li class="pureCssMenui"><a class="pureCssMenui" href="http://jm-manuales.blogspot.com/2011/11/menus-para-el-blog.html">Página 5.2</a></li>
</ul>
</li>
<li class="pureCssMenui0"><a class="pureCssMenui0" href="http://jm-manuales.blogspot.com/2011/11/menus-para-el-blog.html">Página 6</a> <ul class="pureCssMenum">
<li class="pureCssMenui"><a class="pureCssMenui" href="http://jm-manuales.blogspot.com/2011/11/menus-para-el-blog.html">Página 6.1</a></li>
<li class="pureCssMenui"><a class="pureCssMenui" href="http://jm-manuales.blogspot.com/2011/11/menus-para-el-blog.html">Página 6.2</a></li>
</ul>
</li>
</ul>
<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="http://dl.dropbox.com/u/4910414/blogger/menu3003.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="339" src="http://dl.dropbox.com/u/4910414/blogger/menu3003.jpg" width="640" /></a></div>
<br />
Éste es un menú desplegable colocado en la cabecera del Blog. Para colocarlo en nuestro Blog tendríamos que seguir un proceso:<br />
<div style="text-align: center;">
<a href="http://jm-manuales.blogspot.com/2011/12/purecssmenu-en-mi-blog.html">PureCssMenú en mi Blog.</a></div>
<div style="text-align: center;">
<br /></div>
<div style="text-align: center;">
<a href="http://jm-manuales.blogspot.com/2011/12/purecssmenu-en-mi-blog-m2.html">PureCssMenú en mi Blog 2.</a></div>
<br />
<br />
<div style="text-align: center;">
******</div>
<br />
<br />
<br />jmhttp://www.blogger.com/profile/06735669513942778347noreply@blogger.comtag:blogger.com,1999:blog-9199212839278399243.post-12050083470093701222011-11-25T20:57:00.005+01:002013-01-28T18:44:57.268+01:00Crear, editar y publicar entradasCon nuestro Blog recién creado Blogger nos invitaba a comenzar a publicar. Si en ese momento no lo hicimos, para que nuestro Blog no esté vacío lo único que nos resta es comenzar a <b>crear entradas</b> y <b>publicarlas </b>. Nuestra aportación al Blog siempre será la misma, crear entradas y publicarlas o modificar el contenido de las existentes.<br />
Nuestro trabajo siempre comienza en el escritorio (aparece nada más entrar en nuestra cuenta ).<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
</div>
<div class="separator" style="clear: both; text-align: center;">
<a href="http://dl.dropbox.com/u/4910414/blogger/img09.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="184" src="http://dl.dropbox.com/u/4910414/blogger/img09.jpg" width="640" /></a></div>
<br />
El escritorio nos presenta la lista de <b>Blog </b>que tenemos publicados . Para entrar en el escritorio de cada <b>Blog </b>hacemos clic sobre su nombre.<br />
<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="http://dl.dropbox.com/u/4910414/blogger/img11.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="218" src="http://dl.dropbox.com/u/4910414/blogger/img11.jpg" width="640" /></a></div>
<br />
<br />
El escritorio del <b>Blog </b>nos presenta muchas opciones. Para crear una <b>nueva entrada</b>, en la parte superior nos aparece un botón con la imagen de un lápiz, hacemos clic sobre el.<br />
<br />
<b>Blogger </b>nos presenta el editor de entradas:<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="http://dl.dropbox.com/u/4910414/blogger/img12.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="212" src="http://dl.dropbox.com/u/4910414/blogger/img12.jpg" width="640" /></a></div>
<br />
<br />
<br />
En este editor es donde daremos nombre a nuestra entrada (hacemos clic en Título de la entrada y lo escribimos) . Desarrollaremos el contenido con el texto, imágenes, vídeos., que deseemos.<br />
El editor nos ofrece dos maneras de trabajo, mediante las pestañas<b><u> </u></b> <b>Redactar y HTML</b>. Nuestro trabajo normal lo desarrollaremos siempre con la pestaña <b>Redactar</b> activada (con el fondo más destacado) el editor en este modo de trabajo nos ofrece más botones de herramientas para desarrollar nuestras entradas. Únicamente cuando necesitemos insertar en nuestra entrada código HTML, utilizaremos la pestaña <u><b>HTML</b></u> .<br />
<br />
<br />
<br />
En la parte derecha del Editor aparece el menú de <span style="color: #e69138;"><b>Configuración de la entrada </b></span>. En la primera opción ...<b>Etiquetas, </b> podemos clasificar nuestras entradas mediante un nombre o varios, separados por comas. Es una opcion interesante para cuando tengamos cierto volumen de entradas, nos permite clasificarlas y utilizarlas a modo de menú en el Blog.<br />
<br />
Cuando nuestra entrada la tenemos lista, podemos hacer clic en <b>VISTA PREVIA</b>, para ver como quedaría en nuestro Blog y si nos parece correcta, clic en <b>PUBLICAR </b> (indispensable si queremos que aparezca en el Blog).jmhttp://www.blogger.com/profile/06735669513942778347noreply@blogger.comtag:blogger.com,1999:blog-9199212839278399243.post-52789790344559487402011-11-25T14:55:00.003+01:002013-01-28T19:34:03.614+01:00Páginas en el BlogSi nos parece interesante o necesario, podemos incluir páginas estáticas en nuestro Blog.<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="http://dl.dropbox.com/u/4910414/img/paginas32.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="251" src="http://dl.dropbox.com/u/4910414/img/paginas32.jpg" width="640" /></a></div>
<br />
<br />
Las entradas de nuestro Blog se presentan en la página principal y por defecto la ultima entrada aparece siempre en primer lugar. Las páginas estáticas no contienen ninguna entrada, todo su contenido lo definimos nosotros cuando creamos la página o podemos editarla para hacerle modificaciones cuando necesitemos.<br />
<br />
Para crear páginas estáticas :<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
</div>
<div class="separator" style="clear: both; text-align: center;">
<a href="http://dl.dropbox.com/u/4910414/blogger/img14.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="346" src="http://dl.dropbox.com/u/4910414/blogger/img14.jpg" width="400" /></a></div>
En el escritorio del Blog , en la parte izquierda hacemos clic en la opción <b>Páginas</b>. Nos aparece El botón <b>Página nueva</b>:<br />
<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="http://dl.dropbox.com/u/4910414/blogger/img15.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="197" src="http://dl.dropbox.com/u/4910414/blogger/img15.jpg" width="320" /></a></div>
Al hacer clic en Página nueva , debemos indicarle (haciendo clic) si queremos una <b>Página en blanco</b> o un vínculo a una <b>Dirección Web</b> (otro Blog o Web ). Para crear nuestra página hacemos clic en <b>Página en blanco</b>.<br />
<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="http://dl.dropbox.com/u/4910414/blogger/img16.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="193" src="http://dl.dropbox.com/u/4910414/blogger/img16.jpg" width="640" /></a></div>
<br />
<br />
Nos aparece el Editor para que demos nombre a nuestra página y desarrollemos su contenido, que podemos modificar en cualquier momento editando la página.<br />
Como hacemos con las entradas podemos hacer una <b>Vista previa</b> , para observar como queda nuestra página y hacer clic en <b>Publicar </b>.<br />
<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="http://dl.dropbox.com/u/4910414/blogger/img19.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="224" src="http://dl.dropbox.com/u/4910414/blogger/img19.jpg" width="640" /></a></div>
<br />
<br />
Al hacer clic en Publicar, nuestra página está grabada, pero no se mostrará en nuestro Blog hasta que no completemos el siguiente proceso:<br />
<br />
<b>1º</b> Hacemos clic en el botón <b>No mostrar</b> y seleccionamos entre Pestañas principales o Enlaces laterales.<br />
<br />
<b>2º</b> Hacemos clic en Guardar disposición.<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<br /></div>
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<span style="background-color: #f1c232;"></span>jmhttp://www.blogger.com/profile/06735669513942778347noreply@blogger.comtag:blogger.com,1999:blog-9199212839278399243.post-68103285173599514752011-11-24T20:43:00.002+01:002012-09-02T13:49:05.198+02:00Visor de documentos de GoogleEl visor de documentos de Google, presenta nuestros documentos en el Blog:<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="http://dl.dropbox.com/u/4910414/img/visorgoogle1.jpeg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="300" src="http://dl.dropbox.com/u/4910414/img/visorgoogle1.jpeg" width="640" /></a></div>
<br />
Como vemos en la parte superior de la ventana del visor aparece la opción de ..<b> Abrir en una ventana nueva</b>. <br />
Actualmente esta opción presenta estas características:<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="http://dl.dropbox.com/u/4910414/img/visorgoogle2.jpeg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="212" src="http://dl.dropbox.com/u/4910414/img/visorgoogle2.jpeg" width="640" /></a></div>
<br />
<br />
Al hacer clic en esa opción, el documento se muestra a pantalla completa . Nuestro lector puede imprimir el documento (Clic en su icono ) o incluso descargarlo , desplegando las opciones del menú Archivo. Además si nuestro lector tiene una cuenta de Google abierta en su navegador (Gmail, blogger...) en la parte superior derecha del visor Google le añade automáticamente varios botones (Guardar en...), como vemos en la imagen .jmhttp://www.blogger.com/profile/06735669513942778347noreply@blogger.comtag:blogger.com,1999:blog-9199212839278399243.post-74023137508437210812011-10-15T00:21:00.006+02:002012-08-25T02:12:15.983+02:00Videotutoriales SmartBoardVideotutoriales del <a target="_blank" href="http://calasanz.edu.gva.es/pdi/videotutoriales.html">CEIP San José de Calasanz</a> para Smartboard Notebook 10<br />
<br />
<div align="left"><iframe align="middle" frameborder="0" height="560" marginheight="4" marginwidth="2" name="todos en uno" scrolling="no" src="http://dl.dropbox.com/u/4910414/smartboard/index.html" width="708"></iframe></div><br />
<br />
<br />
Videotutoriales realizados por <a target="_blank" href="http://alumnosprimaria.blogspot.com/">Julita Fernández </a> del CEIP Padre Manjón de Burgos.<br />
<div align="left"><iframe align="middle" frameborder="0" height="560" marginheight="4" marginwidth="2" name="todos en uno" scrolling="no" src="http://dl.dropbox.com/u/4910414/smartboard/ceip_burgos/index.html" width="708"></iframe></div><br />
<br />
Curso completo de Notebook 10 de Stherllorca con 27 videotutoriales. <br />
<iframe width="708" height="560" src="http://www.youtube.com/embed/videoseries?list=PL98BD9EC620DA0D56&hl=es_ES" frameborder="0" allowfullscreen></iframe>jmhttp://www.blogger.com/profile/06735669513942778347noreply@blogger.comtag:blogger.com,1999:blog-9199212839278399243.post-85871248610571072152011-02-07T23:34:00.017+01:002012-08-25T02:11:22.640+02:00Videotutoriales ActivInspireVideotutoriales para ActivInspire- Studio </br> <div align="left"><iframe align="middle" frameborder="0" height="560" marginheight="2" marginwidth="2" name="todos en uno" scrolling="no" src="http://dl.dropbox.com/u/4910414/studio/index.html" width="708"></iframe></div><br />
<div align="center">Un buen conjunto de videotutoriales sobre ActivInspire Primary realizados por <a target="_blank" href="http://jesusalonsorueda.webnode.es/pizarra-digital/video-tutoriales/activinspire-pdi-promethean-/interfaz-del-programa/">Jesús Alberto Alonso Rueda</a>.<br />
<br />
<div align="left"><iframe align="middle" frameborder="0" height="560" marginheight="2" marginwidth="2" name="todos en uno" scrolling="no" src="http://dl.dropbox.com/u/4910414/videotutoriales/index.html" width="708"></iframe></div><br />
<br />
<br />
******************************************************************************</div><br />
<div align="center">Algunos videoturiales que encontramos en la red.<br />
<br />
<iframe align="middle" en="" frameborder="0" height="450" marginheight="4" marginwidth="2" name="todos en uno" scrolling="no" src="http://dl.dropbox.com/u/4910414/osmplayer/index.html" uno="" width="600"></iframe></div>jmhttp://www.blogger.com/profile/06735669513942778347noreply@blogger.comtag:blogger.com,1999:blog-9199212839278399243.post-4988815029935908742011-01-27T00:16:00.007+01:002012-10-02T18:38:11.852+02:00Documentos con ScribdNuestro Blog de Blogger no permite que nuestras entradas tengan archivos alojados. Cuando necesitamos presentar algún archivo, debemos utilizar un servicio externo para alojarlo y presentarlo en nuestro Blog.<br />
Si no disponemos de un espacio Web propio, en la red encontramos espacios gratuitos donde alojar los archivos (que pasan a ser públicos) y mediante el código que nos genera ese espacio los insertamos en las entradas de nuestros Blogs.<br />
<a href="http://www.scribd.com/" target="_blank">Scribd </a>es un lugar que nos ofrece esa posibilidad. Es útil cuando queremos presentar manuales, documentos en pdf o presentaciones (permite gran variedad de formatos de archivo).<br />
<br />
Para utilizarlo no necesitamos registrarnos previamente en el sitio, simplemente tener un primer archivo para subirlo a su espacio.<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="http://dl.dropbox.com/u/4910414/img/scrib02.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="196" src="http://dl.dropbox.com/u/4910414/img/scrib02.jpg" width="640" /></a></div>
<br />
Entramos en su página y hacemos clic en el botón <b>Publicar </b>de su cabecera .<br />
Scribd nos presenta una nueva pantalla para que marquemos la opción deseada.<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="http://dl.dropbox.com/u/4910414/img/scrib03.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="482" src="http://dl.dropbox.com/u/4910414/img/scrib03.jpg" width="640" /></a></div>
<br />
En nuestro caso (vamos a subir nuestro primer archivo) hacemos clic en <b>Subir </b>(de la opción Seleccionar archivo)<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="http://dl.dropbox.com/u/4910414/img/scrib04.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="640" src="http://dl.dropbox.com/u/4910414/img/scrib04.jpg" width="580" /></a></div>
<br />
Seleccionamos el archivo a subir y hacemos clic en abrir.<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="http://dl.dropbox.com/u/4910414/img/scrib05.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="87" src="http://dl.dropbox.com/u/4910414/img/scrib05.jpg" width="400" /></a></div>
Antes de iniciarse el proceso de subida debemos de aceptar la condiciones del servicio.<br />
<br />
<br />
Al hacer clic en <b>Aceptar </b>la subida comienza y <b>Scribd </b>nos solicita una dirección de correo donde nos enviará una contraseña ( este correo y contraseña nos dará acceso a nuestro espacio en Scribd ).<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="http://dl.dropbox.com/u/4910414/img/scrib07.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="211" src="http://dl.dropbox.com/u/4910414/img/scrib07.jpg" width="640" /></a></div>
<br />
<br />
<b>Scribd </b>nos presenta nuestro espacio, que ya tiene un primer elemento. Para obtener el código que nos permitirá insertarlo en nuestro Blog , <b>seleccionamos el archivo</b> (clic sobre su imagen) y clic sobre la opción Share.<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="http://dl.dropbox.com/u/4910414/img/scrib08.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="594" src="http://dl.dropbox.com/u/4910414/img/scrib08.jpg" width="640" /></a></div>
<br />
En esta última pantalla es donde copiamos el código que pegaremos en la entrada de nuestro Blog. De los dos botones de <b>Copy </b>, el que nos interesa es el del apartado <b>Embed this document</b>, pero antes de hacer clic sobre el código (para seleccionarlo) y clic en Copy (para copiarlo), miramos lo que aparece encima y debajo de este código:<br />
<ol>
<li>Nos debemos de asegurar que el código corresponde a la pestaña <b>Standard HTML</b> (clic sobre ella).</li>
<li>Aceptamos los valores (debajo del código) o modificamos manualmente (desactivando auto) <b>Width</b> (anchura), <b>Height </b>(altura) o incluso si queremos efecto de <b>scroll </b>u otro (lista desplegable).</li>
</ol>
Ya podemos hacer <b>clic sobre el código</b> (para seleccionarlo) y<b> clic en Copy</b> (para copiarlo).<br />
<br />
Lo único que nos queda por hacer es situarnos en nuestra entrada del Blog y pegar ese código (pestaña <b>Edición de HTML </b>del editor activada).<br />
<br />
Así se vería nuestro documento en el Blog:<br />
<br />
<a href="http://www.scribd.com/doc/47612374/tablasenelblog" style="-x-system-font: none; display: block; font-family: Helvetica,Arial,Sans-serif; font-size-adjust: none; font-size: 14px; font-stretch: normal; font-style: normal; font-variant: normal; font-weight: normal; line-height: normal; margin: 12px auto 6px auto; text-decoration: underline;" title="View tablasenelblog on Scribd">tablasenelblog</a> <object data="http://d1.scribdassets.com/ScribdViewer.swf" height="500" id="doc_33442" name="doc_33442" style="outline: none;" type="application/x-shockwave-flash" width="450"> <param name="movie" value="http://d1.scribdassets.com/ScribdViewer.swf"><param name="wmode" value="opaque"><param name="bgcolor" value="#ffffff"><param name="allowFullScreen" value="true"><param name="allowScriptAccess" value="always"><param name="FlashVars" value="document_id=47612374&access_key=key-11a9lwmhekzy5sfldjas&page=1&viewMode=list"><embed id="doc_33442" name="doc_33442" src="http://d1.scribdassets.com/ScribdViewer.swf?document_id=47612374&access_key=key-11a9lwmhekzy5sfldjas&page=1&viewMode=list" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" height="500" width="450" wmode="opaque" bgcolor="#ffffff"></embed> </object>jmhttp://www.blogger.com/profile/06735669513942778347noreply@blogger.comtag:blogger.com,1999:blog-9199212839278399243.post-88914255636557026382011-01-25T19:46:00.009+01:002013-01-28T20:48:05.409+01:00Configuración del BlogCuando creamos nuestro Blog, Blogger establece una serie de opciones de <b>Configuración</b> por defecto que podemos modificar en cualquier momento. Para ver como está configurado nuestro Blog y poder modificar lo que queramos, lo podemos hacer desde la opción <b>Configuración </b>del escritorio del Blog.<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="http://dl.dropbox.com/u/4910414/blogger/img20.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="304" src="http://dl.dropbox.com/u/4910414/blogger/img20.jpg" width="640" /></a></div>
<br />
<br />
Haciendo clic en <b>Configuración</b> nos presenta sus distintas opciones distribuidas en varios apartados.<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
</div>
<div class="separator" style="clear: both; text-align: center;">
<a href="http://dl.dropbox.com/u/4910414/blogger/img21.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="476" src="http://dl.dropbox.com/u/4910414/blogger/img21.jpg" width="640" /></a></div>
<br />
<br />
<br />
En primer lugar nos aparece el apartado<b><span style="color: #f6b26b;"> Lo básico</span> . </b>Dentro de él podemos modificar (haciendo clic en <span style="color: #0b5394; font-weight: bold;">Editar</span><b>) </b>cualquiera de sus apartados. Podemos modificar el Título de nuestro Blog, añadir una descripción, modificar la dirección , etc..<br />
Cualquiera de estos apartados son interesantes, pero si queremos crear por ejemplo un <b>Blog de Aula</b> y permitir que los alumnos puedan participar como autores en este Blog. Dentro del apartado <b>Permisos </b>, hacemos clic en <b> </b><span style="color: #0b5394; font-weight: bold;">+ Añadir autores</span>.<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="http://dl.dropbox.com/u/4910414/blogger/img22.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="158" src="http://dl.dropbox.com/u/4910414/blogger/img22.jpg" width="400" /></a></div>
<br />
<br />
Al hacer clic, se abre un campo donde escribimos la dirección de correo de las personas que queremos invitar a ser autores (hacemos clic en<b> invitar a autores</b>). Se envía un correo automático desde Blogger para que los autores acepten .<br />
<br />
<br />
Por defecto el Blog está abierto a cualquier lector, pero podemos limitar el acceso :<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="http://dl.dropbox.com/u/4910414/blogger/img24.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="81" src="http://dl.dropbox.com/u/4910414/blogger/img24.jpg" width="640" /></a></div>
<br />
Haciendo clic en <u><span style="color: #0b5394;"><b>Editar</b></span></u>:<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
</div>
<div class="separator" style="clear: both; text-align: center;">
<a href="http://dl.dropbox.com/u/4910414/blogger/img23.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="387" src="http://dl.dropbox.com/u/4910414/blogger/img23.jpg" width="640" /></a></div>
<br />
<br />
Marcamos quién puede o no acceder a nuestro Blog.<br />
<br />
<br />
<br />
<br />
<ul></ul>
jmhttp://www.blogger.com/profile/06735669513942778347noreply@blogger.comtag:blogger.com,1999:blog-9199212839278399243.post-64056526232589148342011-01-19T11:53:00.000+01:002011-01-19T11:53:11.113+01:00slideshare<div style="width:425px" id="__ss_19153"><strong style="display:block;margin:12px 0 4px"><a href="http://www.slideshare.net/lalunaesmilugar/tutorial-de-slideshare" title="Tutorial de Slideshare">Tutorial de Slideshare</a></strong><object id="__sse19153" width="425" height="355"><param name="movie" value="http://static.slidesharecdn.com/swf/ssplayer2.swf?doc=tutorial-de-slideshare-3744&stripped_title=tutorial-de-slideshare&userName=lalunaesmilugar" /><param name="allowFullScreen" value="true"/><param name="allowScriptAccess" value="always"/><embed name="__sse19153" src="http://static.slidesharecdn.com/swf/ssplayer2.swf?doc=tutorial-de-slideshare-3744&stripped_title=tutorial-de-slideshare&userName=lalunaesmilugar" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="425" height="355"></embed></object><div style="padding:5px 0 12px">View more <a href="http://www.slideshare.net/">presentations</a> from <a href="http://www.slideshare.net/lalunaesmilugar">Karina Crespo- Ministerio de Educacion</a>.</div></div>jmhttp://www.blogger.com/profile/06735669513942778347noreply@blogger.comtag:blogger.com,1999:blog-9199212839278399243.post-23985729054908370922011-01-19T07:14:00.006+01:002011-11-27T02:39:08.150+01:00Instrucciones Dewslider<div align="center"><iframe frameborder="0" src="http://docs.google.com/gview?url=http://107.22.196.64/u/4910414/dewslider/instrucciones.pdf&embedded=true" style="height: 580px; width: 650px;"></iframe></div>jmhttp://www.blogger.com/profile/06735669513942778347noreply@blogger.comtag:blogger.com,1999:blog-9199212839278399243.post-89465163213887237892011-01-19T02:33:00.011+01:002012-08-25T02:00:34.076+02:00Jclic-Hot Potatoes en el BlogLas actividades creadas con Jclic y Hot Potatoes pueden resultarnos en algun momento muy útiles para nuestros Blogs.<br />
En la Web de Jclic podemos buscar directamente actividades que pueden interesarnos.<br />
Entramos en la busqueda de actividades : <a href="http://clic.xtec.cat/db/listact_es.jsp" target="_blank">Buscar actividades Jclic</a><br />
<div class="separator" style="clear: both; text-align: center;"><a href="http://dl.dropbox.com/u/4910414/img/planti18.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="295" src="http://dl.dropbox.com/u/4910414/img/planti18.jpg" width="400" /></a></div><br />
Debemos establecer los criterios de búsqueda (Área, Idioma y Nivel) como nos indica la ayuda desplegando las listas y marcando nuestra selección en cada caso. Pulsamos en buscar.<br />
<br />
<br />
<div class="separator" style="clear: both; text-align: center;"><a href="http://dl.dropbox.com/u/4910414/img/planti19.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="275" src="http://dl.dropbox.com/u/4910414/img/planti19.jpg" width="400" /></a></div> De la lista de resultados hacemos clic en el título de la que consideremos y se nos presenta la ventana de la actividad con los datos de la misma :<br />
<br />
<div class="separator" style="clear: both; text-align: center;"><a href="http://dl.dropbox.com/u/4910414/img/planti20.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="355" src="http://dl.dropbox.com/u/4910414/img/planti20.jpg" width="400" /></a></div><br />
En la parte inferior de esta ventana (izquierda) si hacemos clic en verlo, comprobamos la actividad y su secuencia. Si la consideramos utíl, a la derecha tenemos el campo <b>Código para incrustar</b> (hacemos clic dentro, lo seleccionamos y lo copiamos ). En el editor de entradas de Blogger (con la pestaña <b>Edición de HTML</b> activada) pegamos ese código y la actividad la tendríamos insertada en nuestro Blog.<br />
<br />
<div style="text-align: justify;">El proceso con las actividades creadas con <b>Hot Potatoes</b> es distinto. Este Programa genera el resultado final en formato Web HTML, por lo que lo normal y más facil es realizar <b>un enlace</b> a la página donde se encuentre directamente (se verá en una pestaña o ventana nueva si <a href="http://jm-manuales.blogspot.com/search/label/Enlaces%20en%20mi%20Blog">así lo indicamos en el enlace</a>).<br />
Un ejemplo con actividades con Hot Potatoes lo podeis <a target="_blank" href="http://www.juntadeandalucia.es/averroes/iesdiegogaitan/departamentos/departamentos/departamento_de_matemat/recursos/algebraconpapas/recurso/index.htm">ver ... aqui</a>.<br />
<br />
<br />
<br />
<br />
</div>jmhttp://www.blogger.com/profile/06735669513942778347noreply@blogger.comtag:blogger.com,1999:blog-9199212839278399243.post-77652385395356452232011-01-13T20:52:00.005+01:002013-01-27T20:16:52.597+01:00Crear un Blog en Blogger.Crearnos un Blog en Blogger es un proceso rápido y sencillo. Comenzamos introduciendo los datos de nuestra cuenta de Google (nuestro correo de Gmail). Si no tenemos cuenta, la creamos pulsando en Crear Cuenta.<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="http://dl.dropbox.com/u/4910414/blogger/img01.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="347" src="http://dl.dropbox.com/u/4910414/blogger/img01.jpg" width="640" /></a></div>
<br />
<br />
<a href="http://dl.dropbox.com/u/4910414/Un%20blog%20en%20Blogger.pdf" target="_blank">Proceso para crear el Blog. </a><br />
<br />
Éste es su contenido:<br />
<div align="center">
<iframe frameborder="0" src="http://docs.google.com/gview?url=http://dl.dropbox.com/u/4910414/Un%20blog%20en%20Blogger.pdf&embedded=true" style="height: 800px; width: 600px;"></iframe><br /></div>
jmhttp://www.blogger.com/profile/06735669513942778347noreply@blogger.comtag:blogger.com,1999:blog-9199212839278399243.post-53632008138640890552011-01-13T18:06:00.005+01:002011-01-13T18:11:13.667+01:00Música en el Blog<iframe src="http://docs.google.com/gview?url=http://dl.dropbox.com/u/4910414/Rep_dewplayer/instruccionesopcion1.pdf&embedded=true" style="width:600px; height:500px;" frameborder="0"></iframe>jmhttp://www.blogger.com/profile/06735669513942778347noreply@blogger.comtag:blogger.com,1999:blog-9199212839278399243.post-42102172542329194182011-01-11T20:17:00.024+01:002013-05-31T14:09:56.399+02:00Multimedia en el BlogSi disponemos de algún espacio en la Web, incluir multimedia en nuestros Blogs presenta algunas posibilidades que en algún momento nos pueden resultar bastantes interesantes. Cuando queramos incluir vídeos en nuestros Blogs podemos utilizar este espacio Web para almacenar tanto el reproductor como los vídeos. <br />
<div class="separator" style="clear: both; text-align: center;"><a href="http://dl.dropbox.com/u/4910414/img/dashplayer_06.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"> </a></div><div class="separator" style="clear: both; text-align: center;"><a href="http://dl.dropbox.com/u/4910414/img/dashplayer_06.jpg" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="27" src="http://dl.dropbox.com/u/4910414/img/dashplayer_06.jpg" width="320" /></a></div><br />
<a target="_blank" href="http://www.mediafront.org/project/osmplayer">OSM Player</a> podemos incrustarlo en nuestro Blog,Web, o enlazarlo para verlo en otra pestaña o ventana del navegador.<br />
En la lista de reproducción que le definimos podemos incluir desde distintos tipos de formato de vídeo (Ogg, M4v, Mp4, Flv,Ogv...)hasta vídeos de distinto origen(Youtube, Vimeo,Organismos Educativos... o propios en nuestro espacio Web).<br />
<br />
<div align="center"><iframe align="middle" en="" frameborder="0" height="450" marginheight="4" marginwidth="2" name="todos en uno" scrolling="no" src="http://dl.dropbox.com/u/4910414/mediafront-osmplayer-v0.98-0-g6132f21/mediafront-osmplayer-c372964/index.html" uno="" width="600"></iframe></div><br />
Para insertarlo en una entrada de nuestro blog lo hacemos con la etiqueta <iframe> con el siguiente código:<br />
<br />
<br />
<span class="codigo"><iframe src="<u><b>dirección archivo</b></u>" width="600" height="450" frameborder="0" scrolling="no" ></iframe></span><br />
<br />
<br />
<span class="codigo">La carpeta con los archivos necesarios del reproductor los alojamos en nuestro espacio Web personal (incluyen los ficheros<b> index.html</b> y <b>playlist.xml</b> ). En el código, </span><span class="codigo"><u><b>dirección archivo</b></u></span><span class="codigo"> , lo sustituimos por la dirección del archivo<b> index.html </b>de la carpeta del reproductor en nuestro espacio Web.</span><br />
<br />
Para verlo en otra pestaña o ventana diferente del navegador lo enlazamos directamente (recordar <a <b>target="_blank" </b> href="Url index.html".... en el código del enlace) .<br />
<a href="http://dl.dropbox.com/u/4910414/mediafront-osmplayer-v0.98-0-g6132f21/mediafront-osmplayer-c372964/index.html" target="_blank">Lo veríamos así </a><br />
<br />
<br />
<u><span class="codigo">Comentario ficheros </span><span class="codigo"><b> index.html</b> y <b>playlist.xml</b></span><span class="codigo">:</span></u><br />
<span class="codigo">Para incrustar este reproductor en nuestro Blog el fichero<b> index.html </b>lo dejamos sin hacerle modificaciones. El archivo <b>playlist.xml</b> debemos crearlo (o modificarlo) para indicarle los datos de los videos a reproducir. Los datos de cada vídeo los indicamos entre </span><span class="m"><</span><span class="t">track</span><span class="m">>...... y ...</span><span class="m">..</</span><span class="t">track</span><span class="m">> , su dirección, su creador, el título, anotación y la imagen (para la miniatura en el reproductor). Este archivo </span><span class="codigo"><b>playlist.xml</b></span><span class="m"> lo creamos </span><span class="codigo"> (o modificamos) con el Bloc de notas o con Gedit, sin olvidar extensión <b>.XML</b> y codificación UTF-8. </span><br />
<span class="codigo">Os presento el contenido de un <b>playlist.xml</b> con un sólo video (lo podeis copiar y añadirle tantas etiquetas </span><span class="m"><</span><span class="t">track</span><span class="m">> como vídeos a reproducir).</span><span class="codigo"><br />
</span><br />
<span class="codigo"> </span><br />
<span class="codigo"> </span><br />
<div class="e"><span class="m"><?</span><span class="pi">xml version="1.0" encoding="UTF-8" </span><span class="m">?></span> </div><div class="e"><div class="c" style="margin-left: 1em; text-indent: -2em;"><a class="b" href="http://www.blogger.com/post-edit.g?blogID=2813356021177637924&postID=6747559551121748718#">-</a> <span class="m"><</span><span class="t">playlist</span><span class="t"> version</span><span class="m">="</span><b>1</b><span class="m">"</span><span class="ns"> xmlns</span><span class="m">="</span><b class="ns">http://xspf.org/ns/0/</b><span class="m">"</span><span class="m">></span></div><div><div class="e"><div class="c" style="margin-left: 1em; text-indent: -2em;"><a class="b" href="http://www.blogger.com/post-edit.g?blogID=2813356021177637924&postID=6747559551121748718#">-</a> <span class="m"><</span><span class="t">trackList</span><span class="m">></span></div><div class="c" style="margin-left: 1em; text-indent: -2em;"><div class="c" style="margin-left: 1em; text-indent: -2em;"><span class="m"><</span><span class="t">track</span><span class="m">></span></div><div><div class="e"><div style="margin-left: 1em; text-indent: -2em;"><span class="b"> </span> <span class="m"><</span><span class="t">location</span><span class="m">></span><b><span class="tx">http://www.vimeo.com/5606758</span></b><span class="m"></</span><span class="t">location</span><span class="m">></span> </div></div><div class="e"><div style="margin-left: 1em; text-indent: -2em;"><span class="b"> </span> <span class="m"><</span><span class="t">creator</span><span class="m">><b>Jon Rawlinson</b></span><span class="m"></</span><span class="t">creator</span><span class="m">></span> </div></div><div class="e"><div style="margin-left: 1em; text-indent: -2em;"><span class="b"> </span> <span class="m"><</span><span class="t">title</span><span class="m">></span><b><span class="tx">Vimeo Example: Kuroshio Sea</span></b><span class="m"></</span><span class="t">title</span><span class="m">></span> </div></div><div class="e"><div style="margin-left: 1em; text-indent: -2em;"><span class="b"> </span> <span class="m"><</span><span class="t">annotation</span><span class="m">></span><span class="tx"><b>Vimeo Example</b>.</span><span class="m"></</span><span class="t">annotation</span><span class="m">></span> </div></div><div class="e"><div style="margin-left: 1em; text-indent: -2em;"><span class="b"> </span> <span class="m"><</span><span class="t">image</span><span class="m">></span><b><span class="tx">http://ats.vimeo.com/192/971/19297174_100.jpg</span></b><span class="m"></</span><span class="t">image</span><span class="m">></span> </div></div><div><span class="b"> </span> <span class="m"></</span><span class="t">track</span><span class="m">></span></div></div></div><div class="c" style="margin-left: 1em; text-indent: -2em;"><span class="m"> </span><span class="m"><</span><span class="t">/trackList</span><span class="m">></span></div><div class="c" style="margin-left: 1em; text-indent: -2em;"><span class="m"> </span><span class="m"> <</span><span class="t">/playlist></span></div></div></div></div><table bgcolor="" border="0" cellpadding="1" style="width: 75%;"><tbody>
<tr><td style="text-align: right;"> Ficheros </td><td><div class="separator" style="clear: both; text-align: center;"><a href="http://dl.dropbox.com/u/4910414/mediafront-osmplayer-v0.98-0-g6132f21/mediafront-osmplayer-c372964/osmplayer.zip" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjtTGzsRMRSyczFo1LT_ON0B5OmO6GnFg4jfU502U9i265JQYYft751H0PF5dBowGqHmebgjGzLMbNczGYm9XM3O2sNoc5gOHm_HdWYzSHR0XaXmEZuHpw0AQZzImIXUZukq25xkNPrxKc/s1600/icon_02.jpg" /></a></div></td></tr>
</tbody> </table><br />
<br />
jmhttp://www.blogger.com/profile/06735669513942778347noreply@blogger.com