Kaizeku Ban » wpistalker

Error has been made

Avice — Wed, 29 Oct 2008 04:16:07 +0000

The “404 page not found” shouldn’t be so depressing so I rebuild WP-iStalker 1.6.2 404 page. It now has a Google Webmaster 404 widget customize to your locale language setting and it will also trigger ‘prefeching’ content (base on the request link and google fixURL suggestion).

Try get yourself lost around here. ^D

Wp-iStalker 1.6 hidden theme options

Avice — Sun, 06 Jul 2008 03:59:04 +0000

There are more than ten hidden options in Wp-iStalker theme, these hidden options will be available if certain conditions are met. Checkout the requirements below

1. Blog header Advanced Customization

Upload any TTF fonts inside /themes/wp-istalker-%versions%-pb/public/fonts directory.
GD2 is enabled

2. Post layout avatar options

Enabled Avatar refer Admin > Settings > Discussion > Avatar Display

3. ICRA pics-ratings

Upload ICRA labels.rdf inside your wordpress blog root directory.

4. Post layout relative date options

Activated Dustan’s time since plugin

5. ClaimID delegate meta link options

Valid microID hash

6. XRDS

Activated WP Openid plugin.

7. Language alternate meta links

Activated Global Translator plugin.

8. Related post widget extra options

Activated “Related posts widget”.

9. A9 Open search auto-discovery

Make sure there is no osd.xml in your wordpress blog root directory
The theme public directory is writable /themes/wp-istalker-%versions%-pb/public/

10. APC template options

Premium versions only

Enabled APC
Defined WP_CACHE constant inside wp-config.php
Upload APC object-cache.php inside /wp-content/ directory

11. Botnet Cloaking options

Premium versions only

Install CrawlTrack within the same wordpress database

WPI Cross Browser Support

Avice — Mon, 19 May 2008 10:48:51 +0000

If you are frustrated that certain WPI version (i.e., public & beta) doesn’t support MSIE. I intentionally did that (just) to annoyed Microhoo and the rest of MSIE users (that is 70% of internet population).

Cross Browser Autoload

Before you stalked me, WPI WordPress theme has a build in function for auto-loading cross browser stylesheet and script files. This function is available since our first release.

How to load Browser specific CSS & Scripts?

We asume you are using the crappy broken MSIE 6 browser running on Windows XP.
When WPI theme load it will look for specific stylesheet & script files like below list.

stylesheet → /themes/wp-istalker/css/ ↓
1. ie.css
2. ie-6.css
3. winxp.css
javascript → /themes/wp-istalker/scripts/ ↓
1. ie.js
2. ie-6.js
3. winxp.js

If any of the files exists, It will queue the specific files and append it to the master file then proceed with minified → crunch → combine → gzip or deflate (if the ua allowed it) and send it to the browser as a single file. Walla

Depend on the user UA the complete files will be cached inside the the following cache directory.

