viernes, 17 de julio de 2009

Truco: Añadir tres columnas en la sección debajo de la cabecera

TRuco de propiedad del Escaparate de Rosa


Después de haber publicado la manera de añadir tres columnas en la sección del footer, algunas personas me han estado consultando para conseguir la posibilidad de añadir mas gadget en distintas partes de sus plantillas, una de las zonas más demandadas para aprovecharla al máximo es, sin duda, el crosscol.



Antes de empezar tengo que aclarar que estás modificaciones están basadas en el código de las plantillas originales de Blogger que ya tienen incluido el crosscol en su código por defecto.






Para hacer esto mismo en una plantilla que no incluya en su diseño el código del crosscol tendríamos que saltarnos el paso [1] y [2].

Colocar el código del paso [3] justo antes de <div id='main-wrapper'> y aplicar el paso [4] tal como está.




[1] Tendremos que retirar cualquier elemento que tengamos colocado en el crosscol del blog, moviendolo a la sidebar de forma temporal y, una vez añadidas las tres columnas en el crosscol, volver a colocarlo en esa sección si así lo queremos.




[2] Nos situamos en "Edición HTML" de nuestro panel y sin expandir las plantillas de artilugios, localizamos la sección del crosscol:



<div id='crosscol-wrapper' style='text-align:center'>

<b:section class='crosscol' id='crosscol' showaddelement='no'/>

</div>



[3] Sustituimos ese código por este otro:



<div id='crosscol-wrapper' style='text-align:center'>

<div style='clear:both;'/>

<div id='crosscol-bottom' style='text-align: center; padding: 10px; text-transform: lowercase;'>

<b:section class='crosscol' id='crosscol-bottom' preferred='yes'>

<b:widget id='Text3' locked='false' title='' type='Text'/>

</b:section>


</div>

<div id='crosscol-columna-contenedor'>

<div id='crosscol2' style='width: 30%; float: left; margin:0; text-align: center;'>

<b:section class='crosscol-column' id='crol1' preferred='yes' style='float:left;'/>

</div>

<div id='crosscol3' style='width: 40%; float: left; margin:0; text-align: center;'>

<b:section class='crosscol-column' id='crol2' preferred='yes' style='float:left;'/>

</div>


<div id='crosscol4' style='width: 30%; float: right; margin:0; text-align: center;'>

<b:section class='crosscol-column' id='crol3' preferred='yes' style='float:right;'/>

</div>

<div style='clear:both;'/>

</div>

</div>
Ejemplo diseño


Una vez guardados los cambios ya podremos volver a incluir en el crosscol los elementos que queremos mostrar en esa sección.



[4] Ahora ya solo nos queda añadirle unas líneas de CSS a la plantilla para conseguir controlar la separación de las columnas y añadirles además un color de fondo (blanco en el ejemplo) y un borde.




Pegamos estas líneas antes de ]]></b:skin>:

#crol1{

background:#fff;

margin: 5px;

padding: 5px;

border: 1px solid #60A9D1;

}




#crol2{

background:#fff;

margin: 5px;

padding: 5px;

border: 1px solid #60A9D1;

}



#crol3{

background:#fff;


margin: 5px;

padding: 5px;

border: 1px solid #60A9D1;

}



#crosscol-columna-contenedor {

clear:both;

}

.crosscol-columna {


padding: 10px;

}




[5] Y tendríamos que conseguir entonces algo así:



Ejemplo blog




Modificaciones



Para retirar el borde a los elementos, colocamos en border: 1px solid #60A9D1; el valor 1 en 0, o directamente borramos esa línea del código CSS.




Para cambiar el color de fondo, lo hacemos sustituyendo #fff por el código del color que vamos a usar.



El ancho de cada gadget está aplicado en porcentajes, podemos modificar la anchura de cada uno cambiando en width: el valor del porcentaje, cuidando que la suma del valor de los tres gadget juntos no sobrepase el 100%

martes, 7 de julio de 2009

50 Herramientas útiles blogs para profesores

Via:

50 Useful Blogging Tools for Teachers



Blogging is becoming more and more popular in the classroom. Teachers can blog to stay in touch with parents and students or they can incorporate blogs from all of the students as a learning tool. The beauty of the student blog is that children from Kindergarten to high school can blog. No matter how you use blogs in your classroom, these tools will help you get started, enhance your experience, or bring the students into the fun.

Where to Create Your Blog

