How do you put a code retrieval box below an image

Discuss how you are making money. How do we optimize our actions and get the most out of what we are doing online information and action.
Image

How do you put a code retrieval box below an image

Postby onnaholl » Thu Mar 26, 2009 7:25 pm

Does anyone know how to add a box below an image to show the code so someone else can put it on their blog? I have a button that links to my Toddler Craft site and want to put it on my site so others can grab it and add it to theirs. Thanks so much!!

Onna
Last edited by Sheryl Loch on Fri Oct 02, 2009 1:30 am, edited 1 time in total.
Reason: Placed a twitter button.
Image
Have Children? Need Activities, craft or advice? Come Over To Toddler Craft

Want to make extra money online for free? Making Money Quick Blog
User avatar
onnaholl
 
Posts: 199
Joined: Tue Mar 10, 2009 6:00 am
Location: RI

Re: How do you put a code retrieval box below an image

Postby Brian Hawkins » Fri Mar 27, 2009 2:45 am

Give this a try Onnaholl:

Code: Select all
<form>
<textarea name="link" cols="26" rows="1" class="html-text-box" onclick="javascript:select();">
insert your content here
</textarea>
</form>

Change the columns 'cols' and rows to fit your content. The text area will scroll if it needs to. You can remove the onclick="javascript:select(); if you don't want the content to highlight on click.
Sometimes offensive but never boring
That’s Right, I Said It! - Harsh opinion and commentary
User avatar
Brian Hawkins
 
Posts: 147
Joined: Sat Dec 06, 2008 2:49 pm
Location: Belleville, MI 48111

Re: How do you put a code retrieval box below an image

Postby Sheryl Loch » Fri Mar 27, 2009 3:16 am

I do not run a Wordpress so, I am taking a jump on this on.

If you write out the code that you want them to be able to copy out -

When you post it on your article you will use

[codeblock]<a href=http://sherylloch.com>Sheryl Loch</a>[/codeblock]

This will put the visible code and not change it into an actual link.

IF you have Auto Links as an option for your post, you will need to turn that off. I have the option on a per post basis as if I want Auto Links on.

Mind you - I am on a B2evo blog. I may be able to this & you may not have the same options on a wordpress.

If this doesn't work, maybe we can find another way to do it on Wordpress.

Sheryl Loch
User avatar
Sheryl Loch
 
Posts: 569
Joined: Tue Oct 14, 2008 10:57 pm

Re: How do you put a code retrieval box below an image

Postby Sheryl Loch » Fri Mar 27, 2009 4:23 am

Hey Brian,
You must have posted t the same time. I just now saw your info!

I went and tried it on my blog! It Worked!

I was trying to do the same type of box you have but, I was doing it with an iframe & it did not like it. I have a hard time with what works in BBCode does not always do the same thing in HTML. Maybe I should have tried turning BBC on in my blog now, that I think about it. DUH! :oops:

I also figured out that the col= is how wide you want the box & rows= is the height! Took me a minute but, I got it.

Thanks! I had not ever used this set of code before.
Sheryl Loch
User avatar
Sheryl Loch
 
Posts: 569
Joined: Tue Oct 14, 2008 10:57 pm

Re: How do you put a code retrieval box below an image

Postby onnaholl » Fri Mar 27, 2009 5:07 am