/themes/wp-istalker/cache/css/*.css.compression-type
/themes/wp-istalker/cache/scripts/*.js.compression-type

the combine files can be found at

/themes/wp-istalker/css/combine-md5hash.css
/themes/wp-istalker/scripts/combine-md5hash.js

how to check for browser versions number?

Its a bit tricky to know the correct name and version numbers, here’s how I do it.

Go to your blog frontpage and look inside the source code body-tag. On the “class” attribute you can find something similar like the below example. ↓

<body id="wpi-blog-kaizeku-com" class="wp-home firefox firefox-20 winxp -foaf-Document">

If you have firebug → console.log($(’body’).attr(’class’) );

code break:

wp-home → Section , Refer WordPress Template Hierarchy
firefox → Browser name
firefox-2 → Browser name & Major Version numbers.
winxp → OS platform

for variant of gecko base engine (i.e., prism, flock, seamonkey,mozilla suite) it will just show it as “mozilla mozilla-19 winxp” or something similar.

just to see how clever this go, you can used this wonderful root body browser-class-name CSS selector to create different CSS styling/tweak for cross browser like so ↓

body.safari div.hentry{
 position:relative; top: -10px; min-height:400px
}
body.ie-6 div.hentry{
 height:auto;height:450px
}
body.opera div.hentry{
 min-height: 500px
}

The CSS files Ordering

Inheritance is very important factor in CSS. Below is list of files sort by number starting from top to bottom.

@import url('/wp-content/themes/wp-istalker/icecream.css,auth.css,single.css,lang.css,firefox.css,winxp.css');

icecream.css → global css (style.css) load at all page include in this file is our blueprint.css (blueprint framework css), image.css.
I prefer delicious filename more than generic :) .
auth.css → this file will be loaded if you are registered user.
single.css → section files
sections: home.css, single.css, attachment.css, page.css, search.css, archive.css, category.css, tag.css, year.css, month.css, day.css, 404.css etc..
plugins & widgets → supported plugins and widgets file will be append here (i.e., wp-pagenavi, openid, global translator, wpseo, wpstats)
firefox → browser name specific stylesheets
firefox-2 → it get more specific.
platform → os/platform base stylesheets. good for declaring supporting fonts class
extra_css - filter hook wpi_css_import_array

Custom Hook

Hook for each of the import files → wpi_css_import_$int
$int → 1 to 7

notes
if you want to append a file just after the section css you will used ‘wpi_css_import_2′ as hook. I wont cover the how part in this guide. check out Wordpress Codex if neeed too.

If you are on MSIE6, this page will render in XML ;p. Not my fault really, This site has valid xhtml, CSS 2.1 , xhtml/xml, WCAG A1 & Section 508. Your browser just pwned too much propriety language to survive

Support the standards so it will continue to look good in the future.

WPI Gravatar shortcode

Avice — Sat, 17 May 2008 19:47:44 +0000

Wp-iStalker (WPI) theme has plenty of undocumented shortcode i.e., redirect, cropper, hcard, just to name a few.

Notes

WPI gravatar used SPAN and CSS inheritance instead of the normal image <img> tag. It may seem a bit weird in term of normal coding standard. But this implementation will save you some bandwidth and rendering time in the long run. Data embed is also part of HTML 5 draft work in progress ([wpi_redirect href="http://www.whatwg.org/specs/web-apps/current-work/#embedded0" title="Html 5 Data Embed"]data embed[/wpi_redirect]).

Avatar Shortcode

[wpi_avatar attribute="value"]Content[/wpi_avatar]

Content:

A comma separate value.

Email → valid Gravatar Email (e.g., billgates@microsoft.com)
Invalid or wrong email will be replace with [wpi_redirect href="http://scott.sherrillmix.com/blog/blogger/wp_identicon/"]wp-identicon[/wpi_redirect] geometrical avatar.
Size → 35
size range from 15 to 150 (multiples of 5 - 15,20,25 .. 100)

Attributes:

An attribute-value pairs. Default value as follow.

title → gravatar
align → left
possible value : left, right, center & none
url → null
link the avatar (Embed with hcard/microid format)

Example Galore

simple gravatar shortcode
```
[wpi_avatar]sakurab@somewhere.org[/wpi_avatar]
```
[wpi_avatar]is.b.e@hotmail.com,35[/wpi_avatar] Gravatar aims to put a face behind the name. This is the beginning of trust. In the future, Gravatar will be a way to establish trust between producers and consumers on the internet. It will be the next best thing to meeting in person. ~ about gravatar
blank gravatar shortcode (identicon)
```
[wpi_avatar]1.618[/wpi_avatar]
```
[wpi_avatar]1.618[/wpi_avatar]Identicons allow visual representations of commenters without requiring any external sites or user interactions. With 40 possible shapes (about 70 with inversions) in 3 possible positions, around 8000 distinguishable colors and four different rotations for each part, there should be several billion possible shape combinations … ~ [wpi_redirect href="http://scott.sherrillmix.com/blog/blogger/wp_identicon/" title="wp_identicon"]wp-identicon[/wpi_redirect]
full gravatar shortcode
```
[wpi_avatar url="http://gravatar.com" align="right" title="Microhoo"]hbill.gates@gmail.com,40[/wpi_avatar]
```
[wpi_avatar url="http://en.gravatar.com/site/privacy" align="right" title="Microhoo"]hbill.gates@gmail.com,40[/wpi_avatar]Gravatar.com collects your email address as part of the gravatar service. We will never rent, sell, or otherwise distribute or make public your email address. We hate spam as much as you do. The way gravatar requests are structured, your email address is encrypted before transmission. Your email address cannot be harvested from gravatar enabled sites due to gravatar requests. We take your privacy seriously. ~ [wpi_redirect href="http://en.gravatar.com/site/privacy" title="Gravatar police"]Gravatar Policy[/wpi_redirect]

Custom Hook

Filter Hook for wpi_avatar shortcode.

wpi_avatar_shortcode

Return raw html output.
see: KaizekuShortCode::avatarCallback().

External Links

Must read → Wordpress Shortcode Limitation

WPI Redirect Shortcode

Avice — Sat, 17 May 2008 08:22:23 +0000

Simple shortcode for making safe external redirect. Made this for those SEOware user.

introduction

Wordpress 2.5 introduce new function for adding shortcode (aka bbcode). A simple set of functions for creating macro codes for use in post content. It just make developing plugins much easier and neat. If you want to digg more about WordPress shortcode check out the [wpi_redirect href="http://codex.wordpress.org/Shortcode_API"]WordPress Codex Shortcode API[/wpi_redirect] .

Shortcode

[wpi_redirect attribute="value"]text[/wpi_redirect]

attributes:

with default values

href = #content
title = redirect
rel = external noarchive
class = curie

if there is no “text” the default value is “Link”.

Example

redirect links to wordpress.org

[wpi_redirect href="http://wordpress.org" rel="noarchive"]WordPress.org[/wpi_redirect]

results → [wpi_redirect href="http://wordpress.org" rel="noarchive"]WordPress.org[/wpi_redirect]

Wp-iStalker Custom Wordpress Hook

The WordPress Filter Hook for our redirect shortcode.

wpi_redirect_shortcode

This hook return raw html output.
see: KaizekuShortCode::redirectCallback().

Lo, the do and dont

When to used redirect links?

This depends on your content & context as whole. If the external sites that you are linking doesn’t have any weight with your content. So is best to used redirect links instead of the normal links.
When NOT to used redirect links?

I’ve encounter some damaging issue with certain Wordpress Translation Plugins. Because of the relative links, the translation scripts might create a local cache of the external sites in your server. Its a complete mirror of wasted sources. so beware. You might get penalized for duplicate content proxy hacking. scarry.

External Links

Must read → Shortcode Limitation

WPI Theme Typeface Modifications

Avice — Fri, 16 May 2008 14:05:26 +0000

I made this guide because of many request from my theme user asking for the blog-header PSD. FYI, the new theme blog-header is generated via server side scripts (gd-font png). If you need to change the font face, size or the foreground background colors etc,… read on.

Before we start, this guide are for WPiStalker WordPress theme (version 1.6x on WordPress 2.5.x).

Editing the font face.

First, Upload your fonts file to */themes/wp-istalker/lib/webfonts/ directory.
note: avoid funky font name with symbols or non-utf, rename it if you must.
Next, go to your WordPress Admin Dashboard, Design » Theme Editor. Then on the right sidebar links, click on “Theme Functions” (functions.php).

