<ul id="nav">
<li<?php if ( is_home() ) { echo 'class="current"'; } ?>><a href="#">Gallery</a></li>
<li<?php if ( is_page('about') ) { echo 'class="current"'; } ?>><a href="#">About</a></li>
<li<?php if ( is_page('submit') ) { echo 'class="current"'; } ?>><a href="#">Submit</a></li>
</ul>

Whereas this will do the trick for a finite menu where the names will never change, it’s not what I wanted for my client. With a little research in to some of the changes in the past couple versions of WP, I was able to get the desired results with a few lines of code:

<div id=”menu”>
<!–Main navigation menu–>
<ul>
<?php wp_page_menu(’show_home=1′); ?>
</ul>
</div><!– menu –>

You might ask “How does it know what the current page is?” I say…..”WordPress is awesome and takes care of it for you these days! When using the wp_page_menu() function, the “current_page_item” class is automatically added to the current selected page. The end result will be this:

<li class="current_page_item">

Rather than:

<li class="page_item page-item-2">

So the accompanying CSS would just apply the “current” styling to the “current_page_item” class, and you’re done!!!

The way I chose to do it makes for less code on the developer’s side, and also allows menu items to be updated dynamically when a user adds a new page, deletes and old one, updates a pages name, or changes the order. While I appreciate WP’s addition of the wp_page_menu() function, I wish they would add the options to specify what item the class is attached to (list item or link), as well as the option to specify your own class name in place of “current_page_item.” I hope someone else finds this to be useful. As always I encourage comments and discussion!

-Phenix

Over the last few years web-developers have written many articles about CSS and developed many useful techniques, which can save you a lot of time – of course, if you are able to find them in time. Below you’ll find a list of techniques we , as web-architects, really couldn’t live without. They are essential and they indeed make our life easier. Let’s take a look at 53 CSS-based techniques you should always have ready to hand if you develop web-sites. Links checked: June/11 2008.

You might want to take a look at the article Powerful CSS-Techniques For Effective Coding.

1. CSS Based Navigation

2. Navigation Matrix Reloaded

3. CSS Tabs

4. CSS Bar Graphs (CSS For Bar Graphs)

5. Collapsing Tables: An Example

6. Adam’s Radio & Checkbox Customisation Method

7. CSS Image Replacement

8. CSS Shadows (CSS Shadows Roundup)

9. CSS Rounded Corners Roundup (Nifty Corners)

10. Drop Cap – Capital Letters with CSS

11. Define Image Opacity with CSS

12. How to Create a Block Hover Effect for a List of Links

