www.zackn9ne.com
This is a blog for WordPress web designers, developers and users.
This is a blog for WordPress web designers, developers and users.
Jun 22nd
Add this value to the string for input type:
value="" onclick="javascript:this.style.backgroundImage='none';"
The full result should look something like this.
<input type="text" name="q" id="searchfield" autocomplete="off" size="31" value="" onclick="javascript:this.style.backgroundImage='none';"/>
Remember to style the id of “searchfield” to have a background image in your CSS file.
May 12th
This was taken from a site called “How To: Display Your WordPress Category List in Multiple Columns – Wordpress Development Blog – Crosshairs” that I have had some trouble accessing. So I have basically mirrored the URL http://www.crosshairs.net/index.php/archives/1009 because this information is very very valuable to me. I have copied and archived the text on that page in a permanant pastebin found here: http://pastebin.com/30×3ZFGr.
Back to the code. This is how to do this the right way. There is another solution out there that does not alphabetize the columns according to plain English, don’t use that solution.
For this tutorial we are going to display the categories in 5 columns. First we need to define all values for the array.
<?php // Grab the categories - top level only (depth=1) $get_cats = wp_list_categories( 'echo=0&title_li=&depth=1' ); // Split into array items $cat_array = explode('</li>',$get_cats); // Amount of categories (count of items in array) $results_total = count($cat_array); // How many categories to show per list (round up total divided by 5) $cats_per_list = ceil($results_total / 5); // Counter number for tagging onto each list $list_number = 1; // Set the category result counter to zero $result_number = 0; ?>
Now the html
<ul class="category_footer_post" id="cat-col-<?php echo $list_number; ?>"> <?php foreach($cat_array as $category) { $result_number++; if($result_number % $cats_per_list == 0) { $list_number++; echo $category.'</li> </ul> <ul class="category_footer_post" id="cat-col-'.$list_number.'">'; } else { echo $category.'</li>'; } } ?> </ul>
We can now easily style following with CSS: #cat-col-’.$list_number.’ with ‘.$list_number.’ being the… you guessed it, the number of your column.
Because every column will have its own number, do not forget that you will have to style all columns (#cat-col-1, #cat-col-2, #cat-col-3, #cat-col-4, #cat-col-5).
for example:
#cat-col-1{float:left;width:100px;} #cat-col-2{float:left;width:100px;} #cat-col-3{float:left;width:100px;} #cat-col-4{float:left;width:100px;} #cat-col-5{float:left;width:120px;}
May 11th
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"><head><title>jQuery Tools Tabs, Tooltips and Scrollable</title><meta http-equiv="content-type" content="text/html;charset=utf-8" /><meta http-equiv="Content-Style-Type" content="text/css" /><link href="styles.css" rel="stylesheet" type="text/css" /><script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script><script type="text/javascript" src="jquery.tools.min.js"></script><script type="text/javascript">$(function() {/* Initialize Tabs */$("#tabs-1").tabs("#tabPanes-1 > div");$("#tabs-2").tabs("#tabPanes-2 > div", { effect: 'fade' });$("#tabs-3").tabs("#tabPanes-3 > div", { effect: 'fade' });/* Initialize Tooltip */$(".trigger").tooltip();/* Initialize Scrollable "Coda Slider" */$("div.scrollable").scrollable({size:1});$("div.navi a").each(function(i) {$(this).html('Tab ' + (i+1));});});</script></head><body><div><h3>Basic Tabs</h3><!--BEGIN FIRST SET OF TABS --><ul id="tabs-1"><li><a href="#">Tab 1</a></li><li><a href="#">Tab 2</a></li><li><a href="#">Tab 3</a></li></ul><div id="tabPanes-1"><div><p>First pane</p></div><div><p>Second pane</p></div><div><p>Third pane</p></div></div><!-- end div .panes --><!-- END FIRST SET OF TABS --></div><!-- end div .wrapper --><div><h3>Transition Fade Effect Tabs</h3><!-- BEGIN SECOND SET OF TABS --><ul id="tabs-2"><li><a href="#">Tab 1</a></li><li><a href="#">Tab 2</a></li><li><a href="#">Tab 3</a></li></ul><div id="tabPanes-2"><div><p>First pane</p></div><div><p>Second pane</p></div><div><p>Third pane</p></div></div><!-- end div .panes --><!-- END SECOND SET OF TABS --></div><!-- end div .wrapper --><div><h3>Tooltip on Tabs</h3><!-- BEGIN THIRD SET OF TABS --><ul id="tabs-3"><li><a href="#">Tab 1</a><div>This is the tooltip for Tab 1</div></li><li><a href="#">Tab 2</a><div>This is the tooltip for Tab 2</div></li><li><a href="#">Tab 3</a><div>This is the tooltip for Tab 3</div></li></ul><div id="tabPanes-3"><div><p>First pane</p></div><div><p>Second pane</p></div><div><p>Third pane</p></div></div><!-- end div .panes --><!-- END THIRD SET OF TABS --></div><!-- end div .wrapper --><div><h3>Scrollable ("Coda Slider")</h3><!-- BEGIN SCROLLABLE --><!-- navigator --><div></div><!-- Scrolling Panels --><div><div><div><p>First pane</p></div><div><p>Second pane</p></div><div><p>Third pane</p></div><div><p>Fourth pane</p></div><div><p>Fifth pane</p></div></div><!-- end div .items --></div><!-- end div .scrollable --><!-- Next and Previous links --><a>Next</a><a>Prev</a><!-- END SCROLLABLE --></div><!-- end div .wrapper --></body></html>
Mar 1st
Step 1 get your color profile setup:
Step 2 Download a 960 grid from 960.gs
Step 3 Get your Databases in order. Switch them where they need to be and run these queries. hint- browse the Database first to see the current location for the location you want to change.
Step 4. Download this Web2.0 photoshop style and append it to your default style palette.
Step 5. Make sure your WordPress blog is visible to search engines.
Bonus step: Browse around some good free icon sites.
Oct 19th
With many choices for online billing, or the dreaded Quickbooks, you can spend a lot of time entereing your clients, bills ect. to find that the billing platform you are using falls short.
Freshbooks.com

Key Pay Off Feature:
Being able to receive payments.
Simplyinvoices.com

Key Pay Off Feature:
Very simple billing. If you do whole projects and receive full payment every time, this is an ok solution.
Oct 6th
I can never remember where the image settings are for WordPress. Without hasseling around with the database or the dreaded options.php page, make sure your Image path is set correctally for images to upload.
Problems uploading images in WordPress? There are a couple of things to check.
Here are some images on how to do this in case you don’t like to read.

Sep 24th
This sidebar is accesible through / Appearance / Widgets on your Wordpress.org installation.
<?php if ( !function_exists('dynamic_sidebar')
|| !dynamic_sidebar('sidebar1') ) : ?>
<?php endif; ?>
You’re all set. Now the code will look to your widgets panel and display whatever things you have dragged in to show up in your layout. Need more sidebars? Put them everywhere, just change the number to something like ’sidebar2′.
Got any other good tips? Let us know.
Sep 21st
Now you can run your server at a coffee shop, on an airplane, at home and in a Virtual Machine.
Jan 23rd
I hate e-mail clients. They are the scum of the earth. One more thing to backup, dosen’t work with any free e-mail account you actually want, yeah I know Windows Live Mail works but, its still annoying to install, update, and have the responsibility of backing up. Yeah I know it backs up to your normal hotmail, but you still should check to make sure its doing its job, and most importantly if you ever wipe your system environment you will have to waste costly time to re-install Windows Live again, what a drag that is. Come on people we are in web 2.0 here lets use some web apps and get away from all the OS centric garbage. The golden link below. Thanks Vista Forums.
here.
Once you run this app, just click both of the big buttons and you should be using HTML hotmail with out too much fuss in your near future.
Jan 5th
Page With an Internal Style Sheet:
This page contains style definitions at the top of the HTML code.