Image Width In Blog Posts

When you upload an image you are given three versions that you can insert into the post:

  • Thumbnail (150 x 150 pixels)
  • Medium (300 x 300 pixels)
  • Full Size

Image sizes

If you are like me and prefer specific sizes of images in blog posts you are able to change the size of thumbnail and medium sized images under Settings > Miscellaneous.

Changing Image Sized

What you mightn’t have realized is that when you insert an image into a post using the “full size” option, the image is automatically resized to a maximum width of 500 pixels. This has been done to prevent the problem of wide images in blog posts caused when people post photos straight from digital cameras.

It is important to realize how wide an image can be depends on your blog theme. Some themes 500 pixels is too wide and the image will flow into your sidebar area. While other themes can cope with images wider than 500.

Maximum image width for the following themes are:

Maximum image width for blog themes

Resizing imagesYou also need to remember that image size in posts isn’t affected when you change blog themes so the image width you used on your old theme may be too large for your new theme e.g. go from Cutline (480 px) to Quadruple Blue (400 px).

You can increase the width of an image by clicking and dragging the image to the required size. DON’T insert a “medium size” image and drag to the larger size because this affects the quality of the image.

Compare the quality of this “Medium Sized” image dragged to 500 pixels wide:

Medium Size image

With this “Full Size” image:

Full Size image

FINAL THOUGHTS

While the “full size” option does automatically resized to a maximum width of 500 pixels its not a good idea to upload images directly from your digital camera to your blog posts. Resizing before uploading is the better option which I will cover in my next post.

If you currently resize images please tell us about what tool(s) you use and why? And any links or information that would help others understand about resizing and image quality.

If you are enjoying reading this blog, please consider feed-icon32x32 Finding and Adding Creative Commons Images To Your Blog PostsSubscribing For Free!

The 100 Edublogs Themes Separated Into Categories To Make Choosing Your Next Theme Easier

Given there are 100 Edublogs themes available for you to use ranging from themes that can’t be altered to themes that are “extremely customizable” you can spend quite a bit of time testing themes to find the “perfect theme”. So I’ve decided to help make your task a bit easier (I hope) by categorizing the Edublogs themes based on:

  1. Layout – number of columns
  2. Color Scheme
  3. Ability to upload own image header
  4. Presence or absence of page links in blog header
  5. Presence or absence of tagline in blog header
  6. Ability to customize theme

Image of assessing blog themes

One Column Themes

Single Column themes have a central post area with no sidebar. These theme appeal to people who like to keep their theme simple by preventing the clutter often created by sidebar widgets. All widgets are located at the bottom of the blog on one column themes.

  1. Image of a one column theme72 Classes – Minmalist white theme with black trim
  2. Ambiru - light grey theme and able to upload your own custom image header (500 x 225 pixels)
  3. Day Dream – offers four different headers to choose from pink with flowers, blue, grey or green leaves
  4. GreenDay – Olive green theme with content located on left of page; doesn’t look anything like supplied screenshot in theme selection area
  5. Roundflow – Extremely customisable theme. Able to change width of column, type of font used on blog and colors of header, background & text
  6. Simplr – This theme allows you to configure some variables to suit your blog such as font size, font type
  7. Striped Plus – Extremely customisable theme that allows you to change width of blog, type of font used on blog, colors of header, background & text and upload own images to use for header and background

One column themes with additional features:

  1. Links to pages in blog header - Ambiru, Day Dream, Green Day, Roundflow and Simplr.
  2. Includes tagline in blog header – Day Dream, Green Day, Roundflow and Simplr

Two Column Themes with Left Sidebar

