How to display unreadable HTML code?

When I first started creating scroll boxes for html code, my computer would read the html code inside the box and display the image inside the box.

Like this:

I realized my computer was reading the html code inside the scroll box! I researched and found you have to alter the html code so your computer doesn't read the html code but display it instead! It's actually pretty simple to fix the code.

Here's what you do!!


So if a code looks like this unaltered:

<a href="http://jenieshell.blogspot.com">

it will now look like this once altered:

That's all you have to do so your computer won't read the html code in your scroll box! Just change the brackets!!

While researching I also found a really helpful site that will change your code with a click of a button. It's a lot less time consuming and it allows for less errors! All you have to do it paste in your html code and press the convert button. It's that easy!!

Hope this tutorial was helpful! Please give me feedback!! Thanks

Jen

How to make a scroll box?

This is how to make a scroll box similar to the one on my sidebar called Grab the Button.

<center><a href="http://jenieshell.blogspot.com/"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi7iigeGHM-6eX1PDBE_TDNEqpPqy-UdU4XsKQDdX-C6vrYOOnY8vU0kAo28u-6FPRcyS_ZkHBhSxQOBijRI6v75c47uIQXUE9FHKf3Y386f2nL_NQDLEU0vXFExrgew42Kt3TjUDyIlFE/s170/Blog+Design+Button+copy.gif"/></a></center>

Here's the code you will need for the scroll box.

<div style="border: 3px solid black; overflow: auto; height:
125px; width: 125px; color: black; background-color: white;">YOUR
TEXT HERE</div>

You can change the color of your border by changing the color from pink to another color, or the size of your box by changing the number of the height and width. (example: 200px)

You will need to copy this code into your side bar or post where you are needing the scroll box. You will also need to add text that fits your needs where it says YOUR TEXT HERE! If you are wanting to make a scroll box for a "grab the button code" you will then add the code for your button here also. If you want to know how to make a blog button click here!

Once you've added "Your Text" you are now ready to copy and paste the entire code into your blog post or sidebar.

If you are installing it to your Blogger sidebar you will select Add a New Gadget in your layout page. Next you will select HTML/Javascript and paste your code. Click save and enjoy!

FYI: If you are wanting to display HTML code inside your box, such as code for a blog button, you will need to alter the code so your computer won't read the html code. To learn how to alter your HTML code GO HERE!!

JDC Happy Holidays

A Holiday Theme for Jenieshell's Design Challenge!!

TTC Buttons

The Two Coins

I am still working on Jenny's blog, A Tale of Two Coins. Here are some pictures I was working on for her sidebar. Jenny let me know what you think!! We are getting close to the final product!!

Jen

Jenny, I am not sure why Blogger is putting a white border abound the picture in with the borders. I am pretty sure I can get it to work right when we put it in the sidebar! I am really tired, I think I am calling it a night for tonight!!

Jen

A Tale of Two Coins

I am very excited to be working on my new friend, Jenny's Blog! She is an incredibly strong women and has been through an extremely difficult time in her life recently! Her blog is called A Tale of Two coins. She said she wanted something Whimsy and likes soft colors so We'll see if I am close to what she was wanting!! Jenny here we go!!

Following the Footsteps Grab Button