Codes I Use On My Lenses

Changing the text (font) color on your lenses is one of the easiest codes there is. Here it is, you simply copy it, paste it into your text module, at the top, above your text, change the color number to whatever color you want, and publish your lens.

<b style="color: #000099; font-weight: normal;">This is shown with the #000099 (navy blue) text color. Just copy this code and replace the red text with your own text.</b>

This end result will look like this:

This is shown with the #000099 (navy blue) text color. Just copy this code and replace the red text with your own text.

Did you notice how I doubled the font colors up back there, using color inside of color so that there was red text inside of black text? Here's what that code looked like:

<b style="color: #000099; font-weight: normal;"><b style="color: #FE2E2E; font-weight: normal;">This is shown with the #000099 (navy blue) text color. Just copy this code and replace the red text with your own text.</b></b>

Here are some samples of different text colors I have used on my lenses. Obviously some colors look better on dark backgrounds. As a general rule, I use a darker or lighter shade of the text color as my background color. The hex code numbers listed here for the font/text are the same numbers I use for my backgrounds and boarders as well.:

Here are some samples of different text colors I have used on my lenses: This is shown with the #610B0B (brick red) text color.

Here are some samples of different text colors I have used on my lenses: This is shown with the #FE2E2E (red) text color.

Here are some samples of different text colors I have used on my lenses: This is shown with the #FA5858 (blush red) text color.

Here are some samples of different text colors I have used on my lenses: This is shown with the #F5A9A9 (peach) text color.

Here are some samples of different text colors I have used on my lenses: This is shown with the #F8E0E0 (cream) text color.

Here are some samples of different text colors I have used on my lenses: This is shown with the #FF8000 (orange) text color.

Here are some samples of different text colors I have used on my lenses: This is shown with the #F7BE81 (orange cream) text color.

Here are some samples of different text colors I have used on my lenses: This is shown with the #FFFF00 (yellow) text color.

Here are some samples of different text colors I have used on my lenses: This is shown with the #ACFA58 (lime green) text color.

Here are some samples of different text colors I have used on my lenses: This is shown with the #81F7BE (mint green) text color.

Here are some samples of different text colors I have used on my lenses: This is shown with the #5E610B (olive) text color.

Here are some samples of different text colors I have used on my lenses: This is shown with the #0B610B (green) text color.

Here are some samples of different text colors I have used on my lenses: This is shown with the #0B3B39 (dark teal) text color.

Here are some samples of different text colors I have used on my lenses: This is shown with the #0B615E (teal) text color.

Here are some samples of different text colors I have used on my lenses: This is shown with the #04B4AE (turquoise) text color.

Here are some samples of different text colors I have used on my lenses: This is shown with the #58FAF4 (sky blue) text color.

Here are some samples of different text colors I have used on my lenses: This is shown with the #0B243B (midnight blue) text color.

Here are some samples of different text colors I have used on my lenses: This is shown with the #0B3861 (twilight blue) text color.

Here are some samples of different text colors I have used on my lenses: This is shown with the #0080FF (cerulean blue) text color.

Here are some samples of different text colors I have used on my lenses: This is shown with the #A9D0F5 (pale blue) text color.

Here are some samples of different text colors I have used on my lenses: This is shown with the #000099 (navy blue) text color.

Here are some samples of different text colors I have used on my lenses: This is shown with the #0101DF (blue) text color.

Here are some samples of different text colors I have used on my lenses: This is shown with the #5858FA (periwinkle) text color.

Here are some samples of different text colors I have used on my lenses: This is shown with the #A9A9F5 (lilac) text color.

Here are some samples of different text colors I have used on my lenses: This is shown with the #240B3B (deep plum) text color.

Here are some samples of different text colors I have used on my lenses: This is shown with the #380B61 (plum) text color.

Here are some samples of different text colors I have used on my lenses: This is shown with the #5F04B4 (purple) text color.

