viernes, 20 de noviembre de 2009

Creacion de una presentación de diapositivas

En esta entrada lo que debéis conseguir es incrustar una presentación de diapositivas de vuestra galería de Picasa. En primer lugar ir a vuestra cuenta de Picasa, click en el Album que queremos usar como presentación, a la derecha click donde pone incrustar proyección de diapositivas.
A continuación click donde pone el texto raro, click botón derecho y copiar, este código es el que pegaremos.










¿Dónde?. Entramos en nuestro blog, nos vamos a diseño y añadimos un gadget, elegimos HTML. Ponemos Título de la presentación, a continuación pegamos.












Generalmente, dado que dependerá de la plantilla que estemos usando, la presentación se sale de los límites de nuestro blog por lo que le daremos un pequeño retoque.
Editamos el gadget que hemos creado, tendrá el nombre del titulo que usamos para la presentación, y cambiamos los valores width="288" height="192" a width="240" height="192", y co esto queda mas guapa.

sábado, 14 de noviembre de 2009

¿Cómo incrustar una actividad Jclic en el blog?

Algunos de los participantes en este taller han querido incrustar una actividad de JClic en sus blogs y lo han conseguido. Aquí voy a decir la forma de hacerlo por si os animáis.Hay que ir a la web de JClic, y una vez allí, vamos al formulario de búsqueda. Encontramos una actividad y nos aparece una pantalla con el título, sus autores, una imagen, etc. Debajo, hay un enlace que dice: "Verlo (applet)". Entonces aparece una ventana con la actividad en funcionamiento. En la parte superior, debajo de la barra del título se ve un icono del JClic seguido de una dirección o URL, que es la que hay que copiar dentro de la etiqueta IFRAME para poder inscrustarla en el blog.
http://clic.xtec.cat/db/jclicApplet.jsp?project=http://clic.xtec.cat/projects/sentido2/jclic/sentido2.jclic.zip&lang=es&title=Los+sentidos

Tipos de Letra


Esta entrada va de los tipos de letra usadoas en un blog para ello nos apoyamos http://3tris3tigres.blogspot.com/2009/03/anadir-mas-fuentes-en-blogger.html

Son importantes estos términos en ingles:

Bodyfont determina la fuente del texto (el tipo usado genéricamente).
Headerfont determina la fuente de los títulos de la sidebar.
Pagetitlefont determina la fuente del título del blog.
Descriptionfont determina la fuente del texto de la descripción del blog.
Postfooterfont determina la fuente del pie de página de cada entrada.


Hasta ahora la única manera de añadir otra fuente alternativa a las mencionadas 6 que nos ofrece Blogger era escribiendo la entrada en el modo html y en el atributo "font-family" poner nosotros la fuente que queramos como se puede ver en el ejemplo:

Texto del post


Tenéis que tener en cuenta que la fuente será visible por el usuario si la tiene instalada en su ordenador. Si queremos añadir más fuentes a todas las partes del blog y no solo al texto de la entrada tendremos que modificar el código fuente de nuestra plantilla en Blogger.
Las variables de los tipos de fuentes y colores están definidas al princpio, podremos modificarlas o incluso añadir alguna nueva. Por ejemplo os pongo la variable que me he creado yo para la fuente del título de las entradas:

Variable name="fuentetitulo" description="Tipo letra título posts" type="font" default="normal normal 140% 'Trebuchet MS', Trebuchet, Arial, Verdana, Sans-serif" value="normal normal 154% 'URW Gothic L', Georgia, Arial, sans-serif"


Dentro del campo "value" es donde definimos las fuentes que queremos. Si os fijáis aparecen tres tipos de letra seguidos, esto es por lo que os comentaba antes de que alomejor no tenéis ese tipo de fuente instalado en vuestro ordenador, pues entonces lo intenta con la siguiente de la lista. De esta manera, en el ejemplo que os he puesto, como seguro que casi nadie tiene instalada la fuente "URW Gothic L" ya que es un tipo de fuente Ubuntu lo intenta con la siguiente, Georgia, que sé que todo el mundo la tiene.

He Cambiado el valor en negrita y con ello se consigue cambiar el interlineado.

#main {
float: $startSide;
width: 460px;
margin-top: 20px;
margin-$endSide: 0;
margin-bottom: 0;
margin-$startSide: 0;
padding-top: 0;
padding-$endSide: 0;
padding-bottom: 0;
padding-$startSide: 1em;
line-height: 1.0em;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float */
}