Inside theme functions, scroll down to the end of file. Copy and paste the below code.
```
function my_new_header_settings($options){
	$options = array('font'=>'the-font-name','size'=>24,'hex'=>'F4F5F7');
	return $options;
}
```
But first you need to replace/edit “the-font-name” with your upload font file name.

Example:

assuming your upload filename is BDBARDUS.ttf, so the correct code should be like so ↓
```
function my_new_header_settings($options){
	$options = array('font'=>'BDBARDUS','size'=>24,'hex'=>'F4F5F7');
	return $options;
}
```

While still inside the “Theme Functions” file, find on line 1541 function wpi_init(), add the following code ↓

add_filter('wpi_blog_header_options','my_new_header_settings');

After

$active_plugins = $Wpi->getActivePlugins;

The results should be ↓

$active_plugins = $Wpi->getActivePlugins;
add_filter('wpi_blog_header_options','my_new_header_settings');

OK thats it, save the theme functions file and go to your front-page. Dont forget to refresh the browser.
Do the happy dance, the end. Namaste

External Links

Recommended font resources daFont

Wp-Istalker Minor Fixes

Avice — Thu, 28 Feb 2008 08:32:29 +0000

Minor fix for WP-istalker Theme inloop_get_cat_links & wpi_get_grid_width functions (version 1.x). You could either wait for WPISTALKER v2 or apply this quick patch.