Here are some samples of different text colors I have used on my lenses: This is shown with the #8000FF (violet) text color.

Here are some samples of different text colors I have used on my lenses: This is shown with the #AC58FA (lavender) text color.

Here are some samples of different text colors I have used on my lenses: This is shown with the #D0A9F5 (purple haze) text color.

Here are some samples of different text colors I have used on my lenses: This is shown with the #610B5E (heather) text color.

Here are some samples of different text colors I have used on my lenses: This is shown with the #B404AE (fuschia) text color.

Here are some samples of different text colors I have used on my lenses: This is shown with the #FF00FF (hot pink) text color.

Here are some samples of different text colors I have used on my lenses: This is shown with the #F781F3 (cotton candy) text color.

Here are some samples of different text colors I have used on my lenses: This is shown with the #F6CEF5 (bubble gum) text color.

Here are some samples of different text colors I have used on my lenses: This is shown with the #610B38 (deep rose) text color.

Here are some samples of different text colors I have used on my lenses: This is shown with the #8A084B (magenta) text color.

Here are some samples of different text colors I have used on my lenses: This is shown with the #DF0174 (rose) text color.

Here are some samples of different text colors I have used on my lenses: This is shown with the #FE2E9A (rosy) text color.

Here are some samples of different text colors I have used on my lenses: This is shown with the #FA58AC (pink) text color.

Here are some samples of different text colors I have used on my lenses: This is shown with the #F5A9D0 (rose petal) text color.

Here are some samples of different text colors I have used on my lenses: This is shown with the #3B240B (sepia) text color.

Here are some samples of different text colors I have used on my lenses: This is shown with the #61380B (brown) text color.

Here are some samples of different text colors I have used on my lenses: This is shown with the #8A4B08 (rust) text color.

<p style="padding: 5px; background-color: #ffffff; font-weight: normal; border: dotted 2px #99ccff;"><b style="color: #000099; font-weight: normal;">This is the dotted boarder code which used #ffffff (white) background and #99ccff (pale sky blue) dotted boarder and #000099 (navy blue) text color. Just copy this code and replace the red text with your own text.</b></p>

This end result will look like this:

This is the dotted boarder code which used #ffffff (white) background and #99ccff (pale sky blue) dotted boarder and #000099 (navy blue) text color. Just copy the code above and replace the red text with your own text to get this result.

Another question is this: "I joined an affiliate program, and I want to use one of their banners on my Squidoo lens, but all they have are tower banners, and they leave a big blank space on my lens. How to I wrap text around them?"

Now this question I answered on my Pepperjam Lens, so all I am going to do now, is copy and paste my answer from there to here, and here it is, with all original codes intact:

Tower banners don't look as good on a Squidoo lens, but if you stack several side by side they do look a little bit better. I think these would work best on a blog's sidebar rather than a Squidoo lens. Don't you?



I placed 3 side by side here and it doesn't look that bad. Just one though, leaves a big blank mess on your lens which doesn't look nice at all. Some of the towers really have nice pictures on them though, don't they? I like this one, but see how it looks on Squidoo? It leave a big blank space. Dead air. You don't want dead air on your lens. If you really have your heart set on using towers on your lens, you need to know the coding for floating words around images.



Let's see if I can remember how to float words around an image. I've done it before, so I know I can do it, but I've never tried it with an affiliate banner before so I'm not sure what will happen here. Now, I don't have enough words or lines of text to write here to justify adding yet another tower, so I'm going to use a smaller banner to show you what floating text around a banner looks like. So, if you want to float text, this is what it will look like.

I know a lot of folks signing up for these programs are not code writers or java scripters like me, so, I'll tell you how to write up this code while I'm here. It's a bit more complicated than basic html, but it's just as easy once you know what to do. Here's the HTML code to copy and paste:



<b style="background: #000000; width: 200px; float: left; padding: 15px; margin: 15px; font-size: 150%; line-height: 1.5em;"alt="Quote">PASTE YOUR BANNER CODE HERE</b>