13. Pullquotes with CSS (Automatic Pullquotes with JavaScript and CSS

14. CSS Diagrams

15. CSS Curves

16. Footer Stick allows for the footer of a Web page to appear either at the bottom of the browser window or the bottom of the Web page content – whichever is visually lowest.

17. CSS Image Map

18. CSS Image Pop-Up

19. CSS Image Preloader

20. CSS Image Replacement for Buttons

21. Link Thumbnail

22. CSS Map Pop

23. PHP-based CSS Style Switcher

24. CSS Unordered List Calender (CSS Styled Calender)

25. CSS-Based Forms: Techniques

26. CSS-Based Tables: Techniques

27. Printing Web-Documents and CSS

28. Improved Links-Display for Print-Layouts with CSS

29. CSS-Submit Buttons

30. CSS Teaser Box

31. CSS Tricks for Custom Bullets

32. Ticked Off Links Reloaded

33. CSS Zooming

34. Creating a Star Rater using CSS

35. The ways to style visited Links

36. PDF, ZIP, DOC Links Labeling

37. Displaying Percentages with CSS

38. Image Floats without the Text Wrap

39. Let visitors decide, whether or not will they open link in a new window

40. Simple accessible external links

41. Zebra Table with JavaScript and CSS

42. Vertical Centering with CSS (Horizontal and Vertical Centering with CSS

43. Unobtrusive Sidenotes

44. Image Caption with CSS (Styled Images with Caption)

45. Dynamic Piechart with CSS

46. Format Footnotes with CSS

47. Hierarchical Sitemap with CSS

48. Snook’s Resizable Underlines

49. Switchy McLayout: An Adaptive Layout Technique

50. StyleMap: CSS+HTML Visual Sitemap

51. Custom Reading Width

52. CSS Alert Message

53. CSS Production Notes

Compliments of Smashing Magazine!

Hope they get this fixed soon!

-Phenix

P.S. This is why they need to hire me!!!

UPDATE————————————————————————————————————————————————————-

As of around 4:54pm EST it looks like they got everything fixed!

-Phenix

First of all, to keep things clean and simple I created a “custom_functions.php” file in the root of the site’s theme folder to hold this function and all other functions you may need outside of the core WP functions. To make this file work, I added the following line of code to the bottom of the”functions.php” file in the /wp-content/themes/theme_name/ directory.

include ‘custom_functions.php’;

Now you can add your custom functions until your heart is content!

The existing site’s main pages has sections to list the current news and events. Here’s a snapshot of the area in question:

Even though you can’t tell from this image, the Events date reads “Today” when the events date is on the current day. This isn’t a feature native to WPMU. There are plugins that do similar things, but I figured a custom function for this would be simple and fun! First off, here’s my custom loop for the “Calendar of Events” section (keep in mind, some of this is specific to this sites CSS):

<!– Events Ticker Loop by: Joe–>

<!–  Get 5 posts from the “News” category if they exist –>

<?php query_posts(’category_name=Events&showposts=5′); ?>

<?php if (have_posts()) : ?>

<?php while (have_posts()) : the_post(); ?>

<!– Display the Date  as abreviated month and day –>

<h3><?php rel_date(); ?></h3>

<!–  Display posts as Post “titles” as permalinks –>

<DIV class=”post” id=”post-<?php the_ID(); ?>”>

<p class=”title”><a href=”<?php the_permalink() ?>” rel=”bookmark” title=”Permanent Link to <?php the_title_attribute(); ?>”><?php the_title(); ?></a> | <?php echo get_post_meta($post->ID, ‘event_time’, true).”<br />”.get_post_meta($post->ID, ‘event_place’, true); ?></p>

<?php wp_link_pages(array(’before’ => ‘<p><strong>Pages:</strong> ‘, ‘after’ => ‘</p>’, ‘next_or_number’ => ‘number’)); ?>

</DIV><!– post –>

<?php endwhile; endif; ?>

</ul><!– events_nav –>

</div> <!– events –>

</div><!– right container –>

<!– End Events Ticker Loop by: Joe–>

The highlighted line shows the custom function call rel_date().  Here’s the code for the function:

function rel_date () {

$actual_date = date(’F j Y’);

$full_post_date = get_the_time(’F j Y’);

$short_post_date = get_the_time(’M j’);

$today = ‘Today’;

if ($full_post_date === $actual_date) {

echo $today;

} else {

echo $short_post_date;

}

}

This function stores the current date (Month, Day, and Year for mat) in a variable called $actual_date using the native PHP function date(), the date of the current post in the $full_post_date variable, the short version of the current posts’ date in the $short_post_date variable, and the string “Today” in the $today variable. Next the function compares the string values stored in the $full_post_date and $actual_date variables to see if they are equal. If they are, the function returns “Today”, if not it returns the abbreviated date of the post (Aug 30). Here’s a screen shot of the function in action:

I’ll follow with posts explaining some of the other custom bits in the “Events Ticker” code at a later date. Hope you enjoy!

-Phenix

<?php query_posts(’category_name=special_cat&showposts=10′); ?>

<?php while (have_posts()) : the_post(); ?>

<!– Do special_cat stuff… –>

<?php endwhile; ?>

This isn’t just some thrown together code from a lonely developer, it’s the actual snippet from the official WP Codex. I however have never been able to get it to work. No matter what I substitute in for “category_name“, I get all posts. I normally just modify this a little and use:

<?php query_posts(’cat=cat_id&showposts=10′); ?>

<?php while (have_posts()) : the_post(); ?>

<!– Do special_cat stuff… –>

<?php endwhile; ?>

Where “cat_id” is set to the numeric category ID stored int he MySQL DB. This proves to be cumbersome for anyone who doesn’t have direct access to the DB. One way to find out the category ID without DB access is to view the source of a page within a browser and look for the ID there (provided your WP Loop is set to display categories). The use of the “special_cat” tag is suppose to enable the use of the category “slug”, or textual short name for the category (ie. the “News” category might have a slug of “news”). You can find the category slug when editing the category from the admin interface. The us eof the “slug” over the “ID” is much more convenient to most users. I have found a little more modification of the loop from the Codex offers a solution (have tested this on a WP 2.8 & WPMU 2.7.1 install, please let me know if there are potential problems I’m missing by using this):

<?php query_posts(’category_name=cat_slug&showposts=num_posts‘); ?>

<?php if (have_posts()) : ?>

<?php while (have_posts()) : the_post(); ?>

<!– Code for Post Display –>

<?php endwhile; endif; ?>

Where “cat_slug” is equal to the Category Slug, and “num_posts” is equal to the number of posts from that category you want to display.

Because I normally hate people that just leave an example with “<!– Code for Post Display –>” rather than actually showing me what goes in there, I’ll give you an example of this modified loop used within a page:

<?php query_posts(’category_name=News&showposts=5′); ?>
<?php if (have_posts()) : ?>
<?php while (have_posts()) : the_post(); ?>

<!– Begin Code for Post Display –>

<DIV class=”post” id=”post-<?php the_ID(); ?>”>

<h1><a href=”<?php the_permalink() ?>” rel=”bookmark” title=”Permanent Link to <?php the_title_attribute(); ?>”><?php the_title(); ?></a></h1>

<DIV class=”entry”>

<?php wp_link_pages(array(’before’ => ‘<p><strong>Pages:</strong> ‘, ‘after’ => ‘</p>’, ‘next_or_number’ => ‘number’)); ?>

</DIV>

</DIV>

<!– End Code for Post Display –>

<?php endwhile; endif; ?>

This modified WP Loop displays 5 posts form the “News” category, Titles only that link to the actual individual post page, and pagination showing if more than 5 posts exist. I hope this helps someon out in the future! Please leave feedback of others possibilities to obtain this same feature, your troubles, or links to your site where you use something similar.

-Phenix

A theme framework is a theme that is designed to be a flexible foundation that can serve as a parent theme for building child themes. The use of WordPress theme frameworks may ease theme development by reducing the volume of work which may be needed in creating a backbone for your theme (usually by using PHP and WordPress Template Tags). Theme frameworks also make theme development more accessible, removing the need for programming knowledge. I listed here the best WordPress theme frameworks available  to help get started with WordPress theme developing.

1.Thematic, A WordPress Theme Framework

Thematic is a free, open-source, highly extensible, search-engine optimized WordPress Theme Framework featuring 13 widget-ready areas, grid-based layout samples, styling for popular plugins, and a whole community behind it. It’s perfect for beginner bloggers and WordPress development professionals.

Preview live demo

2. Hybrid WordPress Theme Framework

Amazing WordPress theme framework, definitely one of my favorite. Here is short list what You archieve from this framework:

I’ll just give you the short list instead, so you can go ahead and play with the theme:

• Developed with child themes in mind, so you’ll never lose your customizations.
• SEO optimized. No need for plugins to handle this anymore.
• Theme options that are about content/information.
• Templates for everything.
• 13 page templates.
• Actively developed for WP 2.7 but backward compatible down to 2.5.
• 15+ plugins supported within the theme.
• Attachment handling like you’ve never experienced.
• Advanced breadcrumbs beyond any other theme.
• Ability to run just about any type of site.
• And over 20 tutorials to start.

Preview live demo

3.Carrington – CMS theme framework for WordPress

Carrington is a CMS theme framework for WordPress that makes it easy to create unique looks for different categories, posts and comments just by creating custom templates. Framework with full documentation, community forums to have Your problems explained, very friendly!

Preview live demo

4.Vanilla Theme

Vanilla’s key boast is this: Exceptional power and freedom for designers, without (or barely) needing to know or touch PHP. Thanks to the combined capabilities of PHPTAL templates, Carrington’s atomic templates, YUI CSS and full widgetization (including custom widget controls).

Lovely framework released under code.google.com section where several frameworks is combined together – definitely worth checking out!

Preview live demo

5.Whiteboard – A Free Wordpress Theme Framework

It is designed to speed up the process of designing and coding a Wordpress theme by eliminating the time spent on Wordpress’ back-end PHP that is used in every theme.

Whiteboard is clean, noted, and compact (only 76KB in size – unzipped!). It includes all the standard PHP tags and PHP files needed for a Wordpress theme – plus a few extras.

6. WP Framework – A blank WordPress Theme Framework

WP Framework is a blank WordPress theme framework, which aims to cut down on your theme development time. It gives you a solid theme foundation to build your project on top of so you can focus on project-specific features right from the git-go.

7. SandBox

The Sandbox is a powerful tool available for WordPress theme designers and developers. The Sandbox can be easily designed just with CSS, so beginners will feel comfortable not bothering with PHP.

Experienced developers and designers can accomplish almost anything with minimal work, thanks to the rich, semantic markup and profusion of classes dynamically generated by the Sandbox.

8. OnePress Community Framework

The OnePress framework is an integrated website and forum solution. It is, simply, a WordPress theme to serve as the foundation and framework for your web site and online community. Leveraging the powerful WordPress and phpBB projects, OnePress provides a set of features focused on helping you build and maintain your site from the inside out. With this set of tools, you can easily run your community and do so with professional presentation.

9. The WordPress Starter Theme Project

And here are some of the features of WPcandy starter theme:

• Blank style.css with theme name, author, URL, etc. tags at the top
• Content-ready 404, archive, search, index, single post, and page files
• Full, working comments.php file
• Complete header.php set up with links to RSS, a stylesheet, and JS file; <title> template
• Default search form template
• Blank screenshot.png file and images folder

Several child themes and resources:

Junction WordPress Child Theme

Junction is a WordPress Child Theme based on the Thematic Theme Framework. In terms of style, Junction is vastly different from Thematic, however Junction capitalizes on the power of the Thematic Framework, which allows the ability to style the entire template without touching a single line of original php or html code.

Thematic Child Themes

Thematic offers a bunch of child themes, I featured one of them, but You should check this site for Yourself, actually I suggest You to subscribe to this site if You’re serious about WordPress theme developing.

Acamas Wordpress Child Theme

Acamas is a Thematic Themelet. That means Acamas requires the Thematic Theme Framework installed in your WordPress theme directory. Thematic powers Acamas. And Acamas builds on the power of Thematic. But don’t worry! Thematic is free. Even better, it’s open-source and one of the most advanced SEO WordPress themes around. Download Thematic now and set your blog on a rock-solid foundation for success.

Preview live demo

See Original Article for more info.

-Phenix

 

As a web developer, you can broaden your potential client base and add value for existing clients by listing ‘Wordpress’ as an area of expertise. Of course, unless you want to bluff your way through jobs, you’d better have the skill to back-up that claim. This collection will help.

See original article here.

 

 

Wordpress Basics

1. Unraveling the Secrets of the comments.php File

Nettuts+ author Gilles Maes has written an in-depth overview of the comments.php file and how to make the most of the template.

2. How to Become a Wordpress Developer

iThemes has a tutorial on how to become a Wordpress developer. The article covers development tools, best plugins, suggestions for getting clients, and more.

3. Multiple Wordpress Installations Using a Single Database

Streamline your Wordpress set-up by installing multiple instances of Wordpress on the same database.

Theme Tutorials

4. How to Create a Wordpress Theme from Scratch

Nettuts+ author Sam Parkinson gives a thorough overview of how to make your own custom theme from scratch, complete with source code.

5. So You Want to Create Wordpress Themes, Huh?

A lengthy and thorough series of tutorials covering nearly every aspect of Wordpress theme development. A must-read for beginners.

6. WordPress for Designers: Video Series

Drew Douglass will teach us, using easy to understand screencasts, exactly how to design for WordPress.

7. Wordpress Theme Hacks

A collection of simple Wordpress hacks that you’ll find yourself reusing all the time when working with themes.

8. Designing for Wordpress Screencast

CSSTricks has an excellent 3-step screencast that starts with the basics of solid theme design (step 2 and step 3).

9. Turning a Web Template Into a Wordpress Theme

Instead of using one of the many standard Wordpress themes, you could convert a web template into a Wordpress theme with this video tutorial.

10. Wordpress CSS Guides

A slightly-dated but still useful guide on how to alter the CSS on default themes to create your own personalized theme.

11. How to Create a Wordpress Theme in 5 Minutes

Bothack has a quick-n-dirty rundown on how to create your own Wordpress theme in 5 minutes.

12. Mastering Wordpress Theme Hacks and Techniques

Nuope has a 4-part series on Mastering CSS, one of which is how to master Wordpress theme hacks.

13. Blog Posts in Different Columns

If you’re wanting a little more advanced look and feel to your blog, try setting the posts to display in different columns.

14. Adding Tabs to Your Theme’s Sidebar

Here’s a quick hack that adds tabs to your sidebar using Yahoo! Tab View.

15. Category Styling

This tutorial shows how to add messages in the theme for posts in a certain category using CSS.

16. Multiple Page Layouts in a Single Template

If you’re looking for a more diversified template for sub-pages in a template, check out this quick tutorial for mutiple page layouts in a single template.

17. Rounded Corner Tab Menus

Rubique has a quick tutorial on how to use CSS to make rounded corners for your Wordpress menus.

18. Dynamic Classes or ID’s

Elliot Jay Stocks as a useful tutorial on how to apply a dynamic body class or ID to your templates, for styling purposes.

19. Formatting Images for Feed Readers

How to make sure your images are looking good in many of your blog follower’s favorite medium: the feed reader.

20. How to Highlight Author Comments in Wordpress

Google blogger Matt Cutts offers some advice on how to style your author comments differently than the rest of the reader comments.

21. Customizing Widgets Using CSS

Widgets are a great way to quickly add information to your layout (namely the sidebar). Here’s a tutorial onhow to style the widgets using CSS.

22. Using Sliding Doors with Wordpress Navigation

The Sliding Doors technique is a great way to utilize CSS and background images to make tabbed navigation. WPHacks shows us how to utilize Sliding Doors to enhance Wordpress navigation.

23. Wordpress Categories in a Horizontal Drop-down Menu

How to use CSS and Javascript to make a horizontal drop-down menubar.

24. Separate Comments from Trackbacks

It’s a good idea to separate trackbacks from your comments.

25. Creating a Widget Ready Footer

There’s a trend for blogs to have footers that feature columns of extra information. Learn how to create awidget-ready Wordpress footer.

26. Make a Featured Post Carousel

Many blogs use a featured post carousel to show recent posts or flagship content. Learn how to create this nifty feature with Nettuts+ author James Lao.

27. How to Lay Text Over Images

Add a little flair to your blog and add some text to your flagship images by only using Wordpress custom fields.

28. The Date/Image Hack

Interesting tutorial on how to combine a combination of images, CSS and Wordpress hooks in order to graphically display the date of the published post.

29. Dynamic Sticky Pages

Learn how to dynamically make posts stay on top longer in category and archive listings using multiple loops.

Plugins

30. Your First WP Plugin

Mark Jaquith has a short-and-sweet screencast on how to create your first Wordpress plugin in under 5 minutes.

31. How to Write a Simple Wordpress Plugin

A step-by-step guide to a simple and fun Wordpress plugin.

32. Screencast on Writing a Wordpress Plugins

If you’re rather see a visual demonstration of how to write a Wordpress plugin, look no further than the Weblog Tools Collection screencast.

The Backend

33. Custom Write Panels in the Wordpress Backend

Design blog WeFunction shows us how to create extra write panels for adding extra bits to the “Write” page of the admin area.

34. Wordpress as a CMS

Wordpress isn’t just a blogging tool, it can also be a CMS with the help of some plugins and theme retooling.

35. Exporting Wordpress Data

Learn how to import and export your Wordpress posts and comments with this handy screencast.

Miscellaneous

36. Embedding Wordpress into OS Commerce

OS Commerce is a popular open source ecommerce shopping script that many web developers use to sell goods. Here’s a tutorial on how to embed a Wordpress blog into an OS Commerce installation.

37. Creating An Automatic Sitemap

Sitemaps help users navigate the site, as well as allow search engines to have quick access to all of your blog’s pages. Here’s a tutorial on how to create an automatic sitemap for your Wordpress installation.

38. Build a Dynamic Design Portfolio

A terrific guide on how to utilize the query_posts tag to create a design portfolio with Wordpress.

39. Create a User Contributed Link Feed w/ Wordpress Comments

If you’re wanting to add a Nettuts+ style link feed, Collis has an excellent tutorial on how to utilize Wordpress comments to create the feed.

40. A Wordpress-Powered Membership Directory

WPDesigner shows us how to create a membership directory using a standard installation of Wordpress and some customization.

41. Remove Categories in the Wordpress Loop

Sometimes excluding certain posts in categories from showing in the Wordpress loop is important. Here’s a quick tutorial with sample code on how to exclude certain categories in your templates.

42. Add a Twitter Field to your Form

How to install the twitip-id plugin to include a field for commenters to leave their Twitter ID.

43. Enabling HTTPS for Wordpress.com Blogs Screencast

The Wordpress team has put together a how-to video on enabling HTTPS on Wordpress.com blogs.

44. How to Add Photo Captions

Good photo captions aren’t that something that Wordpress themes usually come with out of the box. This screencast shows how to correctly add photo captions into your posts.

45. Make a Random Post Button

Adding a random post button is only a SQL query and PHP snippet away.

46. RSS-Only Posts

This tutorial shows you how to create posts that only appear in RSS feeds, in hopes to improve RSS subscriber counts.

47. Wordpress SEO

Yaost has a lengthy tutorial on how to squeeze the most SEO out of your Wordpress blog.

48. Learn How to Make Your Blog Accessible

Most blogs don’t conform to WAI/WCAG standards in terms of accessibility. Learn how to meet these standards with Bruce Lawson’s accessibility hacks.

49. Definitive Guide to Semantic Web Markup for Blogs

Although not strictly a Wordpress tutorial, Chris Pearson’s guide to semantic web markup for blogs is a must-read for anyone wanting to maximize their results in search engines.

50. Digg-proof Your Wordpress

Learn how to configure MySQL, Apache and other things to keep your site humming when it lands on the front page of Digg.

WP Framework is a blank WordPress theme framework, which aims to cut down on your theme development time. It gives you a solid theme foundation to build your project on top of so you can focus on project-specific features right from the git-go.

Reading over the information on his pages about the WP Framework, it certainly looks very promising for the future of WP Theme development. Having used the MVC (Model, View, Controller) approach of several PHP and Ruby frameworks, I can only imagine how great this tool will be. I think I will wait until the WP Framework project is a little further along (mainly for more documentation) before I approach it for review. 

Ptah is 21 year old web developer, entrepreneur, and founder of Design by Craftsmen, a web creative studio specializing in custom WordPress solutions. He currently resides in Atlanta, Georgia and is slowly expanding his team at DBC. I personally encourage all WP developers to keep themselves up to date on Ptah’s work with WP Framework and help him make WP a better platform for the future. Read about his efforts:

Ptah’s personal Blog:

http://ptahdunbar.com/

WP Framework Blog:

http://wpframework.com/

Ptah on Twitter:

@ptahdunbar

@wpframework

Can’t wait to see what is to come.

-Phenix

-Phenix

Web applications have made huge leaps and bounds in improving user experience thanks to a lot of recently developed Ajax technology. When you combine some neat functionality courtesy of PHP with the cleverness of javascript you can produce some pretty cool results. In an effort to help you take it up a notch, we’d like to share some methods for helping your site anticipate a user’s next move.

The list below is made up of the best 20 FREE PHP Components and Tutorials that you will likely need in many of your projects, they are all of the highest quality and more or less easy to configure. Give them a try.

LINK

Found on Digg this morning, enjoy!

-Phenix