【Seesaaブログ新デザインシステム】記事ページの「関連記事」(2)タイトル表記を変更|ブログカスタマイズの雑談BLOGスマートフォン専用ページを表示ブログカスタマイズの雑談BLOGブログのカスタマイズやパソコン・ネットに関する雑談をするブログです。Seesaaブログの記事ページの下には「関連記事」(記事内で使用した画像のサムネイルと記事タイトル)が表示されます。「関連記事」については連続で記事を書いていますので、とりあえず紹介しておきます。記事ページの「関連記事」部分については、seesaaブログの「管理画面>設定」の「ブログ設定」で関連記事に何を表示させるのかの指定ができます。「ブログ設定」の中の「関連記事ソース」という項目です。「関連記事ソース」を確認すると、関連記事には3つの種類「デフォルト」「関連記事」「カテゴリ」があることがわかります。それぞれに対する説明はちょっと面倒なので「関連記事ソース」の画像を掲載しておきます。いうことで、3種類の「関連記事」について実際に自分のブログで試してみました。→記事が属しているカテゴリの最新記事が表示され、タイトルは「○○の最新記事」だった以上のような結果になりました。何も表示されなかった「関連記事」は論外として、利用できそうなのは「デフォルト」と「カテゴリ」でしょうかね。「デフォルト」を利用するとタイトルが「関連する記事」という文言になるのは、そのようにHTMLで設定されているからです。私としては、別にこのままでもいいかな?と思いますので、今回は編集しません。いうか、「デフォルト」を使う気が無いのでどうでもいい、というのが本音ですw使いたいのは「カテゴリ」なんですが、このままだと「○○の最新記事」というタイトルになってしまいます。記事が「日記」というカテゴリに属している場合、管理画面で「カテゴリ」を表示させるという設定にしていると、記事の下には「日記の最新記事」という文言でタイトルが付くわけです。これって、なんかわかりにくくないですかね?「日記」というカテゴリがあるかどうかなんて閲覧者は気づきませんよね?その記事のカテゴリを注視して閲覧する人もあんまりいないでしょうし、何のカテゴリに属している記事なのか、関連記事を見て初めて気づくかもしれません。」)でくくりたいと思います。思い切って『カテゴリ「○○」の最新記事』と表示させてもいいかもしれません。「カテゴリ」という単語を入れてしまえば、何の最新記事なのかすぐにわかりますからね。どのような表記にするのかは色々と試してみたらいいと思います。記事ページ下の「関連記事」のタイトル表記を編集するHTMLを編集します。管理画面の「HTML編集」画面で「関連する記事」というワードで検索すると1ヶ所がヒットしますので、この部分を編集します。-%>の最新記事」という部分が、カテゴリの関連記事を表示させた時のタイトルになります。-%>」の最新記事』に書き換えます。実際に記事ページを表示してみると、ちゃんと『「(カテゴリ名)」の最新記事』に変更されました。思い切って「カテゴリ」という文字も入れてみます。-%>」の最新記事』にしてみました。記事ページを確認してみると、なかなか良い感じです。「カテゴリ」という文言を入れてあげた方が、どういう基準でサムネイル画像が並んでいるのか、閲覧者にもハッキリとわかると思います。上記のように編集をすると、関連記事部分のタイトルの文言を変更することができます。変更したのですから、プログの記事ページには変更後のタイトルを使いたいですよね?使いたいならば、「管理画面>設定」の「ブログ設定」の中の「関連記事ソース」項目では「カテゴリ」を選択してください。Seesaaブログの「ブログ設定」で関連記事に何を表示させるのか選択する時、「カテゴリ」を選択すればこの記事で設定したタイトル表記になりますが、「カテゴリ」以外を設定すると全部「関連する記事」というタイトルになります。「関連記事ソース」の項目には「デフォルト」「関連記事」「カテゴリ」の3つがありますが、HTML上の指示が『カテゴリを表示する場合は●●と表示。それ以外は「関連する記事」と表示』という形式で記述されているため、「カテゴリ」ではない「デフォルト」と「関連記事」を選択すると、タイトル表記が「関連する記事」になってしまうわけです。しつこいですが、この記事で設定した『カテゴリ「○○」の最新記事』というタイトルを表示させたいのであれば、「ブログ設定」画面での関連記事ソースは「カテゴリ」を選択してください。次の記事では、「関連記事」のサムネイル画像のサイズを変更します。記事ページ下に表示される関連記事を編集します。関連記事に関するカスタマイズとしては3つ目になるので、この記事のタイトルには(3)と番号を振っていますが、この記事と次の記事(4)は同じことをやります。[必須入力]※画像の中の文字を半角で入力してください。