.

SE HTML
PRACTICE html
Practice html found on this page, or any other, using an off-site practice board.

However, as SE often adds personalized variables to code, notably unexpected <br>s which can break strings, a final check could be sending yourself a private message by replacing my 27543 account number with your own here.

For further convenience, paste the following code into your profile, again replacing my 27543 with your own account number, so you always have a direct link handy:

Send <a href="http://sensibleerection.com/messages.php?action=new&receiver_id=27543">me</a> a private message.

IMAGES in comments
<img src="http://www.tnathanroane.com/beakeroil.jpg">

~ Whatever is inside the quotes is the image presented. Be sure to close quotes.
~ Host your own images instead of hotlinking from someone else's, as you'd then be using their bandwidth without permission, and hotlinked images often show up broken on SE. For image hosting, I prefer a Photobucket account, though Imageshack allows quick public hosting without any account at all. Both upload from saved file as well as from another URL. If you do hotlink an image hosted from a stranger's website, it's courteous to also link to their site as advertisement.
~ Use JPG, GIF, and PNG files. Gifs are mostly for text and animation.
~ Keep images to a reasonable size as large files drag slower modems and usually fill the screen. I aim for under 400KB (1MB for animation), or 480h x 680w pixels

examples:
<img src="http://img249.imageshack.us/img249/2537/sensibleerection1qb7.gif">
Sensible Erection


<img src="http://i256.photobucket.com/albums/hh164/composernate/tnr/natestache.gif">
animated gif example

LINKING in comments
<a href="http://www.tnathanroane.com">http://www.tnathanroane.com</a>

~ Always add http:// within the "quotes" inside the <chevrons>.
~ Whatever is inside the quotes is where the reader is sent, so be absolutely sure to close quotes.
~ Everything inside the carrots is hidden from the reader as html code.
~ Nothing outside the carrots affects code, so write whatever you want there.

examples:
<a href="http://sensibleerection.com/">Sensible Erection</a>
Sensible Erection

I read <a href="http://onegoodmove.org/1gm/">blogs</a> daily.
I read blogs daily.

AUDIO Embedding
Embedding audio to SE is probably best using flash-based MP3 Reader, where one would only need to use this code, replacing XXXXX with the mp3's online URL address:
<embed allowscriptaccess="never" flashvars="mediaURL=XXXXX&mediaWidth=500&" height="17" quality="high" src="http://www.fileden.com/files/2008/1/13/1697003/MusicPlayer.swf" type="application/x-shockwave-flash" width="502" wmode="transparent"></embed>
example:
<embed allowscriptaccess="never" flashvars="mediaURL=http://www.fileden.com/files/2008/1/13/1697003/T.%20Nathan%20Roane%20-%20Cowboys%20are%20Secretly%20Frequently%20Fond%20of%20Each%20Other%20%28Willie%20Nelson%29.mp3&mediaWidth=500&" height="17" quality="high" src="http://www.fileden.com/files/2008/1/13/1697003/MusicPlayer.swf" type="application/x-shockwave-flash" width="502" wmode="transparent"></embed>


Another option would be to simple link directly to the file, allowing people to do with it as they wish.

DROP-DOWN Spoiler Menus
When you wish to give the option of viewing your comment, whether it is an extra large image, auto-play media, movie/game spoiler, wall-of-text or whatever, it can be placed in a hidden box with opening button using one of these two codes, replacing XXXXX with whatever optionally shown html or text:
<div class="smallfont" style="margin-bottom: 1px;"><input value="Show" style="margin: 0px; padding: 0px; width: 45px; font-size: 10px;" onclick="if (this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display != '') { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = ''; this.innerText = ''; this.value = 'Hide'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'Show'; }" type="button"></div><div class="alt2" style="border: 1px inset; margin: 0px; padding: 5px;"><div style="display: none;">XXXXX</div></div>
XXXXX

<div style="margin:1px"><div class="quotetitle"><input type="button" value="Show" style="width:55px;font-size:10px;margin:0px;padding:0px;" onclick="if (this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display != '') { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = ''; this.innerText = ''; this.value = 'Hide'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'Show'; }" /></div> <div class="quotecontent"><div style="display: none;"><span style="font-size: 83%;">ZZZZZ</span></div></div></div>
ZZZZZ

FIX a broken comment
example:
<a href="http://sensibleerection.com/">Sensible Erection</a>
When an SE user forgets to close quotes (the blinking quotation above, for example) within a comment, it screws up the entire post. To fix, open your Internet Explorer browser, login to SE, and find the comment with the broken link. Save the broken reply page as 'html only' to your desktop. Open that saved file in wordpad or notepad or similar editor, then find the missing code and finally add it within the editor. Next, directly after the <head> tag at the top, add:
 <base href="http://sensibleerection.com/comment.php/55960/765660">
...but replacing this http:// address with that of the broken comment.  Save the fixed file.

Open this fixed file on your desktop within your standard browser.  In the now usable comment box, add ">">">">">"> and then whatever witty banter.  Submit.  This should fix open tags/quotes for most browsers.

Thanks to eIfish for this tip.
MODDING Alternatives
For adding the full range of mods available for SE comments, those normally kept solely for posts, first install Greasemonkey for Firefox. Then install secommentmodder.user.js and enjoy.

THEMES to Bulk Tweak SE's Layout, Add Features
SE_Butler is Naruki's "multipurpose script intended for Opera browsers (but also works with Firefox+GM). It works on SE post pages, making mod/reply stuff a lot easier, and allowing you to focus on new comments if you like."

Sensiblefacial from Rojo^ is a Firefox alternative which also adds features such as nesting comment trees, adding color, and mod flexibility.

FILTER Member Comments
To filter out select SE members who rather subtract from your SE experience, first install Greasemonkey for Firefox. Then install secommentfilter.user.js and edit the default examples list.

HIGHLIGHT Member Profiles
To [*] highlight specific SE member names in comments, perhaps yourself and whoever especially adds to your SE experience, first install Greasemonkey for Firefox. Then install secockbitertagger.user.js and edit the default examples list.

EXTENDED embeds and hotlinks
Adding html to the extended of posts can be tricky, as urls are automatically made links by SE specifically to aid in massive porn dumps. To trick for embedding images and videos in the post extended, use normal html such as described elsewhere on this page (or provided by the host: youtube, photobucket, dailymotion, etc) and remove all http:'s from each address.

example:
<div><object width="480" height="381"><param name="movie" value="//www.dailymotion.com/swf/k3SddTNuz4BLyiNzAd&related=1"></param><param name="allowFullScreen" value="true"></param><param name="allowScriptAccess" value="always"></param><embed src="//www.dailymotion.com/swf/k3SddTNuz4BLyiNzAd&related=1" type="application/x-shockwave-flash" width="480" height="381" allowFullScreen="true" allowScriptAccess="always"></embed></object><br /><b><a href="//www.dailymotion.com/video/x718eh_t-nathan-roane-lets-go-out-dancing_music">T. Nathan Roane - Let's Go out Dancing</a></b><br /><i>Hochgeladen von <a href="//www.dailymotion.com/composernate">composernate</a></i></div>


Thanks to baulsaak for this tip.




Any questions? Suggestions?
ComposerNate


 
http://tnathanroane.com/