Note: I’m posting this for myself so that I can refer to it in the future.

$cat_id =get_cat_id('Uncategorized');
$query = new WP_Query('cat='.$cat_id.'&year='.$year.'&monthnum='.$month.'&day='.$day);
$image = false;
while ( $query->have_posts() )  {
    $query->the_post();
    the_title();
    $image = wp_get_attachment_image_src(get_post_thumbnail_id($query->ID));
    echo '<a href="'.$image[0].'">';
}

More here for wp_get_attachment_image_src
Related: get_post_thumbnail.

Using Skeleton (http://www.getskeleton.com), I managed to come up with a “minimized” WordPress theme.

What is Skeleton?
Skeleton is a small collection of CSS & JS files that can help you rapidly develop sites that look beautiful at any size, be it a 17″ laptop screen or an iPhone. More here…

My workflow

1. Design a layout (Photoshop, etc.). You can use the template found in /templates or download it from http://getskeleton.com/#download
2. Convert the layout into HTML
3. Convert the HTML file into a WordPress theme

This theme will come in handy in Step 3. For example, you define the grid layout, columns, text colors, fonts, spacing, etc. yourself.

* Since most of the WordPress theme I created have a horizontal navigation bar, I have included the CSS for #access in style.css
* Also added the image CSS (align right, left, etc) by default.
* This also contains the default CSS for Skeleton.
* When adding images, do not set a specific image size. You can however use percentage.

You can download the theme here: https://github.com/wenbert/Ekini-WP-Skeleton.

Disclaimer: This is a work in progress.

Comments / suggestions are encouraged!

Found this little gem in Stackoverflow.

$(function() {
    $("img")
        .mouseover(function() { 
            var src = $(this).attr("src").match(/[^.]+/) + "over.gif";
            $(this).attr("src", src);
        })
        .mouseout(function() {
            var src = $(this).attr("src").replace("over", "");
            $(this).attr("src", src);
        });
});

Thanks to Jarrod Dixon.

Here is another simpler version.

$(".icons_inner img").hover(
      function(){this.src = this.src.replace("_off","_on");},
      function(){this.src = this.src.replace("_on","_off");
});

You just have to name you email images as “my_icon_on.png” and “my_icon_off.png”. I find this version a lot simpler to implement and debug. Source.

The example shows that I sort posts with custom field “Start Date”. I am using ‘meta_query’ to query the custom fields – you can find out more here.

$args['post_type'] = array('ur_post', 
    'programs_post', 
    'education_post', 
    'blog_post'
);
$args['meta_key'] = 'Start Date';
$args['meta_query'] = array(
    array(
        'key' => 'Start Date',
        'value' => date('Ymd'),
        'compare' => '>=',
        'type' => 'date'
    )
);
 
/*This will sort. Make sure there is no underscore. It's orderby NOT order_by.*/
$args['orderby'] = 'meta_value'; 
 
$args['order'] = 'asc';
$the_query = new WP_Query($args);
 
while ( $the_query->have_posts() ) {
    $the_query->the_post(); 
    $start_date = get_post_custom_values('Start Date', $the_query->ID);
 
    /*var_dump($custom_values);*/    
    if (date('Ymd',strtotime($start_date[0])) >= date('Ymd')) {     
        echo '<div class="event_date">';
        //display date here...
        echo '</div>';
 
        echo '<div class="event_post_time">';
        $start_time = get_post_custom_values('Start Time', $the_query->ID);
        echo $start_time[0];
        $end_time = get_post_custom_values('End Time', $the_query->ID);
        if ($end_time != NULL) {
            echo ' - '.$end_time[0];
        }
        echo '</div>';
    }
}
wp_reset_postdata();

Someone (bradgessler) in HN made a very good comment in this thread.

I’m just going to copy-paste everything. Source.

The biggest problem with today’s REST implementations is that they’re essentially a database serialization layer. Consider how a RESTful Rails model is typically represented as:

  {
     book: {
        id:1,
        name:"To Kill a Mocking Bird",
        author_id:2
     }
  }

How do you get more info on the author if you only have this piece of information? Rails/ActiveResource guesses through convention: “/authors/2″, but that might not be the case, which makes this approach very brittle.
A better more “RESTful” approach might be:

  {
     book: {
        href:"/books/1",
        name:"To Kill a Mocking Bird",
        author: {
           href:"/authors/2"
        }
     }
  }

The REST client would then be able to traverse the representation without making guesses at the URL, and if the end-point of ‘/authors:id’ changes for whatever reason, the href would be updated accordingly.
Pagination/large data-sets could be solved as well:

  {
     books: [
        href:"/books/1",
        name:"To Kill a Mocking Bird",
        author: {
           href:"/authors/2"
        }
     }
    ],
    rel: {
       prev: "/books?page=1",
       next:"/books?page=3"
    }
  }