functions.php

Presentation » Theme Editor » functions.php

On line 745 replace inloop_get_cat_links function with the following code:-

View Code

function inloop_get_cat_links($echo= 1, $index = false, $separator = '¸')
{
	$cats = get_the_category();
	$options = array( 'class' => 'cat-link dc-subject',
				'href'	 => '#content',
				'rel'	 => 'category foaf.topic',
				'title' => 'category',
				'rev'	 => 'site:archive');

		if (is_bool($index)):
			$links = "\n";
			$ismore = false;
			$cnt = count($cats);

			if ($cnt >= 0):
				$ismore = true;
				$endcnt = ($cnt - 1);
			endif;

			$i = 1;

			foreach($cats as $cat):
				$options['href'] = wpi_relative(get_category_link($cat->cat_ID));
				$options['title'] = $cat->cat_name.' ('.$cat->count.' articles in this category)';
				$links .= _t('a',$cat->name, $options);	

						 if ( $ismore && $i == $endcnt):
						 	$links .= ' '._t('span','&',array('class'=>'sep')).' ';

						 elseif ( $i !== $cnt):
						 	$links .= _t('span',$separator,array('class'=>'sep')).' ';

						 endif;
			$i++;
			endforeach;

		elseif(is_integer($index)):	

			$cats = $cats[$index];
			$options['href'] = wpi_relative(get_category_link($cats->cat_ID));
			$options['title'] = $cats->cat_name.' ('.$cats->count.' articles in this category)';

			$links .= _t('a', $cats->name, $options);	

		endif;

		unset($cats);

		if ($echo == 1): echo $links; else: return $links; endif;
}

On line 341 replace wpi_get_grid_width function with the below code

View Code

 function wpi_get_grid_width( $column = 10 )
 { global $kaizeku;
 if (!$kaizeku->engine->enabled_grid){
 $kaizeku->object_cache->set(WPI_REF_TOKEN,'admin',array('theme_styles'=>'fluid'));
 return false;

 } else {

 settype( $column, "integer" );

 $setwidth = ( $kaizeku->css['colwidth'] + $kaizeku->css['margin'] ) ;
 return ( ($column * $setwidth) - $kaizeku->css['margin'] ) ;

 }
 }

CSS

External Links

theme.istalker.net

Kaizeku Ban » wpistalker

Error has been made

Wp-iStalker 1.6 hidden theme options

1. Blog header Advanced Customization

2. Post layout avatar options

3. ICRA pics-ratings

4. Post layout relative date options

5. ClaimID delegate meta link options

6. XRDS

7. Language alternate meta links

8. Related post widget extra options

9. A9 Open search auto-discovery

10. APC template options

11. Botnet Cloaking options

WPI Cross Browser Support

Cross Browser Autoload

How to load Browser specific CSS & Scripts?

how to check for browser versions number?

The CSS files Ordering

Custom Hook

WPI Gravatar shortcode

Notes

Avatar Shortcode

Content:

Attributes:

Example Galore

simple gravatar shortcode

blank gravatar shortcode (identicon)

full gravatar shortcode

Custom Hook

External Links

WPI Redirect Shortcode

introduction

Shortcode

attributes:

Example

Wp-iStalker Custom Wordpress Hook

Lo, the do and dont

When to used redirect links?

When NOT to used redirect links?

External Links

WPI Theme Typeface Modifications

Editing the font face.

Example:

External Links

Wp-Istalker Minor Fixes

functions.php

View Code

View Code

CSS

External Links