Creating a blog is the first step. The following resources all offer blog publishing. Some of these are aimed specifically at school blogs while others are available for anyone.

  1. Class Blogmeister. Created as a blogging platform specifically for educators, this free service will get you and your students blogging in no time. An added bonus to this service is that it is rarely blocked by school filters due to it’s specific safety features.
  2. Edublogs. Another blogging platform made just for educators, this service is based on WordPress, so comes with all the features of WordPress. Another benefit of Edublogs is the short and simple URLs for the blogs that make it easy to share with parents.
  3. WordPress. Get a free blog with WordPress and you will also have access to plenty of tools such as spellcheck, integrated stats tracker, and spam protection. This is one of the more popular blogging platforms.
  4. Blogger. Another popular blogging publisher, Blogger is teamed up with Google and offers lots of tools to make your blogging experience easier. You will need a Google account to create a blog with these folks.
  5. TypePad. TypePad lets you select from thousands of designs and has lots of widgets, custom banners, and more. However, this service is not free. You can take advantage of a free trial before you decide to pay the low monthly fee or annual subscription, though.
  6. LiveJournal. In addition to providing a blog, LiveJournal also makes it easy to create a social network through the blogs. This might work great for your class if all the students will have their own blog as well.
  7. Moveable Type. Another free blog publisher, Moveable Type offers many of the same features as the others with a spam blocker, templates, and more.
  8. Tumblr. Not really a full-fledged blogging platform, Tumblr is designed for smaller posts and a much more personalized experience. If you aren’t ready to go the way of the blog, this might be a good way to get your feet wet.
  9. Windows Live Writer. Get a Space in Windows Live and download Live Writer to start blogging with this publisher. You can connect with others, post video, and more with Live Writer.
  10. Thingamablog. All you need to get started with this blog platform is FTP, SFTP, or access to a server. The setup wizard will guide you through the steps of getting your blog in place.

Blogging Tools and Help for Teachers

The following tools and articles are all focused on helping teachers blog or provide free access for teachers to blogging tools that would normally cost money.

  1. Smilebox. Create scrapbooks, slide shows, postcards, and more to post on your blog with this tool. While it’s not specifically designed for educators, teachers can receive the premium subscription for free.
  2. Using Del.icio.us for Blogging. This article describes how you can incorporate the popular bookmarking site, Del.icio.us, into your blogging program.
  3. avatars. Let your students design their own personal avatars with one of these free tools. Using an avatar lets the students personalize while also keeping their identity private.
  4. VoiceThread. Create an online presentation with audio and text. You can incorporate PowerPoint, Flickr, Word, PDF, and more. Teachers get a free account.
  5. Teacher Training Videos. While this site is not specifically for blogging, it is directed at teaching educators how to use technology in the classroom. There are some blogging videos that will help get you started.
  6. A Vision for Classroom Blogging. Read about reasons to blog in your classroom as well as how to go about doing it in this article written by an experienced teacher and blogger. She also includes links at the end of the article for even more information.
  7. Classroom 2.0. Read blog discussions between teachers with blogging experience ranging from newbie to veteran blogger. You can find helpful advice as well as resources in these blog posts.

General Blog Tools

From adding fun photos to maps showing where your blog readers live, these tools will help you and your students create fun and educational blogs.

  1. Spellery. Type in the URL to your blog and find out if you have any spelling mistakes. This simple tool is invaluable for ensuring your posts are in top shape.
  2. Jiglu. This tool creates tags within your blog that allows readers to find more information from your previous blog posts. You can manually assign tags or let Jiglu assign the tags automatically.
  3. Wufoo. If you would like to create an online form for your blog, use this tool to do it for you. It’s easy to use and you’ll be creating polls, invitations, and more right on your blog.
  4. AddThis. With this simple tool, you can add a button on your blog that allows readers to easily bookmark and share your website. Having this button will allow parents and other teachers easier access to your site.
  5. Buttonator. If you need to create buttons for your blog, this easy tool will help you with the task. Choose the style, font, color, and more.
  6. Bananr. Want to put those photos from the class field trip or talent show on your blog? This tool allows you to enter your Flickr user id or photoset id and easily add the photos to your blog.
  7. Gickr. Add photos to your blog and put them in motion with this tool. Create fun slide shows and more without using difficult software.
  8. Website Ribbon Generator. Create a ribbon for your favorite cause or use an originally designed ribbon to tie all your students’ blogs together with this simple tool.
  9. FeedBlitz. Add this tool to your blog so readers can have your blog posts sent directly to their email. FeedBlitz also offers widgets to add to your blog such as a blogroll.
  10. ClustrMaps. When visitors click on your blog, this tool logs their location on a map. Watch as over the life of your blog, the map fills with information on your visitors’ locations. This tool can also serve as a geography lesson.
  11. MakeBeliefsComix.com. Choose your characters and add word or thought bubbles complete with your own text to create your very own comic strip. This is a fun activity for students to incorporate in their blogs, too.
  12. TagCrowd. Create a cloud of words from your blog with this tool. Once you have created the cloud, the tool will provide the HTML code so you can put it on your blog.
  13. widgetbox. Add any imaginable widget to your blog with this tool. Let your students run wild to allow their individuality to shine with these widgets that range from clocks to animals to word searches.
  14. LabPixies. Add any number of fun widgets like Google maps, games, calendars, and more on your blog. There are some great learning opportunities among these.
  15. gabcast. Record using your phone and post audio on your blog with gabcast. This tool can also be used to host conference calls, which would be helpful with parent-teacher conferences.
  16. BlogRolling. With this tool, you can add a blogroll to your blog to show readers what other blogs you find interesting. The is great for localizing a whole class worth of blogs in one spot.

