wordpress 自定义_如何为WordPress创建自定义日期按钮

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.

在使博客脱颖而出时，博客作者经常忽略的一件事是日期按钮。 诸如自定义日期按钮之类的简单操作实际上可以对您博客的设计产生影响。 因此，在本文中，我们将向您展示如何为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:

您需要做的第一件事是打开style.css文件并添加如下内容：

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

.datebg {
背景：url(images / datebg.gif)不重复；
高度：173px；
宽度：173px；
}
。天{
}
。月{
}

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.

现在，您可以按自己喜欢的方式对其进行样式设置，还可以更改类的名称。 然后，您需要打开index.php和single.php 。 并在模板适合的位置添加以下代码。

<div class="datebg">
<div class="month"><?php the_time(’M’) ?></div>
<div class="day"><?php the_time(’d’) ?></div>
</div>

<div class =“ datebg”>
<div class =“ month”> <？php the_time('M')？> </ div>
<div class =“ day”> <？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.

确保更改样式以适合您的需求。 现在，您应该有了一个自定义的日期图像。 您还可以参考WordPress Codex了解更多信息。

翻译自: https://www.wpbeginner.com/wp-tutorials/how-to-create-a-customized-date-button-for-wordpress/

wordpress 自定义