How to Make a Blog Post Have a Calendar for the Date in WordPress
- 1). Open your WordPress dashboard and navigate to the file "Editor" found under the "Appearance" section.
- 2). Upload the calendar icon image that you would like to use for your icon background. These can be found online by searching for "Calendar icons." .JPG and .PNG images work equally well.
- 3). Add the following code to your single.php and index.php files: 1 <div class="postdate">
2 <div class="postmonth"><?php the_time('M') ?></div>
3 <div class="postday"><?php the_time('d') ?></div>
4 <div class="postyear"><?php the_time('Y'); ?></div>
5 </div> - 4). Open your Stylesheet (style.css) and add the following (or similar) text:
1 .postdate {
2 float: left;
3 display: inline;
4 margin: 5px 10px 0 0;
5 padding: 2px 0 0 0;
6 background: url(img/date_img.png) no-repeat;
7 width: 60px;
8 height: 70px;
9 text-align: center;
1 .postmonth {
2 color: #FFF;
3 font-size: 11px;
4 text-transform: uppercase;
5 font-family: Arial, Helvetica, sans-serif;
6 padding: 2px 0px;
7 }
1 .postday {
2 color: #333;
3 font-size: 24px;
4 font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
5 padding: 3px 0px;
6 }
1 .postyear {
2 2 color: #333;
3 font-size: 11px;
4 font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
5 padding: 2px 0px;
6 }
Source...