Image of Two column theme with left sidebar

  1. Anarchy - Black theme with red headings and white text.
  2. Benevolence – Simplistic theme which allows you to upload your own custom image header (700 x 225 pixels).
  3. Borderline chaos – Theme has funky modern color scheme
  4. Fauna - theme has a light grey background image with patterns and allows you to upload your own custom image header (780 x 200 pixels). Posts have a white background.
  5. Pink Kupy – Very pretty in pink with pink patterns in the header. The post column is really narrow with the post background color of pink and the text written in darker pink.
  6. Solipsus – Black and grey tones theme with simple pattern header. The post column is quite narrow and the post background color is grey.
  7. Suhweet – Minmalist purplish theme with the background colour of post light purple.
  8. Tarskei - White simple feeling theme that allows you to upload your own custom image header (720 x 180 pixels)
  9. White as milk – Extremely white theme with a white header and felt too white for me.
  10. WordPress Silver II – Clean white theme that allows you to customize your image header using a Flickr tag.
  11. Heminway – Black theme that can be changed to white. Technically speaking it is a two column theme but is unusual in that it columns display posts and the widgets are located below like a one column theme. Didn’t partially like this theme because it displays the latest post as a partial post and you have to click on a link to read the full post.

Two column themes with left sidebar additional features:

  1. Links to pages in blog header - Fauna, Suhweet, Tarskei and WordPress Silver II
  2. Includes tagline in blog header – Pink Kupy, White as Milk, Suhweet, Tarskei and WordPress Silver II

Two Column Themes with Right Sidebar

Two Column themes with right sidebar are the most Edublogs most common theme layout so it has been necessary to break these themes into several categories based on: those that allow you to upload your own image header; and then the remaining themes were categorized based on the theme’s color scheme.

Those that allow you to upload your own image header are:Image of Two Column with right side bar

  1. Blix – 690 x 115 pixels. Blue Green simple theme.
  2. Connections – 741 x 142 pixels. Stylish theme.
  3. Contempt – 750 x 140 pixels. Blue grey professional theme.
  4. Cutline – 770 x 140 pixels. White theme.
  5. Fleshy – 780 x 95 pixels. Grey theme with black trim.
  6. Greenery – 740 x 171 pixels. Extremely vivid green theme with trees in default image header.
  7. Jakarta - 480 x 200 pixels. Sandstone color theme and post background color is tan.
  8. K2 – 780 x 200 pixels. Light grey theme.
  9. Letoprime – size of image not specified. Wide range of default image headers to choose from plus the option to upload your own image header with light blue feel.
  10. Mandigo – 800 x 250 pixels. Lots of options for customizing this theme.
  11. Misty Look – 760 x 190 pixels. Very light green toned theme that includes Post and Comment RSS feed in the blog header.
  12. Ocean Mist – 736 x 200 pixels. Gentle blue toned theme.
  13. Press Row – 770 x 200 pixels. White Simplistic theme.
  14. Redoable – 730 x 180 pixels. Deep grey theme and the background color of posts is grey. Default header is strong red.
  15. Regulus – 730 x 140 pixels. Very customisable theme with ability to change color tones.
  16. Rubric – 215 x 150 pixels. Light grey toned theme.
  17. Seashore – 900 x 180 pixels. Light grey toned theme.
  18. Sumenop – 480 x 150 pixels. Dark theme with curly flowers.

Those with additional features:

  1. Links to pages in blog header - Greenery, Press Row, Blix, Connections, Cutline, Fleshy, K2, Letoprime, Mandigo, Misty Look, Ocean Mist, SeaShore and Redoable
  2. Includes tagline in blog header – Connections, Fleshy, K2, Letoprime, Mandigo, Misty Look, Ocean Mist, SeaShore, Contempt , Jakarata, Rubric and Sumenop

Green Themes

  1. Almost Spring – Simple theme with light green tones
  2. FrameFake – Nice green tones and the post area is scrollable. Links to pages in its blog header.
  3. Green Mairnee – Black header with green tone theme.