… and a bajillion other common RESTful API problems through better convention.
I’d agree with the author that REST is misunderstood, but my opinion is that its misunderstood on the grounds that today’s “REST” implementations are lame database serializations. The web has been doing this since the <a href/> tag was conceived, but for some reason, modern REST implementations left this out.

Okay, I just spent a few days coming up with new look for the blog. It is based on the WordPress + Blueprint Barebones/Skeletal (or whatever you call it) theme. This is still a work in progress and if you find bugs/errors, post a comment or contact me

Although, there are more advanced multi-language plugins like qTranslate available, this post will deal with basic translations in your theme. Like for example, if you want to translate a “hard-coded” English strings in your theme.

<h1>Programs</h1>

… translated into French, will display:

<h1>Programmes<h1>

when you have something like http://mysite.com?lang=fr_FR in your URL bar.

Start easy
Let’s start with the simple string above. Instead of directly outputting the string, do it like this:

<?php  
    echo '<h1>'.__('Programs').'</h1>'
?>

So, what does the double underscore (“__”) mean? The double underscore is a GetText call. There are two ways you can do a GetText call, the other way is:

    _e('Programs'); //This echoes the directly to the browser.

We use the GetText call to output the translated strings.

The translated strings
The translation are stored in a .pot file. It is a text file that looks like this:

msgid ""
msgstr ""
"Content-Type: text/plain; charset=utf-8n"
"Content-Transfer-Encoding: 8bitn"
"Project-Id-Version: n"
"POT-Creation-Date: n"
"PO-Revision-Date: n"
"Last-Translator: wenbert n"
"Language-Team: n"
"MIME-Version: 1.0n"

#: single.php:21
msgid "Programs"
msgstr "Programmes"

#: single.php:30
msgid "Contact Us"
msgstr "Contactez-nous"

You can choose to generate this file manually or use this to extract the GetText calls in your PHP files.

Generating the .mo (Machine Object) file
Once you have all the string translations in your .pot file, you will need to generate a .mo file for it. You will need POEdit to do this. It is a simple and straight forward program. You just need to import the POT file and then save it.

Save all of your files inside the “languages” folder inside your theme folder.

/mytheme/
    .. index.php
    .. single.php
    ..archive.php
    ..page.php
    /languages
        ..fr_FR.mo
        ..fr_FR.po
        ..fr_FR.pot

Triggering the translation
Put this code in your functions.php file.

add_filter( 'locale', 'my_theme_localized' );
function my_theme_localized($locale) {
    if (isset($_GET['lang'])) {
        return $_GET['lang'];
    }
    return $locale;
}
 
load_theme_textdomain( 'my_theme', TEMPLATEPATH . '/languages' );

What it does is that if $_GET['lang'] is set in the URL — and let’s say the value is set to “fr_FR” (http://mysite.com?lang=fr_FR), WordPress will look for the “fr_FR.mo” file.

Please note that this post tackles the subject in a VERY rough way. You should read further here and here — both sites were used as reference for this post!

I am posting this for myself and for my brother, John (haha).

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
</head>
<body>
<style type="text/css">
.Example_F {
 -moz-box-shadow: 0 0 5px 5px #888;
 -webkit-box-shadow: 0 0 5px 5px#888;
 /*box-shadow: 0 0 5px 5px #888;*/
 box-shadow: 0 0 5px 5px  rgba(0, 0, 0, 0.1);
 } 
</style>
<div class="Example_F">
This is a test! We use this!
</div>
</body>
</html>

Source: http://www.css3.info/preview/box-shadow/

It has become my habit that when designing a website, I always use the template that comes with the BlueprintCSS download. I always make sure that my design “fits” BlueprintCSS.

I am sharing my WordPress-BlueprintCSS Skeletal Theme. The theme is empty – you have to modify it to fit your design. It is also easy to modify because I have set the file templates to something like this:

<?php get_header(); ?>
<div class="container ">
    <div class="span-17" id="content">  
        <?php
                get_template_part( 'loop', 'index' );
        ?>
    </div>
    <div class="span-7 last">
        <?php get_sidebar(); ?>
    </div>
</div><!-- #container -->
<div class="container">
    <?php get_footer(); ?>
</div>

All the individual template files (page.php, index.php, single.php, etc.) are setup something like this. This way, it would be better because you will be able to specify the columns for each template.

Features

• Easy to update columns. Columns are specified in template files (single.php, index.php, category.php, author.php, etc.
• BlueprintCSS is located in /css/blueprint
• Easily add your custom CSS in style.css
• Based on the Twenty Ten theme
• No images
• Only the Menu and Image CSS is included in style.css – I think this is useful
• The left side has 17 columns while the right side has 7 columns.

Download and Installation

1. Download in Github https://github.com/wenbert/Wordpress-and-BlueprintCSS
2. Extract to your /theme directory
3. Enable the theme.

Please note that this is a work in progress. I encourage you to post your comments / suggestions below…

Screenshot:
. Vista

For my personal consumption.