ThemeShaper Forums » Thematic

[closed]

Thematic Child Theme Post Date Calendar

(3 posts)
  • Started 3 years ago by cas
  • Latest reply from cas
  • This topic is not resolved
  1. Hi there - I could use some help looking over my working code to see if I'm doing this right - apologies in advance if I'm totally offending anyone with my copy-paste PHP skills.

    Goal: modify a child-theme of Thematic to make posts display the meta like the following:

    • Remove reference to the author (single author blog)
    • Modify the date to display the Day of the week, Month, Day and Year
    • Display the post date floated to the left of the Post Title and Content and styled
    • Leave the Category, Tag, Comments and Edit listings/links under the post, as normal

    Here's what I came up with:

    Researching the web, these forums, and especially this post -
    http://a.parsons.edu/~zeravivm/f09/osd/12/15/how-to-display-thematic-postmeta-information-in-a-different-location/

    I stuck this into my functions file to filter the thematic_postheader:

    // Pull the entry_meta into a calendar format

    function childtheme_postheader() {
    global $id, $post, $authordata;

    // Information in Post Header
    if (is_front_page() || is_single() || is_page() || is_category() || is_tag() || is_author() || is_date() || is_archive() || is_preview()) {

    $postmeta = '<div class="entry-meta">';
    $postmeta .= '<span class="entry-date"><abbr class="published" title="';
    $postmeta .= get_the_time('Y-m-d\TH:i:sO') . '">';
    $postmeta .= '<span class="post_date post_date_day_of_week">' . get_the_time('D') . '</span>';
    $postmeta .= '<span class="post_date post_date_month">' . get_the_time('M') . '</span>';
    $postmeta .= '<span class="post_date post_date_day">' . get_the_time('j') . '</span>';
    $postmeta .= '<span class="post_date post_date_year">' . get_the_time('Y') . '</span>';
    $postmeta .= '</abbr></span>';
    $postmeta .= "</div><!-- .entry-meta -->\n";

    $posttitle = '<div class="entry-title_box"><h1 class="entry-title">' . get_the_title() . "</h1></div>\n";
    } elseif (is_404()) {
    $posttitle = '<h1 class="entry-title">' . __('Not Found', 'thematic') . "</h1>\n";
    } else {
    $posttitle = '<h2 class="entry-title"><a href="';
    $posttitle .= get_permalink();
    $posttitle .= '" title="';
    $posttitle .= __('Permalink to ', 'thematic') . the_title_attribute('echo=0');
    $posttitle .= '" rel="bookmark">';
    $posttitle .= get_the_title();
    $posttitle .= "</h2>\n";
    }

    if ($post->post_type == 'page' || is_404()) {
    $postheader = $posttitle;
    } else {
    $postheader = $postmeta . $posttitle;
    }
    echo $postheader;
    }

    add_filter( 'thematic_postheader', 'childtheme_postheader' );

    Then styled it all as such:

    body {
    font-family: Frutiger, "Frutiger Linotype", Univers, Calibri, "Gill Sans", "Gill Sans MT", "Myriad Pro", Myriad, "DejaVu Sans Condensed", "Liberation Sans", "Nimbus Sans L", Tahoma, Geneva, "Helvetica Neue", Helvetica, Arial, sans-serif;
    color: #444;
    }

    #blog-title, .entry-title {
    font-family: Frutiger, "Frutiger Linotype", Univers, Calibri, "Gill Sans", "Gill Sans MT", "Myriad Pro", Myriad, "DejaVu Sans Condensed", "Liberation Sans", "Nimbus Sans L", Tahoma, Geneva, "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-weight: normal;
    }

    /* Post entry_meta date and title in calendar format */

    .entry-meta {
    float:left;
    display:inline;
    width: 60px;
    text-align:right;
    line-height:.95;
    border:1px solid #eee;
    margin:0 15px 20px 0;
    }

    .entry-meta span{
    display:block;
    }

    .post_date_day_of_week {
    font-size:150%;
    color:#ccc;
    padding:3px;
    }

    .post_date_day_of_week {
    font-size:110%;
    color:#aaa;
    }

    .post_date_month {
    font-size:175%;
    padding:0 3px;
    }

    .post_date_day {
    font-size:450%;
    font-weight:700;
    padding:0 3px;
    }

    .post_date_year {
    font-size:150%;
    background:#999;
    color:#eee;
    margin:2px 0 0 0;
    padding:3px;
    }

    .entry-title_box, .entry-content, .entry-utility {
    float:right;
    display:inline;
    width: 450px;
    }

    And it looks great:

    Screenshot (while logged in, thus the Edit link at the bottom): http://artbycas.com/images/post_date.png

    As far as I can tell, I got it to work the way I want to; I'm just not sure if the code I cobbled together from many different sources is written in the most efficient way possible - I could be totally butchering it. Any insights as to if there's a better way to do this are appreciated.

    Posted 3 years ago #
  2. hey that looks really nice. thanks for sharing!

    Posted 3 years ago #
  3. You're very welcome - I just hope I'm not writing bloated/unnecessary junk in the function, so consider the above Alpha if you use it.

    Posted 3 years ago #

RSS feed for this topic

Topic Closed

This topic has been closed to new replies.