Blogging and Internet Safety

As a teacher, you are already well aware that keeping your students safe is a priority. Introducing blogs in the classroom is undeniably a powerful learning tool, but it also brings about an opportunity for the teacher to reexamine student safety. The following resources will help you protect your students from harm.

  1. Google Analytics. Keep a close eye on your blog traffic and find out who is visiting your website. This tool breaks down the visitor information in several ways, including plotting a map of where the visitors are located.
  2. Keeping students cybersafe!. This blog post, written by an educator, offers suggestions on how you can protect your students while enjoying student blogs.
  3. Children’s Online Privacy Protection Act of 1998. This law explains how a child’s privacy is protected online. Working with children and blogs, this is a must-read item.
  4. Copyright and Fair Use. This simple primer gives the basics on copyright and fair use laws as it pertains to the Internet. Any teacher posting on the Internet should take the time to read this.
  5. A Teacher’s Guide to Fair Use and Copyright. Another helpful guide to fair use and copyright, this one is specifically designed for teachers. It also includes a chart for fair use to post in your classroom.
  6. Responsible blogging. Taken from a 10th grade class, these guidelines for safe and responsible blogging are not just teacher-generated, but also come from the students themselves.
  7. Blogger’s Contract. This contract between the teacher and student is a great way to remind the student of the safety and responsibility required when blogging. Use this contract as a model for one you can create for your class.
  8. Consent for Your Child to Participate in Online Collaborations. This teacher has drawn up a consent form for parents explaining how technology will be used in the classroom and asking for parental consent. Click on the link at the beginning of this letter for the actual consent form.
  9. Blogging Rules. This list of rules was compiled by a teacher for his classroom. You may find this helpful for setting the rules in your class before you begin blogging.
  10. Discovery Blogging Rules. Another set of rules for classroom blogging, this one is a bit more extensive and also includes clearly defined consequences to breaking the rules. This list can serve as a model for the rules in your classroom.

Getting Students in on the Action

Don’t keep all the fun to yourself–let your students blog too. These resources offer suggestions and tools for getting students into blogging.

  1. 21Classes. Set up classroom homepages and host and manage blogs for your students with this free service. Students can customize their pages and insert photos and videos.
  2. Reflections on Student Blogging. This article written by a teacher working with middle and high school students describes how she implemented a student blogging project. She also offers more generalized helpful tips on blogging with students.
  3. Blogging Basics: Creating Student Journals on the Web. This tutorial covers all the basics for getting your students set up to blog in the classroom. There are even some links to school blogs.
  4. Students 2.0. This blog is run by students and allows them a chance to raise their voice on the topic of education. Not only does this blog serve as an example of what student blogs can be, it is also a great tool to share with your older students.
  5. Student Tools–Let them fly!. Compiled by an educator, this list offers the top tech tools for students. Many of these tools can be used in student blogs or help students set up blogs.
  6. iLearn Technology: Dipity. This educational blog reviews Dipity, a time line generator that students can use to create time lines on any topic. Students can use Dipity in conjunction with their blogs to create personal timelines.
  7. Making it Interesting: What would you add to this classroom. This is a fun little visual to suggest various technology tools to get students excited about learning. Think about what you would add for your students.