This XHTML header tags resource is a work in progress, perpetually expanding and evolving as new information is obtained, explored, and integrated. Hopefully, you will find it useful in some way. Even better, perhaps you will share any complimentary or critical information concerning the contents of this article.

Table of Contents

• Important Information
• XML Declaration
• The !DOCTYPE
• The html tag
• The head tag
• The title tag
• base & item
• http-equiv
• link tags
• meta tags
• Geo meta tags
• Dublin Core tags
• References

Continue Reading

If you think that nobody uses frames anymore, think again. I personally know of one person who threw down some tuf HTML frame action for a personal site. So, in the interest of prosperity, we are hereby establishing this post as our official dumping ground for all HTML frame-related garbage.

Break your pages out of someone else’s frames

We begin our journey with a totally sick JavaScript method for breaking pages out of the illegitimate frames of some ineffectually pathetic bastard:

<script type="text/javascript">
<!--//--><![CDATA[//><!--

   if (window.self ! = window.top) window.top.location = window.self.location;

//--><!]]>
</script>

Likewise, here is an equally effective method that should work in all JS-enabled browsers:

<script type="text/javascript">
<!--//--><![CDATA[//><!--

if (window.frames) {
   if (parent != self) {
   location.href="index.html"
   }
}

//--><!]]>
</script>

Alternatively, this method also works well in all non-NN browsers:

<script type="text/javascript">
<!--//--><![CDATA[//><!--

if (parent.frames.length > 0) {
   parent.location.href = location.href;
}

//--><!]]>
</script>

Here is a similar version of the previous method:

<script type="text/javascript">
<!--//--><![CDATA[//><!--

if (parent.frames.length > 0) top.location.replace(document.location);

//--><!]]>
</script>

Here is yet another slightly similar version:

<script type="text/javascript">
<!--//--><![CDATA[//><!--

if (top.frames.length > 0) {
   top.location = self.location;
}

//--><!]]>
</script>

Yet another fine method for breaking out of frames:

<script type="text/javascript">
<!--//--><![CDATA[//><!--

if ( top.location != document.location.href ) { 
   top.location = document.location.href; 
}

//--><!]]>
</script>

Here is the script we use for Monzilla Media (monzilla.biz):

<script type="text/javascript">
<!--//--><![CDATA[//><!--

if ( self.location.href != top.location.href ) {
   top.location.href = self.location.href;
}

//--><!]]>
</script>

This method stops recursively framed pages:

<script type="text/javascript">
<!--//--><![CDATA[//><!--

if ( window != top ) 
   top.location.href = window.location.href;

//--><!]]>
</script>

This method works great at breaking out and redirecting the browser to the original page:

<script type="text/javascript">
<!--//--><![CDATA[//><!--

var parent_location = new String(parent.location);
   if ( ( top.location != location ) && parent_location.indexOf('http://domain.tld/path/to/page.html') != 0 )
   top.location.href = document.location.href;

//--><!]]>
</script>

Optimize the content of an iframe

Moving right along, here is a helpful method for optimizing the content of an iframe. This code basically displays a link to the content that should be displayed if everything is working correctly. If for some reason the content is not displayed, the link will appear in its place, thereby enabling users to access the missing content via a new window:

<iframe src="page.html" width="333" height="333" scrolling="auto" frameborder="1">
   <a href="page.html" target="_blank">
      [Your browser does not support frames or is configured not to display frames. Click here to visit the related document.]
   </a>
</iframe>

Control frameborder and scroll attributes for iframes via CSS

To control the frameborder=”value” and scroll=”yes/no” attributes for iframes using CSS, add the following styles to the document which is being displayed in the iframe:

<style type="text/css">
html, body {
   overflow: hidden;
   border: none;
}
</style>

This method works on all IE 4+ with the following exceptions:

IE 4

• Ignores overflow on html and body elements (i.e., no scrollbar elimination in IE 4)
• Border property must be applied to the body element

IE 5 and IE 5.5

• Overflow property must be applied to the body element
• Border property may be applied to either the html or the body element

IE 6 / Quirks Mode (Transitional DTD)

• Overflow property must be applied to the body element
• Border property may be applied to either the html or the body element

IE 6 / Standards Mode (Transitional DTD)

• Overflow property must be applied to the html element
• Border property must be applied to the html element

Here is our online (i.e., public) repository of interesting, mysterious, and/or perhaps even useful CSS code:

Perishable Press CSS Code Repository [ 1319 downloads ]

Just a few useful accessibility notes..

Add accesskey attributes to important list items, content areas, and any other key areas of the document.

Use alphanumeric characters as accesskey values, as in this example:

<ul>
   <li><a id="home" accesskey="h" href="http://domain.com/home.html"><span class="accesskey">h</span>home</a></li>
   <li><a id="menu" accesskey="m" href="http://domain.com/menu.html"><span class="accesskey">m</span>menu</a></li>
   <li><a id="search" accesskey="s" href="http://domain.com/search.html"><span class="accesskey">s</span>search</a></li>
</ul>

When an accesskey attribute is present within a link tag, pressing alt+letter on the keyboard is equivalent to double-clicking that link. Generally speaking, the presence of an accesskey attribute within an element brings focus to that element. Thus, radio and check boxes are toggled, links are clicked, and form elements are navigated as the alt+letter combination is pressed.

It is also helpful to provide “skip-to” links that target specific areas of the site. For example, you may wish to enable users of screen readers to skip past or skip to navigational controls:

<div class="hide">
 <ul id="top" class="access">
  <li><a href="#content" title="Skip to Content" accesskey="c">Skip to Content</a></li>
  <li><a href="#navigation" title="Skip to Menu" accesskey="m">Skip to Menu</a></li>
  <li><a href="#search" title="Skip to Search" accesskey="s">Skip to Search</a></li>
 </ul>
</div>

However, due to current lack of widespread browser support, explicit id-targeting may serve better:

<a href="#menu" title="Skip to navigation menu">Skip to navigation menu</a>
<a href="#content" title="Skip to main content">Skip to main content</a>

Another useful accessibility tool involving document meta-navigation is the tabindex, which is a numerical index that represents each element’s position in the tabbing order. By default, certain elements are ignored by the tabindex, while others retain a default order which may be overridden with explicitly stated tabindex values. Consider the following example, in which the tabbing order will be "red", "yellow", "blue", regardless of where the input elements appear on the page:

<form>
 <input id="red" tabindex="1" />
 <input id="yellow" tabindex="2" />
 <input id="blue" tabindex="3" />
</form>

More to come..

Let’s face it, spam sucks. Give spammers the figurative finger by using this nifty bit of JavaScript to hide your email address from the harvesters. Here is an easy “copy-&-paste” snippet for including a spam-proof email address in your web pages. Although there are a million ways of doing this, I am posting this for the record (and because I just can’t stand deleting usable code). This technique uses JavaScript, and therefore is not 100% ideal for all users. My advice would be to include a <noscript> element that contains an image of your email address. That way, users without JavaScript will still have access to your (spam-proof) email address. Of course, image-based text presents issues for text-only browsers, but hey, you gotta start somewhere! ;)