Blue Themes

  1. CleanTidy – top post has deep blue background and older posts have grey background color. Links to pages in its blog header.
  2. Deep Blue – strong blue tones
  3. Flex - Blue and grey tones that includes tagline in its header
  4. Fresh Bananas – Light blue simple theme.
  5. Glossy Blue – Vibrant blue with green tones theme which links to pages in its blog header plus includes tagline in its header.
  6. Nikynik BlueMU – Simple blue theme which links to pages in its blog header plus includes tagline in its header.
  7. Ocadia - light blue with grey tones theme which includes tagline in its header
  8. Pool - Gentle calm blue theme which links to pages in its blog header.
  9. Steam – Gentle blue and grey theme with wide post area.
  10. Waterlilly – Blue grey toned theme with water lilly image header and includes tagline in blog header.

Yellow Themes

  1. RadMod - Red header with background area of posts yellow.

Brown Themes

  1. Batavia – Simple brown theme with post background color light fawn which links to pages in its blog header plus includes tagline in its header.
  2. Quentin – brownish red toned theme which includes tagline in its header

Pink Themes

  1. Daisy Rai Gemini - Very soft pinkish tones with a soft flower image header and includes tagline in its header.
  2. Dixie Bell – Soft pink with a pink flower on the right handside of the blog plus includes tagline in its header
  3. Sweet Blossoms – strong pink theme with flowers and includes tagline in blog header.
  4. Twilight – Pink and grey toned theme that includes tagline in blog header

Black Theme

  1. Black Letterhead – Black theme with yellow titles and white text.

