Wednesday 28 November 2007

TIP - Polls in a Post

Time to get 'down and dirty' with an attempt to include a "Poll in a Post".

If it works, at least David is going to be a happy turkey!

Here goes ...

---------------------------------------------------------------------------------

1. Backup your old template!

--------------------------------------------------------------------------------

2. The object of this exercise is to let the Blogger engine do all the work and for us to simply copy and paste the result into the space (the Post) that we want to use it in. With that in mind, it is time to generate a Poll that Blogger will happily build for us and stick in the R/H panel wherever we choose to put it.

 

--------------------------------------------------------------------------------

3. Here is the Poll, displayed in all its glory in the sidebar of the page. It is necessary to actually 'publish' the Poll to have the code generated, but it won't remain here for long, so where you place it is quite irrelevant:

 

--------------------------------------------------------------------------------

4. Now comes the cunning part. Right-click anywhere on your page and select 'View Source'. The resulting HTML code will be shown to you in your text editor, probably Notepad, because you've not taken my advice previously and downloaded EditPad Lite. "Leading a horse to water ..." is the phrase that springs to mind but hey, each to his or her own!

 

--------------------------------------------------------------------------------

5. Do a search for Poll1 (if you already have Polls on your page, then this might be different, i.e. Poll2, or Poll3, or Poll4) in the text editor (much easier if you're using EditPad Lite!) and when the required 'word' has been found, you will see almost exactly the same code as I've displayed in the screencap below. I've highlighted a couple of areas in green and yellow as they become important a little later, but for the moment just remember that this is the Poll ID that Blogger has built for you.

Copy the code from the first "<div" to the last "</div>" of the area I've highlighted in the screencap (no, no, NO ... not the screencap ... your text editor!) and paste it into a new page (much easier in EditPad Lite because of the tabbed display!):

 

 

The next image is for INFORMATION only. It shows how the same code looks in a Blogger template and if you have an interest in this stuff, compare it with the HTML above to see how 'Blogger-speak' works:

 

--------------------------------------------------------------------------------

6. Here comes the 'fiddly' stuff!

  • Go to the piece of code you saved in the last step.
  • Add this line of text at the top (copy/paste if you wish)
    <div align='center'>
  • Change the height to '160'. This depends on the length of your question and answers, so check the display and increase it if necessary, or you will end up with a vertical scrollbar.
  • Add a final </div> at the bottom.

 

--------------------------------------------------------------------------------

7. Pay attention at the back! We're nearly there.

I will assume that the majority of readers of this article compose their 'Posts' using the 'Compose' or WYSIWYG editor. Unfortunately, this is where you have to dip your toes into the muddy waters of HTML. If you are using the 'Compose' method, stop wherever you wish to insert the Poll and switch to 'Edit Html'. You will be able to see where you stopped typing, so all you need to do is insert a couple of new lines, copy the text from your text editor (the stuff you've been hacking in the previous steps), and paste it into the editing window. It's as easy as that!

 

--------------------------------------------------------------------------------

8. When you're satisfied with the 'Preview' you can hit 'SAVE' (you're saving it as a 'draft'), because you aren't finished - yet!

BTW, the 'Preview' almost always shows you a distorted view of your Post, or rather, it displays differently on your page than it does in the 'Preview'. You have been warned!

--------------------------------------------------------------------------------

9. Finally! Go to Template | Page Elements, select 'Edit' for the Poll you created earlier, then select 'REMOVE PAGE ELEMENT' in the 'Create a poll' window that opens up. You're done with this one, and if you don't remove it, the one in your Post won't appear!

--------------------------------------------------------------------------------

10. Time to take a look at how the Poll displays when it is posted:

 

Q. Test Question

 

--------------------------------------------------------------------------------

Ahhh, satisfaction! The colours aren't exactly what I want, and if this was a 'real' Poll for my site I would tweak things a bit further, but I am sure you are able to do this for yourselves.

Now, sit back and wait for the feedback to your Poll ...

back to the top

 

2 comments:

mrsnesbitt said...

Gosh! A lot of information there Terry! I will have a drink me thinks! Everything looks clearer after a glash hov wine! LOL!

Fletch said...

LOL Denise, I'd hardly put it up before I was notified that there was a comment from you.

Looks complicated, but it is achievable.

My concern is how it will display in different templates, but I'm willing to work with anybody that has a problem getting the Poll to display 'just-so'.