Title: Styling the_date function
Last modified: August 20, 2016

---

# Styling the_date function

 *  Resolved [elkirkmo](https://wordpress.org/support/users/elkirkmo/)
 * (@elkirkmo)
 * [13 years, 10 months ago](https://wordpress.org/support/topic/styling-the_date-function/)
 * What I want to do is style every part of the date differently, i.e _Thursday_,
   August 2**nd**, But I’m not sure what the best way to do that is.
 * Currently I have: `<h2><span class="fancy"><?php the_time('l');?></span></h2>
   <h2><?php the_date('F jS');?></h2>`
 * I’m mostly interested in making the nd part of 2nd be small and up in the corner
   of the 2. Does anyone have any advice on this?

Viewing 6 replies - 1 through 6 (of 6 total)

 *  [Andrew Nevins](https://wordpress.org/support/users/anevins/)
 * (@anevins)
 * WCLDN 2018 Contributor | Volunteer support
 * [13 years, 10 months ago](https://wordpress.org/support/topic/styling-the_date-function/#post-2939395)
 * Can you show the HTML generated for the date?
 *  Thread Starter [elkirkmo](https://wordpress.org/support/users/elkirkmo/)
 * (@elkirkmo)
 * [13 years, 10 months ago](https://wordpress.org/support/topic/styling-the_date-function/#post-2939400)
 * `<h2><span class="fancy">Thursday</span></h2><h2>August 2nd</h2>`
 *  [Andrew Nevins](https://wordpress.org/support/users/anevins/)
 * (@anevins)
 * WCLDN 2018 Contributor | Volunteer support
 * [13 years, 10 months ago](https://wordpress.org/support/topic/styling-the_date-function/#post-2939402)
 * You can select through CSS the two date parts
    e.g
 *     ```
       h2 span.fancy { ... }
       ```
   
 * and
 *     ```
       h2 > span.fancy ~ h2 { ... }
       ```
   
 * If you’re still struggling to select them, you could add CSS it through jQuery.
 *  [Michael](https://wordpress.org/support/users/alchymyth/)
 * (@alchymyth)
 * [13 years, 10 months ago](https://wordpress.org/support/topic/styling-the_date-function/#post-2939403)
 * the time is already broken into two parts; break it into some more parts:
 * example:
 *     ```
       <h2>
       <span class="fancy"><?php the_time('l');?></span>
       <span class="fancy-month"><?php the_time('F');?></span>
       <span class="fancy-date"><?php the_time('j');?></span>
       <span class="fancy-suffix"><?php the_time('S');?></span>
       </h2>
       ```
   
 * [http://codex.wordpress.org/Formatting_Date_and_Time](http://codex.wordpress.org/Formatting_Date_and_Time)
 *  Thread Starter [elkirkmo](https://wordpress.org/support/users/elkirkmo/)
 * (@elkirkmo)
 * [13 years, 10 months ago](https://wordpress.org/support/topic/styling-the_date-function/#post-2939409)
 * I’ll try that, but when I did that before, it’d only display the first the_time
   and disregard the rest. Maybe I forgot a question mark or something.
 *  Thread Starter [elkirkmo](https://wordpress.org/support/users/elkirkmo/)
 * (@elkirkmo)
 * [13 years, 10 months ago](https://wordpress.org/support/topic/styling-the_date-function/#post-2939410)
 * Hot damn, it worked! Thanks, alchymyth!

Viewing 6 replies - 1 through 6 (of 6 total)

The topic ‘Styling the_date function’ is closed to new replies.

## Tags

 * [css](https://wordpress.org/support/topic-tag/css/)
 * [date and time](https://wordpress.org/support/topic-tag/date-and-time/)
 * [php](https://wordpress.org/support/topic-tag/php/)
 * [style](https://wordpress.org/support/topic-tag/style/)
 * [the_date](https://wordpress.org/support/topic-tag/the_date/)

 * 6 replies
 * 3 participants
 * Last reply from: [elkirkmo](https://wordpress.org/support/users/elkirkmo/)
 * Last activity: [13 years, 10 months ago](https://wordpress.org/support/topic/styling-the_date-function/#post-2939410)
 * Status: resolved

## Topics

### Topics with no replies

### Non-support topics

### Resolved topics

### Unresolved topics

### All topics