Spamless Email

Secure the function by adding this block of code to the document head, or by placing it within an external JavaScript file:

<script type="text/javascript">
<!--//--><![CDATA[//><!--

function email(name, domain, extension) {
   if (!document.write) return false;
   if (document.write) {
      var name; var domain; var extension;
      document.write('<a href="' + 'mailto:' + name + '@' + domain + '.' + extension + '">' + name + '@' + domain + '.' + extension + '<\/a>');
   }
}

//--><!]]>
</script>

Then, add this to the document body, replacing the three variables with real values:

<script type="text/javascript">
<!--//--><![CDATA[//><!--

email("name", "domain", "extension");

//--><!]]>
</script>

Finally, you may also add this line for those without JavaScript:

<noscript><p>(enable javascript or view source to see the email link)</p></noscript>

Or, you may wish to create a text-image of your email address for display on non-JavaScript machines:

<noscript>
   <img src="images/email.gif" alt="Email Address" class="noscript" style="border: 0px;" />
</noscript>

Specific Example

Here is an example of how the function may be configured on an actual web page. This is the specific code that we use at Monzilla Media to hide email addresses from the spamholes:

<script type="text/javascript">
<!--//--><![CDATA[//><!--

function email(m, o, n) {
   if (!document.write) return false;
   if (document.write) {
      var m; var o; var n;
      document.write('<p>Contact: <a href="' + 'mailto:' + m + '@' + o + '.' + n + '?subject=General%20Business" title="Contact">' + m + '@' + o + '.' + n + '<\/a><\/p>');
   }
}

//--><!]]>
</script>

<script type="text/javascript">
<!--//--><![CDATA[//><!--

email("m0n", "monzilla", "biz");

//--><!]]>
</script>

<noscript><p>(enable javascript or view source to see the email link)</p></noscript>

Check out these crazy CSS underline effects:

u.double { /* -- double underline -- */
	border-bottom: 1px solid;
}
.altdouble { /* alternate double */
	border-bottom: 3px double;
	line-height: 1.7em;
}
u.triple { /* -- triple threat -- */
	border-bottom: 3px double;
	line-height: 1.9em;
}

Double Underline Effects! (via u.double class)

Alternate Double Underline! (via .altdouble class)

Triple Underline Effects! (via u.triple class)

Note: if these examples do not display correctly with the current theme, click here to see them in action!

Consider this page a virtual dumpster of wonderful CSS hacks..

Commented Backslash Hack V2

This hack effectively hides anything after the “\*/” from MacIE5:

/* commented backslash hack v2 \*/
div#something {
   boder: thin solid red;
}
/* end hack */

May also be used for CSS import directives:

<style type="text/css">
/* commented backslash hack v2 \*/
   @import url(http://www.site.com/stylesheet.css);
/* end hack */
</style>

Fix Division Widths in IE

Fix IE’s crazy box rendering. The first line limits to only IE. The second line

* html div#somediv { /* limits to all IE */
   width: 300px; /* width for WinIE5.x */
   w\idth: 333px; /* width for other IE */
}
div#somediv {
	padding: 33px;
	width: 377; /* width for all other browsers */
}

IE Double Float Bug

IE doubles the margin of any divs floated in the same direction. Great. To fix it, simply display the floated element as inline.

Clearing Divisions

Here are four relatively equally effective methods for clearing unruly divisions:

<div style="clear: both;">&nbsp;</div>

<br style="clear:both;" />

<hr style="clear:both;" />

div#unrulydiv {
   overflow: auto;
   height: 100%;
}

Clearing Floats

div.fix:after {
   content: ".";
   visibility: hidden;
   display: block;
   clear: both;
   height: 0; 
}
div.fix { display: inline-table; }
/* Hides from IE-mac \*/
* html div.fix { height: 1%; }
div.fix { display: block; }
/* End hide from IE-mac */

Or, you could float the parent div, and perhaps any other parents of the parent div — i.e., the float nearly everything method.

Box Model Hacks

IE versions below 6 render element width values to include borders and padding. This hack utilizes comment hacks to hide from all IE5.x:

div#somediv {
width: 33px; /* width for all browsers */
width/**/:/**/ 77px; /* first hide from IE5.0 then hide from IE5.5 */
}

Target Safari/Webkit/KHTML

body:last-child:not(:root:root) div {
	rules: target Safari/Webkit/KHTML only;
}

Target Firefox

This hack targets the body element in Firefox 1.5 & 2.0 only, but is not valid CSS2/CSS3:

/* targets body element in Firefox 1.5 & 2.0 only - invalid CSS2 & valid CSS3 */
body:empty {}

Target/Filter only Internet Explorer 7

Here are several hacks that target IE7, some valid CSS, some not (see code comments for details):

/* targets body element in IE7 only - invalid CSS */
>body {}

/* targets IE7 only - valid CSS */
*:first-child+html {}

/* targets IE7 & modern browsers only - valid CSS */
html>body {}

/* filters IE7, targets other modern browsers - valid CSS */
html>/**/body {}

Target/Filter only Internet Explorer (IE7 and below)

Here is our growing collection of hacks targeting all Internet Explorer, including IE7 and below:

/* targets all descendants of the html element in IE7 & below - invalid CSS */
html* {}

/* applies property in IE7 & below - invalid CSS */
selector { attribute: property !ie; }
/* applies property with importance in IE7 & below - invalid CSS */
selector { attribute: property !important!; }

/* targets IE7 & below - valid CSS */
a:link:visited, a:visited:link {}
/* may be used to target any element */
#target:link:visited, #target:visited:link {}

/* targets IE7 & below - valid CSS */
*:first-child+html {} * html {}

/* applies property in IE7 & below - invalid CSS (this hack is not recommended) */
*property: value;

/* imports stylesheet in all major browsers except IE7 & below */
@import "non-ie-styles.css" all;

Target only Internet Explorer 6 and below

/* applies property in IE6 & below - invalid CSS */
_property: value;
/* applies property in IE6 & below - invalid CSS */
-property: value;

/* targets IE6 & below - valid CSS */
* html {}

selector { 
	attribute: property !important; /* targets all major browsers */
	attribute: property; /* targets IE6 & below - this value overrides previous value */
} 

Filter Opera / Target Opera

This hack filters Opera (9 and below) and targets all modern browsers including IE7:

/* selects body element with class page-body in IE7 & all modern browsers except Opera 9 & below */
body[class|="page-body"] {}

Conversely, this hack targets Opera 9 and below:

/* targets Opera 9 & below - valid CSS */
html:first-child {}

Fun with the input (disabled) element

Employing the disabled attribute of the input element, it is possible to target a wide range of specific browser types. Given this (X)HTML markup:

<input type="hidden" disabled id="dis" />
<p>target element</p>

..it is possible to target and filter our CSS by using any of these hacks:

/* filters IE7 & below - see below for more info */
input[disabled="disabled"] {} 

