タイトルタグを動的に出力したい

前提・実現したいこと

ワードプレスにてpre_get_document_titleを使い

カテゴリ名＋任意の文字列│サイト名

↑のようなmeta titleを出力したいのですが、任意の文字列のところが化けてしまいます。
どなたかご教授いただけると助かります。

発生している問題・エラーメッセージ

カテゴリ名�̈ꗗ│サイト名

下記ソースの「の一覧」のところがこんな感じで化けてしまいます。

functions.php

add_theme_support( 'title-tag' );

function change_title($title) {
  $separater = ' | '; 
  $blog_name = get_bloginfo('name'); 
  if(is_category()) {
    $title = single_cat_title('', false).'の一覧'.$separater.$blog_name;
  }
add_filter('pre_get_document_title', 'change_title');

header.php

<html lang="ja">
<head prefix="og: http://ogp.me/ns# fb: http://ogp.me/ns/fb# article: http://ogp.me/ns/article#">
<meta charset="<?php bloginfo( 'charset' ); ?>">
<meta name="format-detection" content="telephone=no"> 
<meta name="viewport" content="width=device-width,initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<link rel="icon" href="<?php echo get_template_directory_uri(); ?>/favicon.ico">
<?php wp_head(); ?>
</head>