Code Explosion – Week 5

Posted on: November 18th, 2011

Yes, it’s that time of the week. The time when you are furiously finishing projects for the week…or hunkering down and prepping for a weekend coding fest. Either way, here are a few snippets that may help you as you go forth and conquer.

WordPress

When using multiple loops on the same WordPress page, it is important to not show duplicate posts, especially if you have one section that is three posts wide (your featured articles), and one section with one post set at full width (other, less awesome articles). In order to prevent duplicate posts, toss this into your first and second loop.

<?php
     $ids = array(); /*creates the array*/
     query_posts('showposts=3'); /*shows 3 most recent posts */
     if (have_posts()) : while (have_posts()) : the_post();
     the_title();
?>

<?php 
       $ids[]= $post->ID; /*puts post ID's into $ids array */
       endwhile; endif;
?>

<?php
      /*Begin second loop*/
      query_posts("showposts=-1"); /*shows all posts*/
      if (have_posts()) : while (have_posts()) : the_post();
?>

<?php 
      /*don't go through the following loop for posts in $ids array*/
      if (!in_array($post->ID, $ids)) {?>

      <?php the_title();?>
 
      <?php } ?>

<?php 
      endwhile; endif;
?>

Variation of this.

Also in WordPress, check out this great Custom Fields post. The fields are coming in very handy as I develop two custom WordPress sites.
How to use WordPress Custom Fields

CSS

If you are a web developer of any kind, you should know that table layouts are pretty much sneered at by the web community (using tables for tabular data is fine, but not for full pages).

Yesterday I came across a great article about clears, and how we can axe the use of them. Clears, like tables, have their time and place, but shouldn’t be used just to fit a border all around your floated content. Instead, you can use this snippet.

/* make sure your container has a specific width set or you may run into issues */

#container {
      margin: 0 auto;
      width: 90%;
      overflow: auto; /* the link below talks about the other overflow modes, 
                                 but auto has worked best for me */
}

Clears should otherwise be used when you absolutely do not want things floating next to your div or similar element. Full article here.

If you have questions or comments, leave me one in the box below.

Video of the Week

Everything about this video is memetastic. Be sure to “get down” on Friday!

Tags: , , ,

previous post: Kinetic Typography – Part III next post: Fixing Sweepstakes Malware Virus