Edit your knol from a sub-section

Many of us write long knols.  Sometimes while you're reading your knol, you would like to edit it, adding, deleting or changing some part, right from where you're reading.  Today, you have to scroll back to the top of the page, then click the "Edit this knol" button.  Wouldn't it be super if you could not do that scrolling step?  Just edit the knol right from where you're reading it?  I will show you a technique that allows this ability.


The basic technique is quite simple, provided you are alert to how your URL changes.  For example, the knol you are reading right now has a URL of

http://knol.google.com/k/will-johnson/edit-your-knol-from-a-sub-section/4hmquk6fx4gu/484

or alternately

http://knol.google.com/k/will-johnson/edit-your-knol-from-a-sub-section/4hmquk6fx4gu/484#view


Curious creatures that we are, we notice the argument "view" at the end of the URL, and wonder : "What other arguments can be stuck on the end of the URL"?  If you were to edit this knol, you would see the URL change to

http://knol.google.com/k/will-johnson/edit-your-knol-from-a-sub-section/4hmquk6fx4gu/484#edit



Aha!  A light bulb appears.  We can, anyplace within the knol body create a link directly to this URL like so
http://knol.google.com/k/will-johnson/edit-your-knol-from-a-sub-section/4hmquk6fx4gu/484#edit

This is now a link that, if you click it, will put you into Edit mode on this very article.  Now let's take the next step and shorten what appears, as the link text :
Edit this knol

You will notice, if you hover over this link, that the URL is exactly the same, we've just shortened the text you see, to something pretty.  Let's see if we can make it all work "Wiki" style.

Some section heading Edit this knol

So we see that we can add the "Edit" link next to any heading for example (you can add it anywhere in your text).  I don't particularly like that it shows up so LARGE however.  It doesn't appear that the knol editing tool is smart enough to allow a big heading and tiny text on the same line.  It doesn't seem like we can fix that in the HTML mode either (I just tried).  But we can put it either above or below the heading and make it tiny like this :

Edit this knol

Some section heading

Some section heading

Edit this knol

If we don't need the "heading" features of knol at all, we could put these all on the same line like this :

Some section heading Edit this knol

Or make it true Wiki style by this :

Some section heading [Edit]


But the true test of brilliance... can we embed the "Edit this knol" button itself directly within our text?

You notice of course, that Knol uses a form of "frame" within which you edit.  So you can't see all the things on the sides, top and bottom from inside the editor.  You can however View Source the page.  So let's see if we can figure out what and where that button is, so we can call it directly ourselves.

Here is the code from View Source
<div id="knol-edit-invite" class="knol-invite-box goog-inline-block"><div style="display: none" id="knol-edit-invite-middle" class="knol-invite-box-middle goog-inline-block"><a id="knol-edit-knol" href="#edit">Edit this knol</a></div></div>

Messy!  What the heck is that?  Not a jpg, not a gif.... Can we just stick this code directly in our article? Doesn't seem to work. Okay Plan B

There is apparently in HTML a <button> tag.  Let's see if we can use that here
Test

Hey it works in the editor! Now let's stick in our own text and link

Edit

Now let's put it all together

Some section heading Edit

So our beautiful button, which works when you Edit, is stripped out when you Save! Nasty.

Knol!  Let me insert buttons!  Hmmm how do we get around this?  Plan C?



Okay first let's create our own button image and upload it here.


Now let's make it click-able so we can actually edit our knol here (we do this in HTML mode)

You can hover over each of the two Edit buttons to see that the first one is simply a link to the GIF image file, while the second is a link to edit this knol.  Here is the code to do that :

<a href="http://knol.google.com/k/will-johnson/edit-your-knol-from-a-sub-section/4hmquk6fx4gu/484#edit"><img src="http://knol.google.com/k/-/-/4hmquk6fx4gu/8yqqhz/edit.gif" border="0"></a>


Pretty simple huh, once we've worked out the knolish kinks of course.  Now let's stick it on our faux heading line.

Some section heading

Can we make it look perhaps a little prettier by sticking the button all the way to the right?  How do we do that?  You cannot simply select the button and Right Justify it in the Knol editor.  What the Knol editor does instead, is Right Justify the entire line like this

Which looks even worse!  So you have to go into HTML mode, take the right justify directive, and shift it forward slightly so it only applies to the button itself.  The code is

<font size="4">Some section heading</font>
<div style="text-align: right;"><a href="http://knol.google.com/k/will-johnson/edit-your-knol-from-a-sub-section/4hmquk6fx4gu/484#edit"><img src="http://knol.google.com/k/-/-/4hmquk6fx4gu/8yqqhz/edit.gif" border="0"></a> <br></div>

and below we see the result

Some section heading

Now you can stick your nifty, click-able edit button anywhere in your text at all.  Bottom, sides of headings, within the text itself.  Whatever you want to do.  If you thought this article was helpful put a quarter in my cup!