通常はこのような感じ

<div class="nav-links">
  <span class="nav-previous"><?= previous_post_link('%link', '古い記事へ'  )  ?></span>
  <span class="nav-next"    ><?= next_post_link    ('%link', '新しい記事へ')  ?></span>
</div>

それをこのように……

<div class="nav-links">
  <span class="nav-previous"><?= get_previous_post() ? previous_post_link('%link', '古い記事へ'  ) : '古い記事へ'   ?></span>
  <span class="nav-next"    ><?= get_next_post()     ? next_post_link    ('%link', '新しい記事へ') : '新しい記事へ' ?></span>
</div>

リンク先があるとリンクが張られますが、ない場合はリンクなしテキストが表示されます。

<div class="nav-links">
  <span class="nav-previous"><a href="....">古い記事へ</a></span>
  <span class="nav-next"    >新しい記事へ</span>
</div>

あとはCSSで飾り付けしてみてください。

.nav-previous,
.nav-next {
  color: #ccc;
}

.nav-previous a,
.nav-next a{
  color: #ff3366;
}