/* Firefox 1.5 & below, Safari 2.0 & below, Konqueror 3.5 & below (and perhaps future versions of these browsers) - valid HTML & invalid XHTML */
#dis[disabled=""]+p {}

* targets Opera 9 & below (and perhaps future versions) - valid HTML & invalid XHTML */
#dis[disabled="true"]+p {}

More to come!

Here are a few sIFR Notes for Perishable Press. Just what are we looking at here? Well, first it is important to understand the sIFR variables and the order in which they should appear:

(sSelector, sFlashSrc, sColor, sLinkColor, sHoverColor, sBgColor, nPaddingTop, nPaddingRight, nPaddingBottom, nPaddingLeft, sFlashVars, sCase, sWmode)

The variable, sFlashVars consists of the following sub-variables (these should be seperated with an & sign:

# Align Flash text block
textalign=center
# Moves text any number of pixels to the right
offsetLeft=3
# Moves text any number of pixels down
offsetTop=3
# Adds underline links when hovered
underline=true

Then, inducing from the following code example, we should place a similar set of statements at the bottom of any pages requiring sIFR functionality:

<script type="text/javascript">
<!--//--><![CDATA[//><!--

if(typeof sIFR == "function") {
   sIFR.replaceElement("h1", "http://domain.com/path/to/fonts/font1.swf", "#E1E1E1", "#FFFF99", "#CC6633", "#333333", 0, 0, 0, 0, null, null, "opaque");

   sIFR.replaceElement("h2", "http://domain.com/path/to/fonts/font2.swf", "#CC6633", "#FFFF99", "#CC6633", "#333333", 0, 0, 0, 0, null, null, "opaque");

   sIFR.replaceElement("h3", "http://domain.com/path/to/fonts/font3.swf", "#E1E1E1", "#FFFF99", "#CC6633", "#333333", 0, 0, 0, 0, null, null, "opaque");
}

//--><!]]>
</script>

Arguments may also be stated by name rather than sequentially:

<script type="text/javascript">
<!--//--><![CDATA[//><!--

if(typeof sIFR == "function") {
   sIFR.replaceElement("h1", named({sFlashSrc: "../path/to/font.swf", sColor: "#777", sCase: "upper"}));
};

//--><!]]>
</script>

Here is another example using the named arguments method:

<script type="text/javascript">
<!--//--><![CDATA[//><!--

if(typeof sIFR == "function") {
   sIFR.replaceElement(named({nWidth:333,nHeight:33,sSelector:"h3.class-h3", sFlashSrc:"http://domain.com/fonts/font.swf", sColor:"#333", sLinkColor:"#777", sBgColor:"#FFF", sHoverColor:"#DDD", sWmode: "transparent", nPaddingTop:0, nPaddingBottom:0}));

//--><!]]>
</script>

Finally, here is the default CSS supplied with sIFR:

/* sIFR Print CSS | Hide Flash headlines from the browser */

.sIFR-flash, .sIFR-flash object, .sIFR-flash embed {
	display: none !important;
	position: absolute;
	overflow: hidden;
	height: 0px;
	width: 0px;
}
span.sIFR-alternate {
	visibility: visible !important;
	position: static !important;
	display: block !important;
	left: auto !important;
	top: auto !important;
}

/* sIFR Screen CSS | These are standard sIFR styles -- do not modify */

.sIFR-flash { 
	visibility: visible !important; 
	margin: 0px; 
}
.sIFR-replaced { 
	visibility: visible !important;
}
span.sIFR-alternate { 
	top: 0px;
	left: 0px; 
	width: 0px; 
	height: 0px; 
	display: block; 
	overflow: hidden;
	position: absolute;
}

/* Decoy styles used to hide the browser text before it is replaced */

.sIFR-hasFlash h1 { 
	letter-spacing: -2px;
	visibility: visible;
	font-size: 32px;
	height: 40px;
}
.sIFR-hasFlash h3 { 
	visibility: visible;
	font-size: 18px;
}

References

• sIFR Documentation at novemberborn

Update: After upgrading Perishable Press in 2007, many of the hacks listed on this page are no longer applicable. Please refer to our new WordPress Core Edits for current information. Otherwise, this article remains online for reference purposes only.

The folks developing WordPress are continually rolling out “upgrades”. While it is generally a good idea to stay current, it can also be a bit of a pain if you have made any changes to the WordPress core files. Our recommendation? Keep a log such as this one that either includes all edits or links to posts describing them. That way, when it is time to upgrade to WP 3.0.1, WP 3.0.2, … WP 9.0.1, WP 9.0.2 … (you get the idea), it will simply be a matter of referring to your handy WP core file change log and then going thru the list, copying & pasting your way back to complete functionality. Just remember to add any subsequent changes to the list, though, or you may find yourself scratching your head after the next upgrade. Another good idea involves carefully comparing any code you are replacing, checking to make sure the wizards at WordPress haven’t changed any aspects of the original code (of which you are replacing).

So, without further ado, here are the WordPress core file edits currently operating here at Perishable Press:

Customize the_excerpt function

File: wp-includes/functions-formatting.php (~ lines #763 & 767): set to desired values:

$excerpt_length = 50;
...
array_pop($words);
array_push($words, '[...] ( click post title to read more )');
$text = implode(' ', $words);

Customize the wpautop function

File: wp-includes/functions-formatting.php (~ line #72, #83):

$pee = preg_replace('/\n?(.+?)(?:\n\s*\n|\z)/s', "<p>$1</p>\n\t\t\t\t\t\t", $pee); // make paragraphs, including one at the end

$pee = str_replace("<p><!--", "<!--", $pee);
$pee = str_replace("--></p>", "-->", $pee);
return $pee;

Customize the more quicktag

File: wp-includes/template-functions-post.php (~ lines #54, 62, 92):

function the_content($more_link_text = 'Continued >>', $stripteaser = 0, $more_file = '') {
   $content = get_the_content($more_link_text, $stripteaser, $more_file);
   $content = apply_filters('the_content', $content);
   $content = str_replace(']]>', ']]>', $content);
   echo $content;
}
...
function get_the_content($more_link_text = 'Continued >>', $stripteaser = 0, $more_file = '') {
   global $id, $post, $more, $single, $withcomments, $page, $pages, $multipage, $numpages;
   global $preview;
   global $pagenow;
   $output = '';
...
...
else
   //$output .= ' <a href="'. get_permalink() . "#more-$id\">$more_link_text</a>";
   $output .= ' <a href="'. get_permalink() . "\">$more_link_text</a>";
}

Customize Default Password Text

File: wp-includes/comment-functions.php (~ line #296):

Password Required

WordPress RDF Source Makeover

File: wp-includes/comment-functions.php (~ line #513):

function trackback_rdf($timezone = 0) {
	global $id;
	if (!stristr($_SERVER['HTTP_USER_AGENT'], 'W3C_Validator')) {
	echo '<rdf:RDF ';
	echo "\n";
	echo '   xmlns:dc="http://purl.org/dc/elements/1.1/" ';
	echo "\n";
	echo '   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" ';
	echo "\n";
	echo '   xmlns:trackback="http://madskills.com/public/xml/rss/module/trackback/">';
	echo "\n";
	echo '<rdf:Description ';
	echo "\n";
	echo '   dc:creator="';
	the_author();
	echo '" '."\n";
	echo '   dc:date="';
	the_date_xml();
	echo ' @ ';
	the_time('g:i a');
	echo '" '."\n";
	echo '   dc:title="'.str_replace('--', '&#x2d;&#x2d;', wptexturize(strip_tags(get_the_title()))).'" '."\n";
	echo '   rdf:about="';
	the_permalink();
	echo '" '."\n";
	echo '   dc:identifier="';
	the_permalink();
	echo '" '."\n";
	echo '   trackback:ping="'.trackback_url(0);
	echo '" '."\n";
	echo '   dc:description="';
	the_excerpt_rss();
	echo '" />'."\n";
	echo '</rdf:RDF>';
	}
}

And then replace the_excerpt_rss(); with:

the_content_rss('', TRUE, '', 7, 2);

Title Attributes for WordPress Post Navigation

File: wp-includes/template-functions-links.php (~ lines #348, 369, 459, 494, 503):

$string = '<a href="'.get_permalink($post->ID).'" title="Go to previous post">'.$previous;
...
$string = '<a href="'.get_permalink($post->ID).'" title="Go to next post">'.$next;
...
...
function next_posts_link($label='Next Page &raquo;', $max_page=0) {
...
echo '" title="Go backward in time">'. preg_replace('/&([^#])(?![a-z]{1,8};)/', '&#038;$1', $label) .'</a>';
...
function previous_posts_link($label='&laquo; Previous Page') {
...
echo '" title="Go forward in time">'. preg_replace('/&([^#])(?![a-z]{1,8};)/', '&#038;$1', $label) .'</a>';
...
function posts_nav_link($sep=' &#8212; ', $prelabel='&laquo; Previous Page', $nxtlabel='Next Page &raquo;') {

Vars Tweak for htaccess Edits

File: wp-includes/vars.php (~ #35):

// Server detection
//the next line is used to allow WP to write htaccess rules during permalink creation (comment out the $is_apache line first)
//$is_apache = 1;
$is_apache = ( strstr($_SERVER['SERVER_SOFTWARE'], 'Apache') || strstr($_SERVER['SERVER_SOFTWARE'], 'LiteSpeed') ) ? 1 : 0;

Customize Password-Protected Posts

File: template-functions-post.php (~ line #3):

function get_the_password_form() {
	$output = '<form action="' . get_settings('siteurl') . '/wp-pass.php" method="post">
	<p>' . __("This post is password protected. To view it please enter your password below:") . '</p>
	<p><small><label class="h">' . __("Password: ") . ' </label><input class="postpassword" name="post_password" type="password" size="11" /> <input class="passwordsubmit" type="submit" name="Submit" value="' . __("Submit &raquo;") . '" /></small></p>
	</form>
	<div class="clear vspace">&nbsp;</div>
	';
	return $output;
}

Reversing WordPress Post Navigation Order

File: template-functions-links.php (~ lines #503, 518):

Note: It looks like this change has been implemented (as of WP 2.0.5)..

function posts_nav_link($sep=' — ', $prelabel='« Previous Page', $nxtlabel='Next Page »') {
...
if ( $max_num_pages > 1 ) {
	previous_posts_link($prelabel);
	echo preg_replace('/&([^#])(?![a-z]{1,8};)/', '&$1', $sep);
	next_posts_link($nxtlabel, $max_page);
}

Customize Quicktag Buttons

File: wp-includes/js/quicktags.js (~ line #37):

Required edit: delete the empty spaces out of the "pre code" button.

// CUSTOM QUICKTAGS BEGIN HERE

edButtons[edButtons.length] = new edButton('ed_authent'
,'authenticate'
,'<!--authenticate-->'
,''
,''
);

edButtons[edButtons.length] = new edButton('ed_quotes'
,'quotes'
,'&ldquo;'
,'&rdquo;'
,''
);

edButtons[edButtons.length] = new edButton('ed_dash'
,'dash'
,'&#8212;'
,''
,''
);

edButtons[edButtons.length] = new edButton('ed_rsquo'
,'rsquo'
,'&rsquo;'
,''
,''
);
edButtons[edButtons.length] = new edButton('ed_lsquo'
,'lsquo'
,'&lsquo;'
,''
,''
);

edButtons[edButtons.length] = new edButton('ed_acronym'
,'acronym'
,'<acronym title="">'
,'</acronym>'
,''
);

edButtons[edButtons.length] = new edButton('ed_clearspace'
,'clearspace'
,'<div class="clear vspace">&nbsp;</div>'
,''
,''
);
edButtons[edButtons.length] = new edButton('ed_follow'
,'follow link'
,'<a href="" title="">'
,'</a>'
,''
);
edButtons[edButtons.length] = new edButton('ed_nofollow'
,'nofollow link'
,'<a href="http://" title="" rel="nofollow">'
,'</a>'
,''
);
edButtons[edButtons.length] = new edButton('ed_press-link'
,'press link'
,'<a href="http://perishablepress.com/" title="Perishable Press">'
,'</a>'
,''
);
edButtons[edButtons.length] = new edButton('ed_reflist'
,'ref list'
,'<h3 class="references"></h3>\n\t<ul class="refs">\n\t<li><sup>1</sup> <a href="http://" title=""></a></li>\n\t<li><sup>2</sup> <a href="http://" title=""></a></li>\n'
,'</ul>'
,''
);
edButtons[edButtons.length] = new edButton('ed_content-link'
,'content-link'
,'<a href="http://perishablepress.com/press/wp-content/online/" title="Perishable Press">'
,'</a>'
,''
);
edButtons[edButtons.length] = new edButton('ed_press-image'
,'press image'
,'<img src="http://perishablepress.com/press/wp-content/images/" title="" alt="" />'
,''
,''
);
edButtons[edButtons.length] = new edButton('ed_pre-code'
,'pre code'
,'< pre>< code>'
,'< /code>< /pre>'
,''
);
edButtons[edButtons.length] = new edButton('ed_sup'
,'sup'
,'<sup>'
,'</sup>'
,''
);
edButtons[edButtons.length] = new edButton('ed_quot'
,'quot'
,'&quot;'
,''
,''
);
edButtons[edButtons.length] = new edButton('ed_<'
,'<'
,'&lt;'
,''
,''
);
edButtons[edButtons.length] = new edButton('ed_>'
,'>'
,'&gt;'
,''
,''
);

// CUSTOM QUICKTAGS END HERE

Remove the Admin Post-Preview Panel

File: wp-admin/post.php (line #83) & wp-admin/edit-form-advanced.php (line 17):

First, open wp-admin/post.php and delete these lines:

<div id='preview' class='wrap'>
<h2 id="preview-post"><?php _e('Post Preview (updated when post is saved)'); ?> <small class="quickjump"><a href="#write-post"><?php _e('edit &uarr;'); ?></a></small></h2>
<iframe src="<?php echo wp_specialchars(apply_filters('preview_post_link', add_query_arg('preview', 'true', get_permalink($post->ID)))); ?>" width="100%" height="600" ></iframe>
</div>

Then, open wp-admin/edit-form-advanced.php and delete these lines:

<?php if ( 0 != $post_ID ) : ?>
 <small class="quickjump"><a href="#preview-post"><?php _e('preview &darr;'); ?></a></small>
<?php endif; ?>

Enhance parse_url Functionality

File: wp-includes/functions.php (~ lines #1067): insert "@" before parse_url and praise the Lord!

Remove CSS Link to Print Stylesheet

File: press/wp-subscription-manager.php (~ line #100): delete the following line to eliminate unnecessary 404 errors when users subscribe/unsubscribe to comments (or when managing subscriptions):

<link rel="stylesheet" type="text/css" media="print" href="<?php echo get_settings('siteurl'); ?>/print.css" />

Customize Comment Feed Link

File: wp-includes/feed-functions.php (line #84): edit according to current default theme requirements:

echo "<a href='$url'>$link_text</a>";

--- changed to --->

echo "<a class=\"feed-icon\" href='$url' title=\"Subscribe to comments for this article\" rel=\"nofollow\">$link_text</a>";

Customize Commentator Links

File: wp-includes/comment-functions.php (~lines #358-368): swap the following:

/* original */
function get_comment_author_link() {
	global $comment;
	$url    = get_comment_author_url();
	$author = get_comment_author();

	if ( empty( $url ) || 'http://' == $url )
		$return = $author;
	else
		$return = "<a href='$url' rel='external nofollow'>$author</a>";
	return apply_filters('get_comment_author_link', $return);
}

// core file edit listed at perishablepress.com
// http://perishablepress.com/press/2006/08/15/wordpress-core-file-edits/
function get_comment_author_link() {
	global $comment;
	$url    = get_comment_author_url();
	$author = get_comment_author();

	if($comment->comment_type == 'pingback' || $comment->comment_type == 'trackback' ) { 
				if ( empty( $url ) || 'http://' == $url ) {
					$return = $author;
				} else {
					$return = '<a href="'.$url.'" rel="external">'.$author.'</a>';
				}
	} else {
				if ( empty( $url ) || 'http://' == $url ) {
					$return = $author;
				} elseif ( $author == 'blacklist' ) {
					$return = '<a href="'.$url.'" rel="external nofollow">'.$author.'</a>';
				} else {
					$return = '<a href="'.$url.'" rel="external">'.$author.'</a>';
				}
	}
	return apply_filters('get_comment_author_link', $return);
}

References

• Article #42: WordPress Notes Plus
• Article #49: RDF Source Code Makeover
• Article #90: Permalink Enlightenment
• Article #107: Title Attributes for WordPress Post Navigation
• Article #134: Customize Password-Protected Posts
• Article #147: Reversing WordPress Post Navigation Order
• Article #204: Customize WordPress Quicktags
• Article #244: WordPress on Crack
• Article #400: One-Minute Dofollow Upgrade

Code to call an external WordPress search form:

<?php include (TEMPLATEPATH . "/searchform.php"); ?>

Code for a standard, inline WordPress search form:

<form id="searchform" method="get" action="<?php echo $_SERVER['PHP_SELF']; ?>">
<p><input name="s" type="text" id="s" size="33" maxlength="99" />
<input type="submit" class="submit" value="Search &raquo;" /></p>
</form>

Code to search through multiple categories when using customized, individual category pages:

<form id="searchform" method="get" action="<?php echo $_SERVER['PHP_SELF']; ?>">
<p><input name="s" type="text" id="s" size="33" maxlength="99" />
<input type="hidden" name="cat" value="1,2,3,4,5,6" />
<input type="submit" class="submit" value="Search &raquo;" /></p>
</form>

Code to try if the search function fails and your blog is located in a directory other than root:

<form method="get" id="searchform" action="<?php bloginfo('siteurl'); ?>">

or:

<form method="get" id="searchform" action="http://yourblog.com/blog/index.php">

This particular search function uses the site URL (note the trailing slash) as the form action, and employs a .gif image as the input type:

<form method="get" id="searchform" action="<?php bloginfo('home'); ?>/">
<div><input type="text" value="Search" name="s" id="s" />
<input type="image" src="<?php bloginfo('stylesheet_directory'); ?>/images/search.gif" id="searchsubmit" value="Search" />
</div></form>

Just for fun, here is bit of php that should (have not checked it yet) output a value indicating the total number of search results:

<?php
$search_count = 0;

$search = new WP_Query("s=$s & showposts=-1");
if($search->have_posts()) : while($search->have_posts()) : $search->the_post();
$search_count++;
endwhile; endif;

echo $search_count;
?>

Another neat trick is to include a default message if some condition is met. For example, here we are telling WordPress to display the text string, "Search Perishable Press", unless someone is actually searching for something:

<?php if (!is_search()) { 
$search_text = "Search Perishable Press"; 
} else { 
$search_text = "$s"; 
} ?>
<form method="get" id="searchform" action="<?php echo $_SERVER['PHP_SELF']; ?>">
<input type="text" id="s" name="s" value="<?php echo wp_specialchars($search_text, 1); ?>" />
<input type="submit" id="searchsubmit" value="Search!" />
</form>

Here is a core hack to get WordPress to search pages in addition to posts for older (1.5) versions of WordPress (I think newer versions do this automatically). Open the file wp-includes/classes.php and look around line #493 for the following code:

if ($this->is_page) {
     $where .= ' AND (post_status = "static")';
} else {
     $where .= ' AND (post_status = "publish")';
}

Replace (comment out) that entire chunk of code and replace it with this:

if ($this->is_page) {
     $where .= ' AND (post_status = "static")';
} elseif ($this->is_search) {
     $where .= ' AND (post_status = "publish" OR post_status = "static")';
} else {
     $where .= ' AND (post_status = "publish")';
}

Happy searching! :)

If you are running WordPress 2.0.2 and have enabled permalinks, you may have had problems creating a new category or page to your site. I recently encountered this dilemma and devised the following strategy for adding, editing, or even deleting WordPress categories and pages. Note: this tutorial assumes you are running Apache.

First, open wp-includes/vars.php and find (around line #39):

$is_apache = ( strstr($_SERVER['SERVER_SOFTWARE'], 'Apache') || strstr($_SERVER['SERVER_SOFTWARE'], 'LiteSpeed') ) ? 1 : 0;

Comment out that line and add the following:

$is_apache = 1;

Save the file and upload it to your server.

Next, check the file attributes of your htaccess file(s). Ensure that the file is writable with a setting of either 666 or even 777 (or whatever works best on your server).

Finally, create or edit the necessary category or categories, publish a post or two under the new/edited category, and then double-check that everything is working as expected.

Now that you are a big winner with your new category, be sure to change the htaccess file permissions back to 644 or equivalent. Also, comment out the new line in the vars.php file and uncomment out (i.e., comment in) the original line of code.

To customize WordPress-powered password-protected posts such as this one, follow these simple steps.

First open template-functions-post.php and find the function get_the_password_form, which is located near the top of the page.

There are several aspects of this function that you may wish to customize. For example, the Perishable Press website requires several CSS attributes for stylistic control. Thus we simply added the class postpassword to the form input field, as well as the class passwordsubmit to the form submit button. This enabled full stylistic control over password-protected posts. You may also wish to modify the size of the input text field, or even edit the submit-button text.

Finally, remember to check both the post comment view for proper “password message” display. If it is not, edit the local comments.php file (usually near the top) until the message displays correctly.

The overly dramatic process of transferring our Online Empire to a new server and then back again manifests several valuable lessons. Please look back your note and observe the following suggestions during any future server migration and/or domain propagation events…

Continue Reading

About a year ago we signed up with a hosting provider that offered one of the best hosting deals around: lots of space, bandwidth, and transfer — plus all of the usual server software amenities that make life easier. Everything went smoothly at first…

In fact, the first six months of service were close to 100%. The few help-ticket items submitted were promptly resolved in a professional manner. We were ready to start some business and everything was going great. Then, about five months ago, we began noticing a serious increase in server downtime. Help tickets were also slow-going and the responses were like these cryptic one-liners that failed to address the actual problem, demonstrating a serious lack of concern and providing virtually no help. Further, multiple emails concerning account billing and renewal went (and remain) completely ignored. Indeed, email remains their only method of communication. At this point, we felt stranded, ignored, and utterly alone. Given this level of service, we were not comfortable hosting websites for our clients.

Continue Reading

Fashion stylish deleted text in XHTML via the über obscure del tag.

Code example:

<del datetime="1999-Dec-31T23:59:59+00:00" 
title="Text deleted: 31-Dec-1999 @ 23:59">
 Terminate me.
</del>

Live example:

Terminate me.

Well, maybe not that obscure..

• <pre> — Preformatted character data
• <em> — Renders as emphasized text
• <strong> — Renders as strong emphasized text
• <tt> — Renders font as teletype or monospace
• <dfn> — Defines a definition term
• <code> — Defines computer code text
• <samp> — Defines sample computer code
• <kbd> — Defines keyboard text
• <var> — Defines a variable
• <cite> — Defines a citation
• <strike> — XHTML Transitional only
• <del> — Indicates deleted text
• <ins> — Indicates inserted text
• <dl> — Defines a definition list
• <dt> — Defines a definition term
• <dd> — Defines a definition definition
• <abbr> — Defines an abbreviation
• <acronym> — Defines an acronym
• <address> — Specifies an address
• <q> — Indicates inline quoted text
• <bdo dir="rtl"> — Override the bidirectional algorithm
• <wbr> — Word break, applied by IE and Fx if needed
• <optgroup> — Labels groups of options in select boxes

About the Robots Exclusion Standard ¹:

The robots exclusion standard or robots.txt protocol is a convention to prevent cooperating web spiders and other web robots from accessing all or part of a website. The information specifying the parts that should not be accessed is specified in a file called robots.txt in the top-level directory of the website.

Notes on the robots.txt Rules:

Rules of specificity apply, not inheritance. Always include a blank line between rules. Note also that not all robots obey the robots rules — even Google has been reported to ignore certain robots rules. Also, comments are allowed (and recommended) within any robots.txt file when written on a per-line basis. Simply begin each line of comments with a pound sign “#”.

Prevent Robots from Indexing the Entire Site:

User-agent: *
Disallow: /

Prevent a Specific Robot from Indexing the Entire Site:

User-agent: Googlebot-Image
Disallow: /

Prevent all Robots from Indexing Specific Pages/Directories:

User-agent: *
Disallow: /cgi-bin/
Disallow: /privatedir/
Disallow: /tutorials/blank.html

A Specific Example:

In this example, no robots are allowed to index anything except for Google, which is allowed to index everything except the specified pages/directories. Note the required blank line between the rules.

User-agent: *
Disallow: /

User-agent: Googlebot
Disallow: /cgi-bin/
Disallow: /privatedir/

Another Specific Example:

In this example, no agents are allowed to index anything except for Alexa, which is allowed to index anything. Note that there is a blank space after the colon, which enables this rule to work.

User-agent: *
Disallow: /

User-agent: ia_archiver
Disallow:

Prevent all Agents Except for Google:

Here is Google’s preferred way to disallow all agents anything except Google, which is allowed everything. Note that “Allow” is not a standard parameter and therefore is not recommended.

User-agent: *
Disallow: /

User-agent: Googlebot
Allow: /

Notes on the “meta robots” Tag:

Certain robots rules may also be included in the head section of a web document. Examine the following examples:

<meta name="robots" content="noindex,nofollow,noarchive" />
<meta name="robots" content="noindex,nofollow" />
<meta name="googlebot" content="none" />
<meta name="alexa" content="all" />

Here is a general list of values available for the “content” attribute of the “meta robots” tag:

noindex, index — Determines indexing of site/pages.
nofollow, follow — Determines following of links.
nosnippet — Do not display excerpts or cached content.
noarchive — Do not display or collect cached content.

Additionally, Altavista supports:

noimageindex — Index text but not images.
noimageclick — Link to pages but not images.

References

• ¹ Wikipedia

To add Lightbox functionality to any single image:

1. Add rel="lightbox" to the anchor tag.
2. Add a title="" attribute to the anchor tag.
3. Add an alt="" attribute to the image tag.

To add Lightbox functionality to any series of images:

1. Add rel="lightbox[value]" to the anchor tag of each image.
2. Add a title="" attribute to the anchor tag of each image.
3. Add an alt="" attribute to the image tag of each image.
4. Any set of pictures with the same rel="lightbox[value]" will display with nav buttons.

Welcome to Perishable Press! This article covers a plethora of useful JavaScript tips and tricks. For more excellent JavaScript information, check out the JavaScript tag archive. If you like what you see, I encourage you to subscribe to Perishable Press for a periodic dose of online enlightenment ;)

Nifty JavaScript Design Tricks

Clickable divs

Standard design practice dictates that the site logo or banner located at the top of the page links to the home page of the site. There are several methods for including such functionality into a design, including this JavaScript trick that transforms an entire element (e.g., any div) into a link pointing to the site root:

<div id="banner" onclick="location.href='/';" style="cursor:pointer;">
   [ content goes here ]
</div>

Hide/Validate JavaScript Code

JavaScript Comments

Commenting your scripts is an excellent and highly recommended practice. Here are two methods of commenting within a block of JavaScript.

<script type="text/javascript">

// Use two forward slashes for single line comments

/* Use this method for
multi-line comments */

</script>

Link to an External JavaScript File

This is the preferred method of including JavaScript files. It is invisible to non-JavaScript browsers, and keeps the document from breaking during validation. Use if possible.

<script src="external.js" type="text/javascript"></script>

Hiding JavaScript

Hiding JavaScript code from non-compliant browsers is rather easy, just employ the following lines of code:

<script type="text/javascript">
<!--

JavaScript goes here
JavaScript goes here

//-->
</script>

Unfortunately, JavaScript code does not validate as XHTML. Fortunately, it is possible to present your code as invisible to the validators by enveloping it with the following lines of code:

<script type="text/javascript">
<![CDATA[

JavaScript goes here
JavaScript goes here

]]>
</script>

Combining these two methods produces a deadly weapon in the hellish JavaScript battle:

<script type="text/javascript">
<!--//--><![CDATA[//><!--

JavaScript goes here
JavaScript goes here

//--><!]]>
</script>

And, an alternate method has been suggested, but sustains inconsistent consensus:

<script type="text/javascript">
/* <![CDATA[ */

JavaScript goes here
JavaScript goes here

/* ]]> */
</script>

Here is the same commenting method used for CSS:

<style type="text/css">
/* <![CDATA[ */

CSS goes here
CSS goes here

/* ]]> */
</style>

A slightly modified version of the previous method:

<style type="text/css">
/* //<![CDATA[ */
<!--

CSS goes here
CSS goes here

//-->
/* //]]> */
</style>

Here is yet another way to comment out CSS content:

<style type="text/css">
<!--/*--><![CDATA[/*><!--*/

CSS goes here
CSS goes here

/*]]>*/-->
</style>

Finally, although popular, avoiding this method has been recommended:

<script type="text/javascript">
//<![CDATA[
<!--

JavaScript goes here
JavaScript goes here

//-->
//]]>
</script>

Non-JavaScript Browser Support

Use the <noscript> tag to provide support for antiquated browsers and serve 'em some alternate content. The <noscript> tag operates according to the presence/absence of JavaScript. Consider the following:

<noscript>
 <p>This will not be displayed if JavaScript is enabled.</p>
</noscript>

Here is a specific example that would provide a user with the option to continue browsing without JavaScript:

<noscript>
 <p>
  It appears your browser doesn't support JavaScript.
  Please visit <a href="http://domain.tld/noscript.html">the no-script page</a>
  to see a non-JavaScript version of this page.
 </p>
</noscript>

For reference purposes..

Marquee Madness

<h3><marquee width="33%">Marquee Madness</marquee></h3>

Broken pipe symbol »   ¦   [ ¦ ]

Unbroken pipe symbol »   |   [ | ]

Welcome to Perishable Press! This article covers many different aspects of WordPress functionality, including customizing quicktags, deleting the cache, numbering comments & posts, changing password text, and displaying archive menus. Note that this article was written for previous versions (i.e., less than 2.0) of WordPress. Discrepancies may exist between the code presented in this post and that of more recent versions of WordPress. Nonetheless, this information is presented for references purposes with the hope that it will prove useful for those working with everyone’s favorite blogging platform, WordPress!

Customize WordPress Quicktags

The more Quicktag:

The <!--more--> Quicktag breaks a post into “teaser” and content sections. Type a few paragraphs, insert this tag, then compose the rest of your post. On your blog’s home page you’ll see only those first paragraphs with a “(more…)” hyperlink, which when followed displays the rest of the post’s content.¹

Customize the more Quicktag:

To customize the “(more…)” hyperlink, open the file “wp-includes/template-functions-post.php” and locate the following lines (around lines #54 & #62, respectively):

function the_content($more_link_text = '(more...)', $str...
function get_the_content($more_link_text = '(more...)', $str...

For each line, carefully replace (more...) with whatever text you wish. Possibilities include Continued >> and [ Read on... ].

Modify the Target of the more Quicktag:

To modify the target of the “(more…)” hyperlink, replace the following statement (located within “wp-includes/template-functions-post.php” around line #92):

$output .= ' <a href="'. get_permalink() . "#more-$id\">$more_link_text</a>";

with:

$output .= ' <a href="'. get_permalink() . "\">$more_link_text</a>";

The nextpage Quicktag:

The <!--nextpage--> Quicktag is similar to the more tag, except it can be used any number of times in a post, and each insert will “break” and paginate the post at that location. Hyperlinks to the paginated sections of the post are then generated in combination with the wp_link_pages() or link_pages() template tag.²

Customize the_excerpt Function

Open the file “wp-includes/functions-formatting.php” and find the following line of code (located around line #732):

array_push($words, '[...]');

To customize the continuation notation for excerpts, simply replace [...] with the text of your choice. Something like “[...continued »]” or “[ click post title to read more ]” works just swell.

To change the default number of words included in excerpts, edit the 55 in the following line of code (located around line #728) to reflect the desired number of excerpt words:

$excerpt_length = 55;

Fix the WordPress "Remember Me" Option

If the WordPress admin seems to “forget” you even after following all of the proper protocols, try changing the actual link that takes you to your WP admin-login page. Change the link from /wp-login.php (the file) to /wp-admin/ (the directory).

Cache Notes

It is totally safe to delete everything in the /wp-content/cache/ folder!

Custom Number of Posts

Sometimes it is nice to customize the number of posts displayed for different loops. For example, if you have different themes, it is possible for one theme to show five posts while another theme only shows one post. To pull it off, simply place the following line of PHP before the loop:

<?php query_posts('showposts=n'); ?>

Where "n" represents the number of posts that the loop will display ³. Nice ;) Update: This method needs some work — seemed okay at first, but then links to posts always go to the first blog page..

Tweaking Comment Numbers

Instruct WordPress to begin each post’s comment numbers with the number "1" (or any number), and then proceed numerically thenceforth by adding this line at the top of comments.php..

<?php $commentcount=1; // number of first comment for each post ?>

..and then placing this line at the location where you would like the comment numbers to appear:

<?php echo $commentcount++; ?>

Another method for accomplishing the same thing involves replacing this code (located in comments.php)..

<?php if ( $comments ) : ?>
<?php foreach ($comments as $comment) : ?>

..with this..

<?php if ( $comments ) : ?>
<?php foreach ($comments as $comment) : $comment_count++;?>

..and then placing this line at the location where you would like the comment numbers to appear:

<?php echo $commentcount++; ?>

Customize Default Password Text

To change the default WordPress password text, open the file "wp-includes/comment-functions.php", and scroll to around line #309. Look for the password text and change it to whatever you prefer. Note: this default password text is different than the password text specified in the comments.php file.

Dropdown Archive Menus

To create dropdown archive menus (using get_archives⁴), simply emulate one of the following chunks of code and tweak to suit:

<select name="archivemenu" onChange="document.location.href=this.options[this.selectedIndex].value;">
<option value="">Daily Archives</option>
<?php get_archives('daily','33','option','','','FALSE'); ?>
</select>

<select name="archivemenu" onChange="document.location.href=this.options[this.selectedIndex].value;">
<option value="">Daily Archives</option>
<?php get_archives('postbypost','33','option','','','FALSE'); ?>
</select>

<select name="archivemenu" onChange="document.location.href=this.options[this.selectedIndex].value;">
<option value="">Monthly Archives</option>
<?php get_archives('monthly','12','option','','','TRUE'); ?>
</select>

<select name="archivemenu" onChange="document.location.href=this.options[this.selectedIndex].value;">
<option value="">Daily Archives</option>
<?php get_archives('daily','7','option','','','FALSE'); ?>
<option value="">Monthly Archives</option>
<?php get_archives('monthly','7','option','','','TRUE'); ?>
<option value="">Yearly Archives</option>
<?php get_archives('weekly','7','option','','','TRUE'); ?>
</select>

References

• ¹ WordPress Codex on the more Quicktag.
• ² WordPress Codex Quicktags Summary.
• ³ WP Template Tags: query_post
• ⁴ WordPress Codex: get_archives

Welcome to Perishable Press! This article, Stupid htaccess Tricks, covers just about every htaccess “trick” in the book, and is easily the site’s most popular offering. In addition to this htaccess article, you may also want to explore the rapidly expanding htaccess tag archive. Along with all things htaccess, Perishable Press also focuses on (X)HTML, CSS, PHP, JavaScript, security, and just about every other aspect of web design, blogging, and online success. If these topics are of interest to you, I encourage you to subscribe to Perishable Press for a periodic dose of online enlightenment ;)

Table of Contents

• General
  1. htaccess definition
  2. htaccess comments
  3. important information
  4. performance issues
  5. regex character definitions
  6. redirection header codes
• Essentials
  1. htaccess comments
  2. enable basic rewriting
  3. enable symbolic links
  4. enable AllowOverride
  5. rename the htaccess file
  6. retain httpd.conf rules
• Performance
  1. disable AllowOverride
  2. pass the character set
  3. preserve bandwidth
  4. disable the server signature
  5. set the server timezone
  6. set admin email address
  7. enable file caching
  8. set default language & character set
  9. declare specific/additional MIME types
  10. send headers without meta tags
  11. limit request methods to GET/PUT
  12. process files according to request method
  13. execute various file types via CGI script
• Security
  1. prevent access to htaccess
  2. prevent access to any file
  3. prevent access to multiple file types
  4. prevent unauthorized directory browsing
  5. change the default index page
  6. disguise script extensions
  7. limit access to the LAN
  8. secure directories by IP or domain
  9. deny/allow domain access for IP range
  10. deny/allow multiple IP addresses on one line
  11. miscellaneous rules for blocking/allowing
  12. stop hotlinking, serve alternate content
  13. block robots, rippers, and offline browsers
  14. more stupid blocking tricks
  15. even more scum-blocking tricks
  16. password-protect directories
  17. password-protect files, directories, and more
  18. require SSL (secure sockets layer)
  19. automatically CHMOD various file types
  20. disguise all file extensions
  21. limit file upload size
  22. disable script execution
• Usability
  1. minimize CSS image flicker in IE6
  2. deploy custom error pages
  3. provide a universal error document
  4. employ basic URL spelling check
  5. force media downloads
  6. display file source code
  7. redirect visitors during site development
  8. provide password-prompt during site development
  9. prevent access during specified time periods
• Redirects
  1. important note about redirecting via mod_rewrite
  2. redirect from www-domain to non-www-domain
  3. redirect from an old domain to a new domain
  4. redirect string variations to a specific address
  5. other fantastic redirect tricks
  6. send visitors to a subdomain
  7. more fun with RewriteCond & RewriteRule
  8. more fun with Redirect 301 & RedirectMatch 301
• WordPress
  1. secure wordPress contact forms
  2. wordpress permalinks
• Random
  1. activate SSI for HTML/SHTML file types
  2. grant CGI access in a specific directory
  3. disable magic_quotes_gpc for PHP enabled servers
  4. enable MD5 digests
  5. expression engine tricks
• References

Continue Reading

Color References

• Wikipedia Hex & RGB Color Names
• Wikipedia Color List
• Named Colors Panel
• W3 Schools Color Names
• Colour Lovers
• Texas Precancel Club - Massive Color Links and Resources
• Lorelle on WordPress - Color Reference Link List

Color Schemes

• Color Scheme Generator
• Wellstyled Scheme Generator
• Color Combinations
• Color Match
• Infohound Color Schemer
• Color Toy
• Slayer Office - Color Palette
• 4096 Color Wheel
• Chromoweb Wheel
• Colour Scheme Chooser
• Color Calculator
• Triple Code Color Themes
• Net Cocktail Color Schemes
• Color Combination Schemes
• Color Combinations
• DailyColorScheme *
• Adobe Kuler *

Color Charts

• Color Charts
• Color Charts by HTML Color Codes
• Visibone Color Charts
• December Color Shades
• December Color Shades and Codes
• 100 Random Colors
• Somacon - CSS Color Chart
• Jessey - CSS colors
• Extended Color Names in CSS
• Color Codes Matching Chart HTML *
• Complete HTML True Color Chart *

Color Pickers

• Dynamic Color Picker
• Firefox Extensions - Colorzilla
• Iconico ColorPic
• Color Picker and Blender
• Color Palette Test
• Back To Font Web Color Picker
• Color Whore
• Eye Dropper Color Mixer

Color Tools

• Redalt Color Tools - URL Color Reports
• Chromograf
• Color conversion [ RGB / CMYK / HSV ]
• HTML Color Code Generator
• Color Blender
• Meyer’s Color Blender *
• Layout Color Changer
• Color Palette from Images
• Color Palette Generator from Images
• Color Mixers
• Meyer Web - Color Blend
• Color Match
• Easy RGB
• Colors on the Web Resources
• CSS via PHP
• Color Whore
• color synthAxis
• Colour Selector Tools
• Examining Images Color Schemes
• Color Palette from Images
• ColourMod *
• Color Calculator *

Testing Color and CSS

• CSS Layout Sample
• Test of System Colors Specified in CSS 2
• Test of Extended Color Names in CSS
• CSS Pointers Group - Color Considerations
• Color and Backgrounds
• Test Font Colors Against Background Colors
• Browser Gamma-Consistency Test
• Colour Contrast Analyser
• Spin the Color Wheel
• Unsafe Colormatch Template
• Testing Font Colors Against Backgrounds

Color Theory

• W3C CSS3 Color Module
• A Standard Default Color Space for the Internet - sRGB
• Color Name Dictionaries
• Universal Color Language, Level 3 Color Names
• Tutorial on CSS Colors
• Master Class - Color
• Color Theory and Mixing
• Worqx - Color Theory
• Color Matters
• Secrets of Web Color Revealed
• DevX - What is Color
• DexX - Using Web Color
• Scalable Vector Graphics (SVG) 1.1 Specification
• DevX - Design With Color
• Web Whirlers - Colors on the Web
• Liquisoft - Color Theory
• Pynter Extra - Color, Contrast, and Dimension in News Design
• Tutorial on CSS and Color
• 500+ Named Colours

* Denotes new(er) entry.

Secret Search Codes:

x@777

• notes — notes posts (via search)
• notes — notes posts (via tag)
• service — web services (via tag)
• links — online resources (via tag)
• private — offline resources (via link)
• summon — key posts (via tag)
• update — update material (via tag)
• upgrade — wp upgrade material (via tag)
• theme — wp themes (via tag)
• plugins — wp plugins (via tag)
• rrr — error posts (via tag)