White Themes

  1. Copyblogger - strong black header with red highlights and titles giving it strong tones of black and red which links to pages in its blog header.
  2. Crop Circles – white and soft grey tones with an alien crop circle influence which links to pages at the top of the blog plus includes tagline in its header.
  3. Letterhead – Extremely white theme (was a bit too white for me) plus includes tagline in its header.
  4. Man`ja – Simple yellow thin header with white theme which links to pages in its blog header. Very different look and feel from a traditional blog (wasn’t for me).
  5. Simpla – White grey minimalist theme which includes tagline in its header.
  6. Trevilian Way – White minimalist theme. Links to pages in its blog header plus includes tagline. Not a fan of its default setting which doesn’t display full post on blog.
  7. Veryplaintxt – incredibly white theme which includes tagline in blog header.

Grey Themes

  1. Blue Moon – Deep blue grey theme which links to pages in blog header plus includes tagline in header.
  2. Deichnetz – Grey tone with a Bavarian forest floor image header
  3. Falling Dreams – Grey pavement theme with pavement image header. Post area is quite narrow.
  4. Gentle Calm – Greyish green minmalist theme which includes tagline in its header.
  5. Gridlock – Able to change the way posts are displayed however wasn’t a fan of this theme.
  6. Kubrick – Able to change the color of the header plus includes tagline in its header.
  7. Light 1.0 – Grey, blue and navy toned theme which links to pages in its blog header plus includes tagline in its header.
  8. Northern Web Coders – grey, orange pink tones with sun coming through clouds image header which links to pages in its blog header.
  9. Terrafirma – Grey, green, orange toned theme with plant image header. Links to pages in its blog header plus includes tagline.
  10. Thoughts – Strong grey theme with speech bubble like image header. Includes tagline in image header.

Patterned Theme

  1. Vistered Little – Post area is transparent so when scrolling you see the image behind the post. Readers can also change the look and feel of the image by clicking on the links in the header. Personally I found this theme too busy and makes it hard to read posts.

Three Column Themes with Left and Right SidebarImage of a three column theme with right and left sidebars

  1. Andreas09 – This theme provides 14 different options for changing the color of the blog header. Links to pages in its blog header plus includes tagline.
  2. Anubis - green toned theme that allows you to upload your own custom image header (970 x 150 pixels).
  3. Blue Zinfandel Enhanced – White theme with links to pages in its blog header plus includes tagline.
  4. Cordobo Green Park – Fluoro green theme with rounded edges and inks to pages in its blog header.
  5. Edublogs Default – White theme that allows you to upload your own custom image header (970 x 140 pixels) with links to pages in its blog header plus includes tagline. This is the default theme for all new Edublogs blogs.
  6. Garland – This theme provides the ability to change the color of the blog header, background, text and links using font color codes. Has links to pages in its blog header.
  7. Newportal – Blue theme with links to pages in its blog header.
  8. OceanWide – Extremely customisable theme that allows you to upload your own custom image header (980 x 198 pixels), change font types and theme colors with links to pages in its blog header plus includes tagline.

Three Column Themes with Right Sidebars

  1. Image of Three Column with Right sidebarsBluebird – Blue and brown aligned theme with bluebird sitting on a branch in the blog header and links to pages on right hand side of header. Post background color is light blue. Includes tagline in blog header.
  2. Blue Green – This theme has a blue header with green contrasts. Post background color is very light grey blue.
  3. ChaoticSoul – Brownish grey theme that allows you to upload your own custom image header (760 x 151 pixels). Post background color is brownish grey with white text in the posts and yellow post titles. Includes tagline in blog header.
  4. Fadtastic – Blue theme with green highlights with links to pages in its blog header. I didn’t like this theme because the default post isn’t a full post i.e. you have to click on link to read full post.
  5. GenkiTheme – Greenish blue feeling theme which Includes tagline in blog header.
  6. Glorious Day – Bluish and greenish tone theme that allows you to upload your own custom image header ( 900 x 180 pixels). Has links to pages in its blog header plus includes tagline.
  7. Reaching Darkness – Grey tone theme that allows you to upload your own custom image header ( 900 x 180 pixels) with links to pages in its blog header.
  8. Twenty eight thirteen – Minimalist white theme which Includes tagline in blog header.
  9. Vertigo – Minimalist white theme.

Four Column Themes

  1. CommentPress – Incredibly unusual blog theme. It offers two skin options:
    • Table of Contents skin – which would work well if you wanted to use it for writing a document or wanted to just use the site for providing assignment information (link to the oldest post appears at the top table of contents)
    • CommentPress Skin – provides readers the ability to comment paragraph by paragraph in the margins of a text.
  2. Fjords – Bluish grey tone theme with all four columns the same width which means that the post column is excessively narrow and not well suited to lengthy content. It does allow you to upload your own custom image header ( 900 x 200 pixels ).
  3. Quadruple - Navy blue header with blue tone theme with one sidebar on left and two on right. The post area is slightly narrower due to having four columns.

Most Customisable Themes

These themes provide greater opportunity for customizing if you want to change color of your blog based on font color code or change font type.

  1. Roundflow - One Column. Can change the colors on the blog, width of column and type of font used.
  2. Simplr - One Column. Able to change width of column and type of font used.
  3. Striped plus – One Column. Able to change colors on the blog and type of font used.
  4. Mandigo – Two Column. Extensive range of image headers to choose from and able to change colors on the blog using font color codes.
  5. OceanWide – Three column

FINAL THOUGHT

With 100 Edublogs themes there is a chance I accidentally made a mistake like missed your theme, got a color wrong etc. I’d really appreciate it if you could check the information I supplied for your theme and let me know if I need to make any corrections or missed a theme off the most customizable list. Would also like to hear which theme(s) you like/dislike and why.

You might also find What To Consider When Choosing Your Blog Theme and Edublogs Themes That Allow Comments on Pages! helpful

If you are enjoying reading this blog, please consider feed-icon32x32 Finding and Adding Creative Commons Images To Your Blog PostsSubscribing For Free!

What To Consider When Choosing Your Blog Theme

You only have a limited time to make the right impression for first time readers; blog theme, post layout and blog clutter all impact on first impressions. Great content is easily missed if your blog theme is distracting or off putting.

Tips for Road testing Blog Themes

New bloggers often spend considerable time changing their blog theme to work out which theme works best for them.

When road testing blog themes make sure that you have:

  • Several posts on your blog and at least one with an image added e.g. have at least 3 posts published (you can always delete)
  • In one of the post include all heading styles so that you can see the font color, size and type of each heading style
  • Add comments to two of the posts (you can always delete)

Edublogs provides 100 themes for you to choose from ranging from themes that can’t be altered i.e. “use as is” to themes that are “extremely customizable” i.e. change image header, font types, font color and background color. You change your theme by clicking on Design > Theme in your blog dashboard and then click on the theme you want to use.

Features worth considering when choosing a blog theme include:

1. What Is Your Preferred Layout?

Blog themes normally include a header, a content area (for your posts), sidebar area (for your widgets) and come in several standard layouts:

  • Single column with no sidebar (widgets are located at the bottom of the blog)
  • Two Column – normally a wide column for content and narrower sidebar
  • Three Column – with sidebars side-by-side on one side of the blog or either side of the wider content column
  • Four Column – one content column and three sidebars. The content column is often the same width as the other columns. This type of layout tends to be cluttered looking and less suited to reading lengthy content.

Two or three column are the most commonly used layouts. When considering layout you need to think about which side(s) do you prefer the sidebar to be located? Also make sure you check out the width of the blog and the post area.

2. Do you want your tagline displayed in the blog header?

The concept behind a blog tagline is to create a memorable phrase that sums up the tone and premise of a blog. Ideally all blogs should have a tagline since they instantly tell first time readers what your blogs all about and whether you write posts in topic areas that interest them.

Image of a tagline

3. Do you want to be able to upload your own Custom Image Header?

Being able to upload your own custom image header means you can add your “own personal touch” to your blog plus you can use it as a work around for blog themes that don’t include taglines i.e. Add the tagline to the image header using tools like PhotoShop.

4. Do you want links to pages in the blog header?

Some blog themes have links to pages in their blog header while on other themes you use the page widget in your sidebar. I personally like to have page links in my header to make it easier for readers to navigate pages on my blogs.

Image of page links

5. What are your preferred color scheme?

When choosing your theme remember that if color scheme makes your content hard to read you will lose readers. So balance your personal preferences with readability since ultimately you want people to read your content.

Don’t just look at the overall color — remember to check closely the color of: the header; the background; post text and links; post titles; headings in posts; widget titles and links.

When choosing color schemes it is worth doing audit of your blog by watching a first time reader read your blog to observe how they are interacting with the content on the site. Don’t talk to them while they navigate through your site just record how they interact and what engages/distracts them. Once finished ask them questions like:

  • What were their first impressions were?
  • What captured their attention?
  • What distracted them?
  • Do they have suggestions on how you could improve your blog?

While most of the standard Edublogs themes color schemes can’t be altered i.e. “use as is” there are a few themes that allow you to change the theme’s color.

6. What type of font do you like?

Most of the standard Edublogs themes don’t provide the ability to change font type i.e. “use as is” however there are a few themes that allow you to change their font.

FINAL THOUGHTS

I’ve tried to cover the basics of choosing an Edublogs theme for your blog. But would love to hear about:

  • What you look for when choosing a blog theme?
  • Which themes you have found are easier for students to use?
  • Are there any blog themes that really popular with your students?

Need help choosing your Edublogs theme?  – check out The 100 Edublogs Themes Separated Into Categories To Make Choosing Your Next Theme Easier and Edublogs Themes That Allow Comments on Pages!

If you are enjoying reading this blog, please consider feed-icon32x32 Finding and Adding Creative Commons Images To Your Blog PostsSubscribing For Free!

Tips For Doing A Blog Makeover

Fantastic news! Our Getting More Out of Widgets! post inspired community members to make adjustments or add extra widgets to their blog, plus motivated some to do “blog makeovers”.

Larry Ferlazzo suggested

Here in the U.S there’s a popular TV show where producers go into someone’s home, and completely redo a room. Crazy idea, I know, but it might be fun for you to offer to do that to a blog and as a teaching tool for the rest of us.

What an excellent idea Larry and here’s the best news!

As you asked for assistance, we choose your blog for the makeover and will be writing a series of posts on Larry Ferlazzo’s Website of the Day “Blog Makeover” to share blog design tips and additional info for customizing widgets.

But before we begin– Gail Desler, from Blogwalker blog, has shared with us her excellent Introductory manual for using Edublogs which is definitely worth bookmarking for future reference! Make time to go past Gail’s blog and write a comment to thank her for sharing!

Importance of Your Blog’s Presentation Theme

Your blog has two distinct groups of readers:

  • Those that subscribe to your blog via RSS feed or email;
  • and first time readers who view your blog via it’s web address.

It’s these first time readers we want to engage and get to subscribe to our blog. Unfortunate fact of life, we do judge a book by it’s cover! People are more likely to both read your posts and subscribe to your blog if it’s pleasing to their eyes.

Watch this video to learn how to change your blog theme or refer to page 12 & 13 of Gail’s Introductory Manual to Edublogs (other manuals for Getting Started with Edublogs are located on this page).

Larry’s Original Theme

originaltheme.jpgFor those unfamiliar with Larry Ferlazzo’s Website of the Day — Larry’s well known and very popular for sharing great information on websites for teaching ELL, ESL and EFL. His original theme was Batavia 1.5.

Nice simple theme but the beige background behind the text in his posts detracted from the great content he was sharing. Made worse by his long blog name that cluttered his blog header.

original2.jpg

Larry’s Next Theme

Larry had already decided that there was better themes for his blog and was trailing them before we offered our assistance.

copyblogger1.jpg

But there was two main problems with the new Copyblogger theme:

  1. His long blog name was totally overwhelming the blog header. Solution was to shorten his blog name and use a theme that included a tagline!
  2. Too many page links displayed along the top of his blog was making it cluttered and messy. Answer lies with Pages, Sub-pages and a widget.

Why Blogs have Taglines

The concept behind a blog tagline is to create a memorable phrase that sums up the tone and premise of a blog. Ideally all blogs should have a tagline since they instantly tell first time readers what your blogs all about and whether you write posts in topic areas that interest them.

Unfortunately not all blog themes include a tagline however a work around, if you’re good with Photoshop, is to use a theme with a customisable header and add the tagline to the image in the header e.g. check out the header on my personal blog and Graham Wegner’s Teaching Generation Z blog.

tagline1.jpg

With Larry we changed his blog name from Larry Ferlazzo’s Websites of the Day for Teaching ELL, ESL & EFL to Larry Ferlazzo’s Websites of the Day… and added the tagline … .For Teaching ELL, ESL & EFL.

Larry’s New Theme gloriousdays.jpg

He also decided to change from the theme Copyblogger but couldn’t choose between Glorious Day or Glossy Blue.

The trouble with themes is each has their advantages and disadvantages. Both the new themes included taglines but the background colour behind the text and the text styles was easier to read with Glorious Day.

Why Blogs Have Pages

Edublogs, because it uses WordPress, has the definite advantages of being able to customize and reduce blog clutter considerably more than Blogger blogs. Clutter distracts readers making them less inclined to subscribe to your blog. One of the best ways to reduce clutter is to use pages.

Pages, are similar to posts, except they can do more than a post. You normally use pages when you want to present information about yourself or your blog that you always want readers to be easily able to access. Examples of pages on this blog are: About; What you’d like to see covered; and Want Automatic Notification.  For more information, read the differences between pages and posts.

Pages can also be organised into Sub-pages within your pages, creating a hierarchy of pages. For blog themes that display pages along the top, this is a great way of controlling what pages are displayed as only those with no parent are displayed. The Want Automatic Notification is located on a sub-page below the About page.

This video explains how to write posts and pages or refer to page 7 & 8 of Gail’s Introductory Manual to Edublogs.

Larry’s New Look

Below is what Larry’s blog now looks like after creating pages, sub-pages and using a widget to link to the sub-pages.

Our next post will show how to create widget that link to sub-pages, a widget for photos and provide tips for decluttering your side bar.

newlook1.jpg

FINAL THOUGHT

We’d love feedback on Larry’s blog makeover, please check it out and provide your thoughts on further improvements. And if you’re in the process of a blog makeover let us know so we take a look!

Other posts in our “blog makeover” series include:

If you are enjoying reading this blog, please consider Subscribing For Free!