Writer's Cafe Wizardry - Lesson 5

A Chapter by dw817

Reiterate add images to profile, add a way cool webpage counter to your profile page, and lastly have an image CHANGE to another image, just by moving the mouse pointer over it, even different sizes !

Writer's Cafe Wizardry - Ch 05

Want to read this in a different language ?
Change the TO field to your own country and click the TRANSLATE button after going HERE

LESSON FIVE - July 9th 2013 < >

Good afternoon, class ! Let's begin.

Ok, it's come to my understanding that some of you are still unaware of how to add images to your profile. And that's okay ! I'm here to help. First off there is something you should understand about Writer's Cafe that makes it unique from all other blogging websites.

You can have an infinite number of images uploaded. And I'm now of the opinion they don't even need to be saved in a post to be recalled later as I have lost my uploaded 'copies' of images to Writer's Cafe many times yet the images still show up wherever I put them.

So the simplest way to add an image would be, from the main page where you can see your profile, hold down the CTRL key from your keyboard, click on Writing, release the CTRL key, then then click Add Writing.

In the "- Select A Writing Type -" field just select Story, as we aren't going to keep this writing when we're done with it anyways.

OK, jump down to the TEXT area and Click on the Add Image button

, then the BROWSE button, and select an image from your computer that you would like to add to your profile. Then click OK. The image will appear.

Now, click on the image so it is highlighted and click the

button again and this time highlight the URL area. The easiest way to do this is to click inside it, then press HOME, hold down the SHIFT key, then press END, release the SHIFT key, then press CTRL-C.

Now press SHIFT-CTRL-TAB to return to the previous Internet browser tab we were on which should be your profile.

Click on Account (it should just be above the Friends button).

In the About Me field type carefully:

<img src="

then press CTRL-V to paste the image address we have in the clipboard, then close it with:

">

Press the ENTER key for a new-line And there you have it ! You have added an image to your profile ! At this point you can type text around it, or if you wanna add another image, press CTRL-TAB to return back to our dummy message editor and you are welcome to add another image at this point.

A bit of information. You don't need to save this post (where you are getting your image URLS from). So when you are all done here, just press CTRL-W to close this tab and you will be back with your profile editor.

To save your profile and your new ABOUT ME, click SAVE at the bottom and after a moment, it will reload the same page with changes. Click your Avatar in the top-left-hand corner of the screen and you will see the new images you've selected for your profile in place !

* * *

Now, the other element I was going to =TRY= and find was a good Freeware paint program. Unfortunately I can't find anything as good or as simple to use as Corel Paintshop Pro yet, which is what I use all the time. The current global Freeware paint program, GIMP, is far from simple and it is exceedingly tedious to use.

So I'll have to do a little more digging to find a good Freeware paint program to assist you in your blogging needs. I'll let you know when I find one.

* * *

This next lesson deals with adding a webpage counter to your profile. Thissaways you can always know when you have visitors and can see what kinna traffic you are receiving. The one I have used for quite some time now and seems to be exceptionally stable is called, "Web Counter."

Before you go here, go to your own homepage, where you can see your profile, then press Alt-D, Ctrl-C, to copy your homepage's URL address, and then go to this site HERE.

Click on the format you would like to have appear on your page from the selections they have, then in the PAGE NAME field, click in it, press CTRL-A and CTRL-V to paste in your new address.

If everything else looks good, click on the button, GET YOUR COUNTER CODE.

Hmm ! Quite a mess. No it's not that bad. This is just HTML and I'll show you where to put it. First off, click inside there, then press CTRL-A and CTRL-C.

Now go back to your profile and click ACCOUNT so you can edit your profile. Go down to where it says ABOUT ME, click in there anywheres you want, usually like at the bottom, then press CTRL-V to paste in that mess.

And you're done ! You can confirm your webcounter is in place by clicking on your Avatar seen in the top-left-hand corner of the screen and there you have it !

* * *

The next topic is a bit advanced and I am finding it will ONLY work on your profile, you can't even have this in your posts so we will focus on your profile that being the case.

Let's get there first, from your homepage, click on ACCOUNT, then type the following - carefully !

<img src="{{IMAGE-ONE}}" onmouseover="this.src='{{IMAGE-TWO}}'" onmouseout="this.src='{{IMAGE-ONE}}"'>

Holy Spumoni ! Whatta mess, right ?

Ok, for now, just copy the WHOLE thing over. The easiest way would be to triple-click it or to put the mouse pointer at the beginning (in Firefox), click just before the first character, then hold down the SHIFT key and click just right after the last character, release SHIFT to select it. Then press CTRL-C.

Then PASTE that straight into your profile with CTRL-V.

Now edit it carefully. Replace {{IMAGE-ONE}} with the HTTP URL of the first image you want to have appear. Look at the top of this lesson to see how to add images to your profile. Replace it TWICE with the same image HTTP URL as you can see {{IMAGE-ONE}} appears twice in this coding.

Then replace {{IMAGE-TWO}} with the HTTP URL image you want to have appear when the mouse moves over the first image.

When you are certain it is all accurate, click the SAVE button at the bottom, then click your Avatar back in the top-left-hand corner of the screen to see your results.

And how about that ! Now if you move your mouse-pointer over the first image, a new image appears and it doesn't matter if they aren't both the same size. Perhaps this could be a bit of an Easter Egg for those visitors who find your page in Writer's Cafe. *Grin*

That concludes today's lesson.

* * *

In the next lesson we'll reiterate and learn about how to have messages pop-up over an image you have the cursor held on, the power of Header Text specifically for Writer's Cafe, and how to make left-shifted and right-shifted images with text filling in on the opposite side in a neat colored panel.

See you next week !