A quick explaination of the code: the color #000000 (black) should be changed to #ffffff (white) if you do not add a background color to your lens. I have changed the background color of this lens to #000000 (black) thus in the code the background color must be black s well. I could just have as easily changed it from #000000 (black) to #FE2E2E (red) to match the boarder color instead of the background color, which I am going to do right now so you can see what I'm talking about.

You'll also notice that in this second one, I changed to word "left" to "right" instead, thus moving the banner to the other side of the page.

The Quote code and the floating text or word wrap code (see explanation in the Tower Banner section above) is exactly the same code, with a few minor changes.

Okay, the piece in question, (copied and pasted from the lens in question) looks like this, there is no need for you to read the words, I just copied them, so you could see what the whole thing looks like on your lense:

The fact that Etiole was amphibious was never in question. What exactly he is beyond that, I do not know for certain. He is not from here, I know that much, but where (and possibly when) it is he comes from, that I do not know, nor does he seem to know either. He is lost and confused about his past. That he came on a ship is known, but the ship was not made by his people, that too is known. Who made the ship and how exactly it got from one place to another is in question. He is uncertain, however, if he came here from a different planet from a different solar system, or if he came here from an alternate dimension or dispensation of the Earth. (My personal thought here is that there is a very real possibility that he is from billions of years into Earth's future and that he is what the Human race will one day become.)
. . . by all respect he is an alien in the true sense of the word . . .
So, by all respect he is an alien in the true sense of the word, meaning that he is not a native to the place where he is at the present time, wither he originated on Earth in another dimension and is alien to this time frame or he originated on another planet in another solar system, does no effect the fact that he is still "alien" to our Earth.

The question now becomes, what exactly is he? I coined the title "Eel Siren" and that is the "species" I refer to him as, being as I do not know what else to call him. Though the term "eel" may be interchanged with the term "salamander" as well, seeing how he bares resemblance to both. Either way, he is amphibious, meaning that he is just as at home underwater, as he is on land. This in turn brings us to the question: If he is an amphibious alien, than what exactly is an amphibious alien, and are there more like him out there?

Okay. Let's get going now. There is a reason for my pasting the whole thing text and all here, you see, in order for this code to show up with a paragraph above it, below it, and around it, you need to have the text right in with the code. Let's see if I can explain what I mean so that you can understand it.

I'm going to copy and paste that again, this time editing it so that it'll display as I see it from editor mode, okay? Here goes (I'm outlining it so you can see where it starts and ends, there's no need for you to read the text here). You will notice that in editor mode, this is a very hard code to read, due to it's placement right inside of your text:

<p style="padding: 5px; background-color: #ffffff; font-weight: normal; border: dotted 2px #99ccff;"><b style="color: #000099; font-weight: normal;"><b style="FONT-SIZE: 100px; FLOAT: left; COLOR: navy; LINE-HEIGHT: 70px; PADDING-TOP: 2px; FONT-FAMILY: times">T</b>he fact that Etiole was amphibious was never in question. What exactly he is beyond that, I do not know for certain. He is not from here, I know that much, but where (and possibly when) it is he comes from, that I do not know, nor does he seem to know either. He is lost and confused about his past. That he came on a ship is known, but the ship was not made by his people, that too is known. Who made the ship and how exactly it got from one place to another is in question. He is uncertain, however, if he came here from a different planet from a different solar system, or if he came here from an alternate dimension or dispensation of the Earth. (My personal thought here is that there is a very real possibility that he is from billions of years into Earth's future and that he is what the Human race will one day become.)
<b style="background: #99ccff; width: 200px; float: right; padding: 15px; margin: 15px; font-size: 150%; line-height: 1.5em;" alt="Quote">. . . by all respect he is an alien in the true sense of the word . . .</b>
So, by all respect he is an alien in the true sense of the word, meaning that he is not a native to the place where he is at the present time, wither he originated on Earth in another dimension and is alien to this time frame or he originated on another planet in another solar system, does no effect the fact that he is still "alien" to our Earth.

The question now becomes, what exactly is he? I coined the title "Eel Siren" and that is the "species" I refer to him as, being as I do not know what else to call him. Though the term "eel" may be interchanged with the term "salamander" as well, seeing how he bares resemblance to both. Either way, he is amphibious, meaning that he is just as at home underwater, as he is on land. This in turn brings us to the question: If he is an amphibious alien, than what exactly is an amphibious alien, and are there more like him out there?
</b></p>

phew! That's not easy to change. Every single bit of that had to be recoded so it would display the code so you could see the code instead of the end result. When in editing mode on your lens, editing a code that runs inside of text like this is the hardest type of code to work with because it is the easiest type of code to accidently erase when editing your text. So you must be very careful when editing your text, to be certain you don't accindently erase part of the code.

So now you want a code you can copy and paste into your own lens. Well, if you look carefully at the finished product and the edit mode version, you'll notice that I have used three different codes here, and put each one inside of another one, so now I'll have to separate them, and show you each separatly, and than show you how to put them together as one.

Here is the code all in one. I have removed my text, and replaced it with instructions typed in red. The code is typed in black. This allows you to see where to code it compared to the text itself:

<p style="padding: 5px; background-color: #ffffff; font-weight: normal; border: dotted 2px #99ccff;"><b style="color: #000099; font-weight: normal;"><b style="FONT-SIZE: 100px; FLOAT: left; COLOR: navy; LINE-HEIGHT: 70px; PADDING-TOP: 2px; FONT-FAMILY: times">P</b>LACE YOUR FIRST PARAGRAPH TEXT HERE Notice that you have a space bar left here.)

<b style="background: #99ccff; width: 200px; float: right; padding: 15px; margin: 15px; font-size: 150%; line-height: 1.5em;" alt="Quote">TYPE YOUR QUOTE HERE</b>TYPE YOU SECOND PARAGRAPH TEXT HERE (THIS IS WHERE THE QUOTE IN THE BOX SHOULD COME FROM AS WELL) Notice that there is NO space between the code and text here!

TYPE YOUR THIRD PARAGRAPH HERE (Notice there is a space bar between these paragraphs.)
</b></p>

Can you see the three codes used? I'll separate them for you:

<p style="padding: 5px; background-color: #ffffff; font-weight: normal; border: dotted 2px #99ccff;"><b style="color: #000099; font-weight: normal;">This is the dotted boarder code which used #ffffff (white) background and #99ccff (pale sky blue) dotted boarder and #000099 (navy blue) text color. Just copy this code and replace the red text with your own text.</b></p>

This end result will look like this:

This is the dotted boarder code which used #ffffff (white) background and #99ccff (pale sky blue) dotted boarder and #000099 (navy blue) text color. Just copy the code above and replace the red text with your own text to get this result.

<b style="color: #000099; font-weight: normal;"><b style="FONT-SIZE: 100px; FLOAT: left; COLOR: navy; LINE-HEIGHT: 70px; PADDING-TOP: 2px; FONT-FAMILY: times">P</b>LACE YOUR PARAGRAPH TEXT HERE Notice that you have to put the first letter of the first word inside of the code, in order for this to work.

In this code the word "navy" was used to create a darker shade of blue. You can replace this word with any other color name (red, orange, blue, olive, lilac, etc) or use an use the hex number #000000 (for black) #ffffff (for white) etc to create any one of thousands of colors. It is best if the letter is a different shade of the same color as your text or a color to match the boarder used on your lens.

Here is what the finished result looks like:

PLACE YOUR PARAGRAPH TEXT HERE Notice that you have to put the first letter of the first word inside of the code, in order for this to work.

<b style="background: #99ccff; width: 200px; float: right; padding: 15px; margin: 15px; font-size: 150%; line-height: 1.5em;" alt="Quote">TYPE YOUR QUOTE HERE</b>TYPE YOUR SECOND PARAGRAPH TEXT HERE (THIS IS WHERE THE QUOTE IN THE BOX SHOULD COME FROM AS WELL) Notice that there is NO space between the code and text here! It is important that you leave NO SPACE between the code and the text, in order for this code to work properly!

You can change the color of the box by changing the #99ccff (sky blue) to any other Hex code there is.

You end result will look like this (Notice how the text color is not the same as was seen on my lens):

TYPE YOUR QUOTE HERE TYPE YOUR SECOND PARAGRAPH TEXT HERE (THIS IS WHERE THE QUOTE IN THE BOX SHOULD COME FROM AS WELL) Notice that there is NO space between the code and text here! It is important that you leave NO SPACE between the code and the text, in order for this code to work properly!

You can change the color of the box by changing the #99ccff (sky blue) to any other Hex code there is. Remember those floating banners from before? Well this is the exact same code that was used to create them. Like the floating banners, you can change the background colors on quote boxes to anything you want, and can flip them from left to right, simply by changing the word type in the code. Here they are again, only this time with the banners removed and a quote added instead:

. . .a quote added instead. . .
. . . a quote added instead . . .
You will now notice the reason why you should not place two of these codes side by side, one left and one right. See what it does to the text? The text is squishing in the center and flowing around the boxes just like the boxes are telling it to do, but this doesn't really look that good when used on a Squidoo lens due to the space restrictions of the text module. You can however try this on other web sites, and I know it does work on Blogger and BlogSpot blogs (certain templaes only) because I have used it on my own log before. If fact almost everything on this lens, can be used on your blog as well as your Squidoo lens, so you can edit you blog posts announcing your lenses so that they match the lens.

You well notice, however that no matter what color you change the box to, the text anyways remains the same steel grey color. This is the reason for layering the codes as I had done on my Water Faerie lens. You need to change the color of the text on the entire lens to change the color of the text in the box.TYPE YOUR QUOTE HERE
Now, for my Water Faeries lens, I had changed the color of the text in the quote box, by changing the color of all the font on the page. You may just want the quote box and not change anything else on the page, but want to change the color of the text in the box itself. That's easy. All you do is take the font color code and add it to the quote box code like so:

<b style="background: #99ccff; width: 200px; float: right; padding: 15px; margin: 15px; font-size: 150%; line-height: 1.5em;" alt="Quote">TYPE YOUR QUOTE HERE</b>TYPE YOUR SECOND PARAGRAPH TEXT HERE (THIS IS WHERE THE QUOTE IN THE BOX SHOULD COME FROM AS WELL) Notice that there is NO space between the code and text here! It is important that you leave NO SPACE between the code and the text, in order for this code to work properly!

At the bottom of several of my lenses you will find the question asking you to link to my lens and giving you the code to copy and paste. Here is one such box, copied off of my Publishing Methods lens:

Here's the HTML code to copy and paste:


<a href="http://www.squidoo.com/publishingmethods/" title="Want to publish your book? Read this first!">Want to publish your book? Read this first!</a>


Link to us from your blog, your MySpace page, your website, your forum sig, and every other place you can think of! Tell your friends about this page, spread the word!

Here is what your link will look like:

Want to publish your book? Read this first!

For NaNoWriMo users, we have this banner!
Here's the HTML code to copy, paste, remove all * :

<a href="http://www.squidoo.com/publishingmethods/" title="Want to publish your book? Read this first!"><*img* src="http://img95.imageshack.us/img95/9946/mybanner48b1b191eca25xb2.jpg" alt="Create your own banner at mybannermaker.com!" border="*0" /*></a>

Here is what your link will look like:



For info on how to make banners for your own lenses check out this site: Make your own banner at MyBannerMaker.com!

Well, this is one of those codes others have asked me how to do,