Adding year to date circle

This is pretty difficult, because the design doesn’t account for the year in the circle. But, it’s all CSS (the design, I mean) so it’s easy to tweak.

First thing, I’d suggest you add the date to the byline “posted by … on (date)” so it’s obvious what year.

Look for reddle_posted_on and replace with something like:

function reddle_posted_on() {
	printf( __( '<span class="byline">Posted by <span class="author vcard">%3$s</span> on %4$s</span>', 'reddle' ),
		esc_url( get_author_posts_url( get_the_author_meta( 'ID' ) ) ),
		esc_attr( sprintf( __( 'View all posts by %s', 'reddle' ), get_the_author() ) ),
		esc_html( get_the_author() ),
		esc_html( get_the_date() )
	);
}

This adds the date to the output, after the author name.

Next, if you want to add the year to the circles …

1. Find 3 cases of <p class="date-link"> and add in the year:

<p class="date-link">" title="<?php echo esc_attr( sprintf( __( 'Permalink to %s', 'reddle' ), the_title_attribute( 'echo=0' ) ) ); ?>" rel="bookmark" class="permalink"><span class="month"><?php the_time( 'M' ); ?></span><span class="sep">·</span><span class="day"><?php the_time( 'd' ); ?></span><span class="year"><?php the_time( 'Y' ); ?></span></p>

2. Find “datestamps” area in your CSS file, and try something like this:

/* Datestamps */
.permalink .sep,
.permalink-sep {
	display: none;
}
footer .permalink,
.image-attachment #content footer .permalink {
	background: #000;
	border-radius: 50%;
	color: #eee;
	font-family: Georgia, "Bitstream Charter", serif;
	font-style: italic;
	line-height: 1;
	margin: 0 0 0 -27px; /* Shuffle the datestamp over half it's fixed width */
	position: absolute;
		top: -1.2em;
		left: -11.674008810573%; /* and position it on the edge of the fluid page  */
	text-align: center;
	width: 75px;
	height: 75px;
}
.secondary footer .permalink {
	left: -24.090909090909%; /* and position it on the edge of the fluid page  */
}
footer .permalink .month {
	display: block;
	font-size: 12px;
	padding: 10px 0 0;
}
footer .permalink .day {
	display: block;
	font-size: 18px;
	padding: 4px 0 0;
}
footer .permalink .year {
	display: block;
	font-size: 14px;
	padding: 4px 0 0;
}

Yay!