Quotes on the Sidebar

Plugin Name: ”XmasB Quotes”
Plugin Page: (http://wordpress.org/extend/plugins/xmasb-quotes/)
Function: Displays a quote (or several rotating quotes) in the sidebar.

  • display the quote and then the original Author’s name;
  • display the Author’s photo or an inspirational image related to the quote;
  • have students submit their favourite quote and display the student’s photo above the quote.


  • “Settings->XmasB Quotes;”
  • “Tools-> XmasB Quotes;”
  • “Appearance->Widgets->XmasB Quotes.”

I stumbled upon this neat little plugin while I was on WordPress’ Plugin pages.  I thought it would be a neat way to encourage participation from students because teachers could ask them to submit their favourite quote and then could show their photo above it.  If you don’t want to include this plugin just remove the widget from the sidebar or deactivate the plugin.  If you like, you can just enter your own favourite quotes rather than those submitted by students.  Another option is to use image of the person whom the quote belongs to (eg. Einstein).

The basic functions of this plugin are very easy to manage.  Customizing the quotes with images is more difficult but is explained further down this page.

Unfortunately this plugin is not easy to manage.  But once it is set up you can quickly and easily change a quote a student has submitted (if you choose to have your students participate).

Setting Up the Quotes

  1. From the “Tools” menu in your admin, click on “XmasB Quotes.”  You can add a new quote on this page or click “Edit” below an existing quote to edit it.
  2. Enter the quote and the Author (eg. Socrates). You can choose whether or not you would like to be visible at this time.  If you choose “no” the quote will be saved in the list of quotes but will not /show up/rotate with the others at this time.
  3. Click “Add New Quote.”

That’s it!!  Your quote will now display on the sidebar.  If you have more than one quote, they will rotate randomly.

Using Student-submitted Quotes

If you would like to use quotes that your students submit you can do so with or without images/photos.  If your students cannot upload their photo and you do not have a photo of them to use, consider using a general inspirational image.  When you enter the text of the quote, you can enter “Josh’s Favourite Quote is:” or something similar.

Using Images With Your Quotes

To make the plugin display images (eg. your students’ photos), you first need to upload them into a certain directory within your WordPress installation.  If you do not specify a particular image then an image of blue quotation marks will be displayed above the quote.

The image files for this plugin are located in this WordPress plugin folder:

plugins / xmasb-quotes / images /

WordPress does not come with a file manager, but the “wp-FileManager” plugin will allow you to upload images to be used with your quotes.

Preparing Images to use with XmasB Quotes

You will need to have the images that you want to display above the quotes on your computer.  As well, be sure the maximum image size is only about 100 pixels wide.

Using the Thumbnail of the Student’ Image

I like to use the “thumbnail” image of the user’s photo after it’s been added to their profile because all of the work has been done for me (cropping, resizing etc.).  Students can add their own profile photo to their profile and then WordPress generates a smaller version, called a thumbnail.  The thumbnail is the smaller image that’s displayed in certain areas of your website where a larger (original) image would mess up the layout.  The sidebar (where your quotes are) is narrow, as compared to the rest of your site so it’s best to use a smaller image.

Click on “Users->All Users.”  Under the student’s name, click “Edit.”  Scroll down to the bottom of the page to the section that shows the student’s photo.  If the photo has not yet been uploaded, you can upload one from your computer now.  Or, you can ask the student to add one for you so that you can use the thumbnail.

Beside the original photo is the thumbnail that WordPress created when the photo was uploaded.  Hover your mouse cursor over the thumbnail and RIGHT click.  Select “Save image as…” from the menu.  Select the location on your computer that you want to save the image to and click “Save.”

(Optional) Rename the Image.  The name of this thumbnail image will reflect the user ID of the student.  For example, a student named “Josh” might be the third student you added as a “user” to your website.  To reflect this, and the fact that it is a thumbnail, WordPress will have named the file “3.thumbnail.jpg” – very hard to match up with “Josh” when you are working with the quotes plugin!!

For that reason it is best to rename the file before you uploaded to the XmasB Quotes image folder.  I like to name the thumbnails like so… “josh-thumb.jpg, taylor-thumb.jpg” etc.  This makes it very easy when I want to enter the student’s thumbnail image into the XmasB Quotes plugin – I type the student’s name (eg. “josh”), then “-thumb” and then “.jpg” which results in “josh-thumb.jpg”

Adding Images to Quotes

To insert a thumbnail (or any image) for the student’s favourite quote, follow these steps:

Note: When you specify an image for a quote, enter ONLY the image name (eg. “josh-thumb.jpg”), not an image URL (web address).

Now that you have the thumbnail image and it’s been renamed to reflect the student’s name, you can add it to the XmasB plugin.

Click on “File Manager” from your administration panel.  At the right, you will see a list of WordPress plugin folders.  Click on “xmasb-quotes” and then the “images” folder.  At the right you will now see all images that can be used for quotes (student images and otherwise).

At the top, click on “Upload Files.”  Next click on “Choose File.”  Find and select the image from your computer and click “Open.”  Next click the “Upload” button.  Your image will be uploaded into the WordPress “plugins/xmasb-quotes/images” folder.

Now it’s time to add a quote to the XmasB Quotes plugin.  From the “Tools” menu in your admin, click on “XmasB Quotes.”
You can add a new quote on this page or click “Edit” below an existing quote to edit it.
Enter the quote, the Author (eg. Socrates), the name of the image that you want to display above the quote (eg. “josh-thumb.jpg”) and click “Add New Quote.”

That’s it!!  Your quote will now display on the sidebar.  If you have more than one quote, they will rotate randomly.

Optional:  You can change the name of the title above the quote section by going to ”Appearance” then “Widgets” in the administration area.  By default, in the front end, the Quotes widget will be titled “Xmas B Quotes” and under that will be the image, the quote then the Author.  Click on it’s little arrow to expand the widget for “XmasB Quotes.”  Enter the text that you prefer.  I call mine “Our Favourite Quotes.”

Optional:  You can insert specific text before or after the quote is displayed.  Click on “Settings->XmasB Quotes” to configure these options.