That's terrific I'll try it-!! Do you know if I have my image url How I can get it to post in word press? I was able to get it with a plug in in my side bar, but not sure if I can add to that this code? Originally tried to post image using this code <a href= http://toddlercraft.net><img src=http://toddlercraft.net/wp-admin/images/toddlercraft_button.gif</a>
in a text widget (which I have done with other images but it didn't work). I wouldn't even had, had this button or any code, if it wasn't for brad!! If I have code to get the image, do I just post this code you gave below it?
thanks!!
Onna
Image
Have Children? Need Activities, craft or advice? Come Over To Toddler Craft

Want to make extra money online for free? Making Money Quick Blog
User avatar
onnaholl
 
Posts: 199
Joined: Tue Mar 10, 2009 6:00 am
Location: RI

Re: How do you put a code retrieval box below an image

Postby Sheryl Loch » Fri Mar 27, 2009 8:22 am

Ok, I may be mis understanding the question so, if I'm not right then let me know & we will get it figured out.

If you are wanting to make a picture clickable then your code will be

Code: Select all
<center><a href="http://toddlercraft.net" target="_blank"><img src="http://toddlercraft.net/wp-admin/images/toddlercraft_button.gif" alt="Toddler Crafts" title="Tell Your Story" width="" height=""/></a></center>


This will Center your picture & make it click open a link.
TARGET="_blank will also have the link open in a new tab so, they do not loose your blog.
The ALT TEXT is what the bots can read so, they know what the pic is about.
The TITLE is so you can know what the pic is about.
Brad has already sized it so, you will not need to insert any size dimensions.

You can change the Alt Text & Title to fit the description of any picture. I just put in what I thought you might use.

I think you were only missing 1 little > which will mess it up.

I have a post on my blog that also tells how to wrap text to the side. It might help in the future.
HTML Hot Linking Picture Code

Now, if this doesn't work give me a yell. I am also on skype - you can see my skype under my profile picture if you are logged in.

Sheryl
User avatar
Sheryl Loch
 
Posts: 569
Joined: Tue Oct 14, 2008 10:57 pm

Re: How do you put a code retrieval box below an image

Postby onnaholl » Fri Mar 27, 2009 9:32 am

Thank you SOOO MUCCHHH!! It worked!! That is so terrific!! I am really excited!! Thank you everybody for helping me get my button up!! So excited!! THAT WAS DEFINITELY GREAT TEAM WORK!!

Onna
Image
Have Children? Need Activities, craft or advice? Come Over To Toddler Craft

Want to make extra money online for free? Making Money Quick Blog
User avatar
onnaholl
 
Posts: 199
Joined: Tue Mar 10, 2009 6:00 am
Location: RI

Re: How do you put a code retrieval box below an image

Postby Brad West » Fri Mar 27, 2009 2:08 pm

Ok now that you are all happy and stuff, I remember now needing an html box for something along time ago.
I believe i used a code very similar to this.

Code: Select all
<center><a href="http://toddlercraft.net" target="_blank"><img src="http://toddlercraft.net/wp-admin/images/toddlercraft_button.gif" alt="Toddler Crafts" title="Tell Your Story" width="" height=""/></a></center><br>
<center><form><textarea name="yourForm" rows=8 cols=15 wrap=virtual>
<center><a href="http://toddlercraft.net" target="_blank"><img src="http://toddlercraft.net/wp-admin/images/toddlercraft_button.gif" alt="Toddler Crafts" title="Tell Your Story" width="" height=""/></a></center>
</textarea><br><input type=button value="Highlight All" onClick="javascript:this.form.yourForm.focus();this.form.yourForm.select();">
</form></center>


If you noticed Onna I have loaded your stuff into the code already so all you have to do is copy and past. For anyone else, just change the site, image and alt text info and you are good to go.

On this line you can change the "Highlight All" text on the highlight button
Code: Select all
</textarea><br><input type=button value="Highlight All" onClick="javascript:this.form.yourForm.focus();


On this line you can change the size of the text box
Code: Select all
<form><textarea name="yourForm" rows=8 cols=15 wrap=virtual>


This is what this will look like on your site.
highlight box.gif


Brad West ~ onomoney
You do not have the required permissions to view the files attached to this post.
User avatar
Brad West
Site Admin
 
Posts: 428
Joined: Fri Oct 10, 2008 11:47 pm
Location: Las Vegas NV.

Re: How do you put a code retrieval box below an image

Postby onnaholl » Fri Mar 27, 2009 5:59 pm

Wow! That is great!! Thanks- I really appreciate all your help!!
Image
Have Children? Need Activities, craft or advice? Come Over To Toddler Craft

Want to make extra money online for free? Making Money Quick Blog
User avatar
onnaholl
 
Posts: 199
Joined: Tue Mar 10, 2009 6:00 am
Location: RI

Re: How do you put a code retrieval box below an image

Postby Sheryl Loch » Thu Apr 16, 2009 2:55 am

I placed examples of the 3 types of resource boxes on my blog.
Thought it may be easier for people to see what they want.

Examples Of Resource Boxes

Brians and Brads look allot alike except for Brads has a button you click to highlight where Brians is 1 click in the actual code box.

Remember you will need to place your links in the proper area.
Don't forget to place your related Keywords in the ALT area of the code. They have been saying that 1 out of 5 searches now are for images. You want to make sure you get the traffic for your image!

If you would like to find out which images Google has Indexed from your site see our thread What Images on Your Site are Indexed by Google.

Sheryl
User avatar
Sheryl Loch
 
Posts: 569
Joined: Tue Oct 14, 2008 10:57 pm

Next

Return to Marketing Topics

Who is online

Users browsing this forum: No registered users and 1 guest

cron