How to Make an Interactive Skills Gauge Gadget

[photontorpedotube]

My post on the subject here, http://chestnutpermiefarm.blogspot.com/2012/12/how-to-make-skills-objective-gauge.html .

[hilljen]

Hey, photon, I need more help! I almost got it, but apparently did something wrong because all I see on my post is the code for the gauge, not the actual cool graphic.

Any ideas on what I might have done wrong and how to fix it? I'd like to do a gauge for each of my goals when I begin working on them, so need to refine this process!

And thanks for the instructions on your blog site. I could never have gotten this far without the handholding. Now I just need to figure out what I missed or did wrong and correct the problem.

Since progress in this skill is not reflected in a purely numerical way, I think I will break it down into 100 small steps and the include that "key" to show what the number levels represent. This particular skill will include some miscellaneous tasks and also have a numerical portion that represents actual plants located, studied and identified, harvested, prepared, and tasted, plus other things such as maps drawn, photodocumentation (and organization thereof), etc.

Thanks again. Sorry to be so remedial about computer things...

[photontorpedotube]

Hey, photon, I need more help! I almost got it, but apparently did something wrong because all I see on my post is the code for the gauge, not the actual cool graphic.

Any ideas on what I might have done wrong and how to fix it? I'd like to do a gauge for each of my goals when I begin working on them, so need to refine this process!

And thanks for the instructions on your blog site. I could never have gotten this far without the handholding. Now I just need to figure out what I missed or did wrong and correct the problem.

Since progress in this skill is not reflected in a purely numerical way, I think I will break it down into 100 small steps and the include that "key" to show what the number levels represent. This particular skill will include some miscellaneous tasks and also have a numerical portion that represents actual plants located, studied and identified, harvested, prepared, and tasted, plus other things such as maps drawn, photodocumentation (and organization thereof), etc.

Thanks again. Sorry to be so remedial about computer things...

Ciao hilljen.  That is ok.  It is my fault for not communicating clearly. 

If you're using blogger, it might be because you have your compose button set instead of the html button.  These are two buttons that are displayed in the upper left side of the post writing screen. Do you see it just below and to the left of the "Post title" area? 

Change the button to html before you paste the code into your post.  That may fix the problem.  Please let me know because I am going to edit my post to add that bit of information. 

I'm using the gadget in much the same way for some of my skills.   

I also have now figured out how to make the gadget about half the size as blogger automatically makes it.  You just have to edit the size by multiplying the height and width by .5 in the HTML code you copied to your blog.  Works like a charm.

Sounds like you might have multiple gauges for just one skill.  I have two so far for my writing skill.  One of the objectives is to write a blog post about each of my thirteen skills and link to it here.  The gauge for that goes to 13. 

Another is to write 130 posts about the 13 skills.  The gauge for that goes to 130.  You can do the same for yours.  The hard part is figuring out objective ways to measure your progress. 

Figuring out objective measurements is important because it helps you document your progress and gives you a sense of accomplishment.  It's a morale booster.

[hilljen]

I'm not on blogger, I am trying to post via the quick reply or reply options here in this forum. Sorry to be so dense, but I can't figure out how to find out if those options give me HTML mode or how to change to that.

Also, where exactly in the HTML code would I insert the information to change the gauge to half size, and what specific wording to use?

I'm going to try to keep it to one gauge per each of my 13 topics. Although not every "point" on the gauge will be totally equivalent, my intention is more to indicate progress down my To Do list for that topic. So for the foraging one, I gave myself credit for ordering and receiving the field guide I wanted. My next tasks will probably include making a list of what seasonal plants I want to go look for soon and gathering up my gear (camera, field note book, baggies to collect specimens, hand trowel, etc.). Then I will count activities, such as going out collecting and actually harvesting one of my target items. As I work through the book, I will credit myself one "point" for each different species I familiarize myself with (about 50) and simultaneously get points for other foraging activities, such as reading additional books, going on collecting trips with others, attending a seminar or watching an educational video, etc. I don't want to have too many different measuring systems going on one topic at a time.

[photontorpedotube]

You have to switch your post mode here to HTML also.  Now that changes depending on the software used by the website.  I am not sure if the forum here would support the code from Google Docs.  Maybe one of the moderators can tell us.  If there is a way to post the Google Doc script into a post using HTML editor, it should work. However, I don't know how to do it.

To change the size of the Gauge, you have to edit the code.  Toward the end of all the gobbleteegook do you see "width": 600, "height":375}?  Change those numbers to "width":300,"height":187}.  That makes your gauge half the size Google Docs automatically creates it.

You could create an image from your Google Doc gauge.  It would not be interactive, but you could embed it into your post using the insert image button on the far left of the bottom row above.  Here is how:

1) Go into the Gauge and click on the little arrow at the top right.  You should see an option "save image" just above "publish chart".  Save the image to your desktop or somewhere you can find it later. 
2) Upload it to the Internet on a photograph hosting site or blog. 
3) Make the picture public.
4) If you use Chrome, you can copy the url for the photograph by right-clicking it and selecting "copy image url." 
5) Come back here and select the picture icon on the botton left row of buttons for a message. 
6) Past the image url between the  code marks (Ctrl-V) so it will appear on a posts to the forum:

[Mr. Bill]

You have to switch your post mode here to HTML also.  Now that changes depending on the software used by the website.  I am not sure if the forum here would support the code from Google Docs.  Maybe one of the moderators can tell us.  If there is a way to post the Google Doc script into a post using HTML editor, it should work. However, I don't know how to do it.

Yeah, that's not going to work on TSP Forum.  We disallow most HTML/Javascript code in posts because of the risk of malicious code.  Sorry about that.

[hilljen]

That's fine. I am glad to know that it wasn't just something I was doing wrong. Thank, photon for trying to help me. And thanks, Mr. Bill, for keepipng those trolls at bay.