ブログカード

<article>
    <img src='サムネ画像URL'>
    <div class='day_area'>
        <p><?php echo get_the_date( 'Y' ); ?><?php echo get_post_time( 'D' ); ?></p>
        <p><?php echo get_the_date( 'm.d' ); ?></p>   ※0がつかないほうがいいときは m->n , d->j
    </div>
</article>

article {
    position: relative;
}
img {
    border-radius: 12px;
}
.day_area {
    position: absolute;
    top: 0;
    left: 0;
    width: 70px;
    height: 70px;
    background: #fff;
    border-radius: 0 0 12px 0;
    padding-top: 15px;
    text-align: center;
}
.day_area:before,
.day_area:after {
    position: absolute;
    display: block;
    width: 10px;
    height: 10px;
    background: url('白い角丸の画像');
    background-size: cover;
}
.day_area:before {
    top: 0;
    right: -10px;
}
.day_area:after {
    bottom: -10px;
    left: 0;
}
.day_area p:nth-of-type(1) {
    color: darkorange;
    font-size: 12px;
    line-height: 1;
}
.day_area p:nth-of-type(2) {
    color: darkorange;
    font-size: 20px;
    line-height: 1;
}