Quick Code Editor   for MySpace, Blogs or your Website               

1) Copy and paste code (in red and blue) into the left panel   2) Play with the code in blue   3) Click "Generate Preview" 

You can edit small snippets of code or a whole web page and make sure it works here!   Right click on a webpage and click "view source" copy and paste code in left panel



  (1) Click / hold and drag left mouse over code to highlight code.     (2) Right click "copy"  (or just "click to copy the code")     (3) Right click in left panel and "paste"     (4) Click "Generate Preview"  


 

 LINKS

 link <A HREF="http://www.blueletterbible.org/kjv/Jhn/Jhn003.html#16"> my link</A> 

when it turns blue it's been copied, right click and paste to the left panel

 

link to an item on the same page note the # sign <A HREF="#where ever">my link</A>     place this on the same page where you want to link to <A NAME="where ever"></A>

 

link to an item on a different page note the # sign <A HREF="http://www.blueletterbible.org/kjv/Jhn/Jhn003.html#16">my link</A>     place this on the page where you want to link to <A NAME="16"></A>

 


FONTS       Common Font Size  1 thru 7   Common Font Chart   Common Font Color Chart insert 6 digit color code: example blue 0000FF

 font string with a link <A HREF="http://www.blueletterbible.org/kjv/Jhn/Jhn003.html#16"><FONT FACE="ARIAL" SIZE="1" COLOR="blue">my text</FONT></A>

when it turns blue it's been copied, right click and paste to the left panel

font open tag <FONT>     font close tag </FONT>     font type <FONT FACE="ARIAL">text type</FONT>     font size <FONT SIZE="1">text size</FONT>     font color <FONT COLOR="blue">text color</FONT>

 

font string <FONT FACE="ARIAL" SIZE="1" COLOR="blue">text</FONT>

 

bold <B>     bold close </B>     italicized <I>     italicized close </I> 

 


IMAGES

 image string with a link <A HREF="http://www.blueletterbible.org/kjv/Jhn/Jhn003.html#16"><IMG SRC="http://www.thesoulshop.co.uk/images/jesus_inside.jpg" WIDTH="80" HEIGHT="100" ALT="T SHIRT"></A>

when it turns blue it's been copied, right click and paste to the left panel

image <IMG SRC="http://www.thesoulshop.co.uk/images/jesus_inside.jpg">

 

image with a link <A HREF="http://www.blueletterbible.org/kjv/Jhn/Jhn003.html#16"><IMG SRC="http://www.thesoulshop.co.uk/images/jesus_inside.jpg"></A>

 

image attributes in pixels width="80" height="100"

 

image attributes in percentage WIDTH="80%" HEIGHT="100%"

 

image alternate description mouse over description ALT="T SHIRT"

 


 SOUNDS  

 play automatically and be invisible (with an example mp3)

 <EMBED SRC="http://www.podbean.com/podcast-blog-embeddable-flash-player-mp3/NDA1MjcvVmlzdGFFeGNsYW1hdGlvbi5tcDM/VistaExclamation.mp3" WIDTH=1 HEIGHT=1 AUTOSTART=TRUE HIDDEN=TRUE>

 

 play automatically with visible large controls <EMBED SRC="yoursound.mid" width="145" height="62" autostart="true">
 play automatically with visible small large controls <EMBED SRC="yoursound.mid" height="15" width="140" controls="smallconsole" autostart="true">

  Where it say's autostart you can, put autostart="false" so it won't autostart.

 


 MOUSE OVER SOUNDS

mouse over text and hear a sound

 <a href="#" onMouseOver="document.all.music.src='http://www.podbean.com/podcast-blog-embeddable-flash-player-mp3/NDA1MjcvVmlzdGFFeGNsYW1hdGlvbi5tcDM/VistaExclamation.mp3'">Vista Exclamation Sound-mouse over</a>
 <bgsound src="#" id=music loop=
1 autostart="true">


BUTTONS

 button with a link <FORM METHOD="LINK" ACTION="http://www.blueletterbible.org/kjv/Jhn/Jhn003.html#16"><INPUT TYPE="submit" VALUE="Bible"></FORM>

when it turns blue it's been copied, right click and paste to the left panel


 PAGE LAYOUT 

 

 horizontal line <HR>     line break <BR>     paragraph break <P>     space without a line break &NBSP;

 

 center <CENTER>     close center </CENTER>

 

 alignment left, center or right <DIV ALIGN="right">some stuff here</DIV>

 


 BACKGROUND        Common Background Color Chart insert 6 digit color code: example blue 0000FF

 

 text background color example Quick Code Editor <FONT FACE="ARIAL" SIZE="3" COLOR="blue"><SPAN STYLE="BACKGROUND-COLOR: #FFFF00">Quick Code Editor</SPAN></FONT> 

 


 

Here is some Java Script used on this page - Name: click to copy the code button in 2 steps

 

 Step #1 Code goes between the <head>X</head> tags.

 Insert the head code 1 time.<!-- Begin 
function copyit(theField) {
var tempval=eval("document."+theField)
tempval.focus()
tempval.select()
therange=tempval.createTextRange()
therange.execCommand("Copy")
}
// End -->
</script>

 

 

 Step #2 Code goes between the <body>X</body> tags. 

 Insert the code for each copy button, just change the form name in blue and the text in blue is what you want copied.

<form name="IT">
<div align="center">
<input onclick="copyit(
'IT.select1')" type="button" value="Press to Copy the Text" name="cpy">
<textarea name="select1" rows="1" cols="78">
If this is highlighted, then it has been copied.
</textarea>
</div>
</form>

 

 

 A message from FATTY MATTY <mouse over  I started this for my own quick reference so I could just copy and paste some code and see if it worked ok as an alternative to opening up a large cumbersome editor before I put it on my website. It is still being improved often and I hope you find it useful too. Please put this code on your page so you and others can find it. Thank you very much.

when the code turns blue it has been copied

  

It will look like this on your page  Quick Code Editor

or just copy and paste this:

<A HREF="http://bhfwbhtmleditor.blogspot.com/"><FONT FACE="ARIAL" SIZE="3" COLOR="blue"><SPAN STYLE="BACKGROUND-COLOR: #FFFF00"><i><b>Quick Code Editor</b></i></SPAN></font></FONT></A>