(+84) 463.28.7979

How to Create a Customized Date Button for WordPress


When making your blog stand out, one thing that bloggers often ignore is the date button. Something as simple as a customized date button can really make a difference in your blog’s design. Therefore in this article we will show you how you can create a customized date button for WordPress.

Custom Date Button for WordPress

We will start out from the image shown in the left, and will make it look like the one in the right.

You can use the image that we are using above if you so desire for your use, or create your own one.

First thing you need to do is open your style.css file and add something like below:

.datebg{
background: url(images/datebg.gif) no-repeat;
height: 173px;
width: 173px;
}
.day{
}
.month{
}

Now you may style it however you like, and you can also change the name of the class. Then you would need to open your index.php and single.php. And add the following code where your template fits.

<div>
<div><?php the_time(’M’) ?></div>
<div><?php the_time(’d’) ?></div>
</div>

Make sure you change the styling to fit your needs. Now you should have a customized date image. You can also refer to WordPress Codex for more information.

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>