■Seesaaブログのアーカイブページ（過去ログページ）上部に記事リストを作る
■独自で作っていたclass「article_kobetu」「subheading」を使用
■独自で作っていたclass「article_kobetu」「subheading」を使用
記事リスト作成シリーズの第四弾は「過去ログページ」です。（第四弾とか言いながら、シリーズ最後ですけどねｗ）
「過去ログページ」という呼び方で大丈夫だとは思いますが、HTMLの記述を見ると「アーカイブページ」とも呼ぶのかもしれません。
このブログでは混在して使うと思いますが、「過去ログページ」でも「アーカイブページ」でも、同じページを指していることをご理解ください。
一応シリーズものなので、前回までの「記事リスト作成」に関する記事を紹介しておきます。
当記事の関連記事■カテゴリページに記事リストを作る
■ブログ内検索結果ページに記事リストを作る
■タグ一覧ページに記事リストを作る（1）
■タグ一覧ページに記事リストを作る（2）
■過去ログページ（アーカイブページ）に記事リストを作る
■ブログ内検索結果ページに記事リストを作る
■タグ一覧ページに記事リストを作る（1）
■タグ一覧ページに記事リストを作る（2）
■過去ログページ（アーカイブページ）に記事リストを作る
現時点の過去ログ（アーカイブ）ページ
アーカイブページは、カレンダーのキャプション部分の「年月」や「日付」、サイドバーの「過去ログ」に表示される「年月」をクリックして開くページです。
「年月」をクリックした場合に表示されるページ
カレンダーやサイドバー「過去ログ」の「年月」部分をクリックして開くアーカイブページは、「管理画面＞設定」の「ブログ設定」で記事の表示件数を設定できます。
記事の下にはページ案内ボタンが2種類表示されます。
上段に「前月」「次月」のボタンがあり、下段に「案内ボタン12345」があります。
「日付」をクリックした場合に表示されるページ
「日付」のアーカイブページは、「カレンダー」の日付部分をクリックしたら表示されます。
こちらは「ブログ設定」で設定した表示件数は無関係で、同日にアップされた記事すべてが表示されます。
なのでページ案内ボタンは存在しません。
この「日付」のアーカイブページも案内ボタンがあった方がいいと思って色々と試行錯誤していたんですが、Seesaaブログの独自タグではアーカイブは「月」単位しか無いみたいで、何をどうやってもうまくいきませんでした。
私が見つけることができなかっただけかもしれませんが、「日付」を指定するタグがないのは痛いです。
なのでもう、諦めてテンプレートの通りにしたいと思います。
まあ、1日に20も30も記事を書くことなんて無いでしょうから大丈夫でしょう。
通常のアーカイブページ（「年月」をクリックして表示するページ）は、カテゴリページと同じように、本文の途中まで入った記事が検索結果の数だけ表示されます。
やはり、スクロールしないと記事タイトルはわかりません。
どんな内容の記事を書いているのかわかりやすくするために、ページ上部に記事リストを表示したいと思います。
ちなみに、デフォルトのHTMLにはアーカイブページの記事リストに関する記述がありません。
アーカイブページの記事表示は他のページ（個別記事ではないページ）と共通のため、HTMLでは記事の下に表示される「案内リンク」に関するものだけが記述されています。
何もないところに今から記事リストのコードを追加しますので、かなり長文のコードになります。
【注意！】「article_kobetu」と「subheading」
下記で紹介するコードでは、私が独自に作ったclass「article_kobetu」と「subheading」を使用しています。1つ目の「article_kobetu」は「記事を点線で囲む」というclassで、もう1つの「subheading」は「上部に100pxの余白を入れる」というclassです。
＜私が勝手に作ったclass＞
.article_kobetu {
margin-bottom: 40px; /* コンテンツとコンテンツの間 */
padding: 10px 10px 15px 10px;
border:1px dotted #4E667D; /* コンテンツを点線で囲む */
}
.subheading {
margin-top: 100px;
}
margin-bottom: 40px; /* コンテンツとコンテンツの間 */
padding: 10px 10px 15px 10px;
border:1px dotted #4E667D; /* コンテンツを点線で囲む */
}
.subheading {
margin-top: 100px;
}
この2つのclassをCSSに記述していない方は、CSSの空いている部分に記述してください。
もしも「線で囲まないし、余白もいらない」という場合は、下記で紹介する「追加するコード」内で該当部分を緑色で表示していますので、その部分を外した状態でご自分のHTMLにコピペしてください。
それと、私は以前の記事＜■【Seesaaブログ新デザインシステム】カテゴリページ・タグ一覧ページのタイトルを記事タイトルと同じ位置に置く・「heading」を編集する＞で、HTMLに記述されている「<div class="l-content">」と「<div role="main" class="main l-left">」の位置を変更しました。
カテゴリページとかタグ一覧ページとか、そういうページのタイトルも、トップページや個別記事ページと同じように「記事のタイトル」という意味で、同じ位置（高さ）に置きたかったので、このような処理をしています。
もしも上記のタグを移動させていない場合は、どのような表示になるのかわかりません。おそらく大丈夫だとは思いますが、私自身のカスタマイズとは異なる場合のことは関知しませんのでご了承ください。
アーカイブページに記事リストを作る（案内リンクに見出しを付ける）
アーカイブページ（過去ログページ）のページ上部に記事リストを作ります。
まずは、HTMLのアーカイブページに見出しを付けます。
この作業はやらなければいけないものではありません。HTMLの記述がわかりやすくなるように目印を付けたいだけです。
私は見出しを付けますが、付ける必要がないならば、この作業は飛ばしてください。
アーカイブページに記事リストを作るためには、記事リストのコードをHTMLに新しく追加することになります。
先ほども書きましたが、現時点でHTML上にあるアーカイブページに関するコード記述は、アーカイブページの記事部分ではなく「案内リンク」のコードです。（記事部分は「個別記事ではないページ」と共通のため「案内リンク」に関するコードしか記述されていません）
HTMLを編集します。
管理画面の「HTML編集」画面を開き、「<% if:page_name eq 'archives' -%>」で検索すると2ヶ所がヒットしますが、このうち2つ目を編集します。（1つ目はタイトル部分に関する表記ですので無関係です）
デフォルトのテンプレートだと196行目にあると思います。
このコード一連の島が、アーカイブページの案内リンクの記述です。
1つ目の島で「前ページ・次ページ案内リンク」を、2つ目の島で「案内リンク（12345ボタン）」を記述しています。（上記画像には途中までしか記載されていません）
これらの記述は変更する必要は全くありませんので、そのままで大丈夫です。
ただ、何について書いているのかがわかるように、私は見出しを追加しておきます。
しつこいですが、必ずやらなければいけない作業ではありませんので、お好きなようにどうぞ。
アーカイブページの「案内リンク」に見出しを付ける
説明するのがけっこう大変な感じなので、行数で指示を出したいと思います。
行数は、私が色々とカスタマイズしてきた後の数字です。
3つほど見出しに対する指示を出します。
その結果、指示していた行数がどんどんズレていきます（笑）
もう面倒ですので、最終的には下記に掲載しているコード画像で確認してください。
（見出しタグの色と画像内の色を合わせたので位置はわかると思います）
1つ目の作業
アーカイブページは「<% if:page_name eq 'archives' -%>」（266行）から始まるので、このタグの上に「<!-- ********** アーカイブページ（ページ案内） 開始 *********** -->」と見出しを入れます。
アーカイブページのページ案内最後は「<% /if -%>」です。
なので、このタグの下に「<!-- ********** /アーカイブページ（ページ案内）終わり *********** -->」と見出しを入れます。（308行あたりに入ります）
2つ目の作業
「前ページ・次ページ案内リンク」は「<div class="permalink">」（268行）から始まるので、このタグの上に「<!-- 前ページ・次ページ案内 開始 -->」と見出しを入れ、終了タグ「</div>」（275行）の下に「<!-- /前ページ・次ページ案内 終わり -->」と見出しを入れます。
3つ目の作業
277行目の「<% if:archive_page_name eq 'month' -%>」以下が「案内リンク（12345ボタン）」の記述なので、このタグの前に「<!-- 案内12345ボタン 開始 -->」と見出しを入れ、309行あたりの最後の「<% /if -%>」の上に「<!-- /案内12345ボタン 終わり -->」と見出しを入れます。
編集後のHTML
わざわざ書いてみましたが、あまり必要ない作業でしたねｗ
アーカイブページに記事リストを作る（コードの追加）
コードを追加する前に、タイトル表記をどうするのかを考えておいてください。
以下で紹介するコードを追加することにより、アーカイブページ（過去ログページ）には2つのタイトルが表示されることになります。
1つ目はページ冒頭に入るタイトルで、これは今から作ろうとしている記事リストのタイトルです。作った記事リストの下には余白100pxが入ることになり、余白の下には2つ目のタイトルが表示されます。2つ目のタイトルは、元からあった短文表示の記事に対するタイトルです。
しかも、「年月」のページと「日付」のページではコード記述の内容が異なるので、それぞれ2つずつのタイトル表記を考えなければいけません。
「年月」のアーカイブページは、例えば『「○年○月」の記事リスト【目次】』のようにタイトルを付けることができます。
でも、「日付」のアーカイブページのタイトルは、なかなかうまくいきません。「日」を指定してアーカイブページを開いたとしても、「○年○月○日」のように「日付」までは表示できないからです。どうしても「○年○月」という表示になってしまいます。
Seesaaブログには「日」を指定する独自タグが無いんですよね。だから「○月○日」とピンポイントで指定するようなコード記述ができないのです。（もしかしたら「日」を指定する独自タグもあるかもしれないけど、わからなかった）
ということで、私は諦めましたｗ
追加するコードのタイトル表記は、以下のようにしたいと思います。
「年月」のアーカイブページ
・上部タイトル「○年○月投稿の記事リスト【目次】」
・下部タイトル「○年○月投稿の記事一覧」
「日付」のアーカイブページ
・上部タイトル「○年○月（指定日）の記事リスト【目次】」
・下部タイトル「○年○月（指定日）の記事一覧」
・上部タイトル「○年○月投稿の記事リスト【目次】」
・下部タイトル「○年○月投稿の記事一覧」
「日付」のアーカイブページ
・上部タイトル「○年○月（指定日）の記事リスト【目次】」
・下部タイトル「○年○月（指定日）の記事一覧」
「日付」のアーカイブページのタイトルに「（指定日）」という言葉を入れることで誤魔化したいと思います。もしもこの表記が気に入らない場合は、下記で紹介するコードのタイトル部分の表記をご自分でお好きなように変更してください。
HTMLに記事リストのコードを追加する
アーカイブページに記事リストのコードを追加します。
先ほども書きましたが、現時点のHTML上には記事リストのコードは何も記述されていません。
関連する全部のコードをそっくりそのまま、指定する場所にコピペしてください。
HTMLを編集します。
管理画面の「HTML編集」画面を開き、「<% if:page_name eq 'tag' -%>」というタグで検索すると2ヶ所がヒットしますが、1つ目を見てください。
デフォルトのテンプレートだと36行目にあります。
この「<% if:page_name eq 'tag' -%>」タグは5行の島になっていて、タグ一覧ページのタイトル表記のコードが記述されていると思います。（以前の記事＜■タグ一覧ページに記事リストを作る（1）＞で編集済です）
私が色々とカスタマイズしてきた後のHTMLだと104行目ぐらいがタグ一覧ページのタイトル表記の終了タグです。
このタグ一覧ページのタイトル表記のコードの下、「<% loop:list_article -%>」タグとの間に、下記のコードを全部コピペします。
かなり長文のコードですが、細かいことは気にせずにコピペをどうぞ。
【注意】
デフォルトのテンプレートでは、タグ一覧ページのタイトル部分の下に「<div class="l-content">」と「<div role="main" class="main l-left">」が記述されていますが、この2つのタグを移動させたことは上記で説明している通りです。
なので、私が色々とカスタマイズしてきた後のHTMLには、タグ一覧ページのタイトル部分の記述のすぐ下に「<% loop:list_article -%>」が記述されています。
この「<% loop:list_article -%>」の上に下記のコードをコピペします。
デフォルトのテンプレートでは、タグ一覧ページのタイトル部分の下に「<div class="l-content">」と「<div role="main" class="main l-left">」が記述されていますが、この2つのタグを移動させたことは上記で説明している通りです。
なので、私が色々とカスタマイズしてきた後のHTMLには、タグ一覧ページのタイトル部分の記述のすぐ下に「<% loop:list_article -%>」が記述されています。
この「<% loop:list_article -%>」の上に下記のコードをコピペします。
＜コードを追加する位置＞
＜追加するコード＞
<!-- ********** アーカイブページ（上部記事リスト表示） 開始 *********** -->
<% if:page_name eq 'archives' -%>
<!-- *** アーカイブページ記事リスト 開始 *** -->
<% if:archive_page_name eq 'month' -%>
<p class="heading"><% extra_title_datetime | date_format("%Y年%m月") -%>投稿の記事リスト【目次】</p>
<div class="article_kobetu">
<% loop:list_article -%>
<article class="article">
◆ <a href="<% article.page_url %>"><% article.subject %></a> <% article.createstamp | date_format("%Y/%m/%d（%a）") -%>
</article>
<% /loop -%>
</div>
<% /if -%>
<% if:archive_page_name eq 'mday' -%>
<p class="heading"><% extra_title_datetime | date_format("%Y年%m月") -%>（指定日）の記事リスト【目次】</p>
<div class="article_kobetu">
<% loop:list_article -%>
<article class="article">
◆ <a href="<% article.page_url %>"><% article.subject %></a> <% article.createstamp | date_format("%Y/%m/%d（%a）") -%>
</article>
<% /loop -%>
</div>
<% /if -%>
<!-- *** /アーカイブページ記事リスト 終わり *** -->
<!-- 前ページ・次ページ案内 開始 -->
<div class="permalink">
<% if:archive_page_name eq 'month' -%>
<% if:previous_archive -%><a href="<% previous_archive.page_url -%>" class="prev"><% previous_archive.createstamp | date_format("%Y年%m月") -%></a><% /if -%>
<% if:next_archive -%><a href="<% next_archive.page_url -%>" class="next"><% next_archive.createstamp | date_format("%Y年%m月") -%></a><% /if -%>
<% /if -%>
<% if:archive_page_name eq 'mday' -%><% /if -%>
</div>
<!-- /前ページ・次ページ案内 終わり -->
<!-- 案内12345ボタン 開始 -->
<% if:archive_page_name eq 'month' -%>
<% if:pager -%>
<% if:pager.need_pager -%>
<ul class="pager">
<% if:pager.previous_page -%>
<li class="pager__item prev"><a href="<% archive.page_url(pager.previous_page) -%>"><</a></li>
<% else -%>
<li class="pager__item prev"><span><</span></li>
<% /if -%>
<% loop:list_pager -%>
<% if:pager.show_previous_group(pager_number,5) -%><li class="pager__item"><span>..</span></li><% /if -%>
<% if:pager.show_page(pager_number,5) -%>
<li class="pager__item<% unless:current_page ne pager_number -%> is-active<% /unless -%>">
<% if:current_page ne pager_number -%><a href="<% archive.page_url(pager_number)-%>"><% /if -%>
<% unless:current_page ne pager_number -%><span><% /unless -%><% pager_number -%><% unless:current_page ne pager_number -%></span><% /unless -%>
<% if:current_page ne pager_number -%></a><% /if -%>
</li>
<% /if -%>
<% if:pager.show_next_group(pager_number,5) -%><li class="pager__item"><span>..</span></li><% /if -%>
<% /loop -%>
<% if:pager.next_page -%>
<li class="pager__item prev"><a href="<% blog.page_url(pager.next_page) -%>">></a></li>
<% else -%>
<li class="pager__item prev"><span>></span></li>
<% /if -%>
</ul>
<% /if -%>
<% /if -%>
<% /if -%>
<!-- /案内12345ボタン 終わり -->
<!-- 下部のタイトル 開始 -->
<% if:archive_page_name eq 'month' -%>
<div class="subheading">
<p class="heading"><% extra_title_datetime | date_format("%Y年%m月") -%>投稿の記事一覧</p>
</div>
<% /if -%>
<% if:archive_page_name eq 'mday' -%>
<div class="subheading">
<p class="heading"><% extra_title_datetime | date_format("%Y年%m月") -%>（指定日）の記事一覧</p>
</div>
<% /if -%>
<!-- /下部のタイトル 終わり -->
<% /if -%>
<!-- ********** /アーカイブページ（上部記事リスト表示） 終わり *********** -->
<% if:page_name eq 'archives' -%>
<!-- *** アーカイブページ記事リスト 開始 *** -->
<% if:archive_page_name eq 'month' -%>
<p class="heading"><% extra_title_datetime | date_format("%Y年%m月") -%>投稿の記事リスト【目次】</p>
<div class="article_kobetu">
<% loop:list_article -%>
<article class="article">
◆ <a href="<% article.page_url %>"><% article.subject %></a> <% article.createstamp | date_format("%Y/%m/%d（%a）") -%>
</article>
<% /loop -%>
</div>
<% /if -%>
<% if:archive_page_name eq 'mday' -%>
<p class="heading"><% extra_title_datetime | date_format("%Y年%m月") -%>（指定日）の記事リスト【目次】</p>
<div class="article_kobetu">
<% loop:list_article -%>
<article class="article">
◆ <a href="<% article.page_url %>"><% article.subject %></a> <% article.createstamp | date_format("%Y/%m/%d（%a）") -%>
</article>
<% /loop -%>
</div>
<% /if -%>
<!-- *** /アーカイブページ記事リスト 終わり *** -->
<!-- 前ページ・次ページ案内 開始 -->
<div class="permalink">
<% if:archive_page_name eq 'month' -%>
<% if:previous_archive -%><a href="<% previous_archive.page_url -%>" class="prev"><% previous_archive.createstamp | date_format("%Y年%m月") -%></a><% /if -%>
<% if:next_archive -%><a href="<% next_archive.page_url -%>" class="next"><% next_archive.createstamp | date_format("%Y年%m月") -%></a><% /if -%>
<% /if -%>
<% if:archive_page_name eq 'mday' -%><% /if -%>
</div>
<!-- /前ページ・次ページ案内 終わり -->
<!-- 案内12345ボタン 開始 -->
<% if:archive_page_name eq 'month' -%>
<% if:pager -%>
<% if:pager.need_pager -%>
<ul class="pager">
<% if:pager.previous_page -%>
<li class="pager__item prev"><a href="<% archive.page_url(pager.previous_page) -%>"><</a></li>
<% else -%>
<li class="pager__item prev"><span><</span></li>
<% /if -%>
<% loop:list_pager -%>
<% if:pager.show_previous_group(pager_number,5) -%><li class="pager__item"><span>..</span></li><% /if -%>
<% if:pager.show_page(pager_number,5) -%>
<li class="pager__item<% unless:current_page ne pager_number -%> is-active<% /unless -%>">
<% if:current_page ne pager_number -%><a href="<% archive.page_url(pager_number)-%>"><% /if -%>
<% unless:current_page ne pager_number -%><span><% /unless -%><% pager_number -%><% unless:current_page ne pager_number -%></span><% /unless -%>
<% if:current_page ne pager_number -%></a><% /if -%>
</li>
<% /if -%>
<% if:pager.show_next_group(pager_number,5) -%><li class="pager__item"><span>..</span></li><% /if -%>
<% /loop -%>
<% if:pager.next_page -%>
<li class="pager__item prev"><a href="<% blog.page_url(pager.next_page) -%>">></a></li>
<% else -%>
<li class="pager__item prev"><span>></span></li>
<% /if -%>
</ul>
<% /if -%>
<% /if -%>
<% /if -%>
<!-- /案内12345ボタン 終わり -->
<!-- 下部のタイトル 開始 -->
<% if:archive_page_name eq 'month' -%>
<div class="subheading">
<p class="heading"><% extra_title_datetime | date_format("%Y年%m月") -%>投稿の記事一覧</p>
</div>
<% /if -%>
<% if:archive_page_name eq 'mday' -%>
<div class="subheading">
<p class="heading"><% extra_title_datetime | date_format("%Y年%m月") -%>（指定日）の記事一覧</p>
</div>
<% /if -%>
<!-- /下部のタイトル 終わり -->
<% /if -%>
<!-- ********** /アーカイブページ（上部記事リスト表示） 終わり *********** -->
●コピペした後は、おそらくタグが左端に寄った状態で表示されると思いますので、キーボードの「タブキー（Tabキー）」でタグを1つずつ移動させ、体裁よく並べてください。
タグが全部左端に寄っていても気にしない方はそのままでいいと思います。
●記事リストを線で囲まないし、短文表示の記事リストのタイトルに上余白はいらないという場合は、緑色で表示している部分を外してください。
コード編集後のHTMLと実際のページ
「年月」のアーカイブページ
「日付」のアーカイブページ
【調整】記事リストの行間変更（classの変更）
上記のようにコードを全部コピペすると、記事リストを表示させることができます。
実際に作ってみると、ちょっと行間が狭いような気がしてきました。
行間の調整のためには、上記コードで使った「<div class="article_kobetu">」を変更すればいいのですが、「article_kobetu」はここだけではなく他の箇所でも使用しているclassなので、「article_kobetu」そのものを変更することはできません。
なので、新しくclass「article_kobetu2」を作って対処したいと思います。
記事リスト内の行間が気になる方は、下記のように編集してみてください。
もしも「article_kobetu」を使用していなくて記事リストの行間が気になる場合も、同じように編集すればいいと思います。下記で紹介している「<div class="article_kobetu2">」と終了タグ「</div>」を追加すればいいです。（コードの記述位置は、上記「追加するコード」の緑色で記述している位置です）
HTMLでclassを変更する
HTMLで上記コードの「<div class="article_kobetu">」を「<div class="article_kobetu2">」に変更します。（見出し「<!-- *** アーカイブページ記事リスト 開始 *** -->」の下に2ヶ所あります）
「article_kobetu」の後ろに「2」を入れればいいだけです。
CSSに新しく作ったclassを追加する
CSSに下記の記述を追加します。CSSの空いている部分にコピペしてください。
＜追加するコード＞
.article_kobetu2 {
margin-bottom: 40px;
padding: 10px 10px 15px 10px;
border: 1px dotted #4E667D;
line-height: 2.3em;
}
.article_kobetu2 a{
font-size:105%;
}
margin-bottom: 40px;
padding: 10px 10px 15px 10px;
border: 1px dotted #4E667D;
line-height: 2.3em;
}
.article_kobetu2 a{
font-size:105%;
}
●「.article_kobetu2」では行間を持たせるために「line-height: 2.3em;」を追加しました。
●「.article_kobetu2 a」を作り、リンク部分（つまり記事タイトル部分）のフォントを少し大きくしました。
コード編集後のアーカイブページ（過去ログページ）
関連記事の紹介
この記事を書いた後で、記事リストのスタイルを少しだけ変更しました。
上記で記事リストの行間を少し広くしたんですが、通常はいいんですけど記事タイトルの文字数が多い場合は広くした行間のまま折り返されてしまうんですよ。
私としては、記事タイトルと記事タイトルの間（行間）は広めにして、記事タイトルの途中で折り返される時はもう少し狭い間隔で折り返してほしいわけです。そのためには、この記事で書いているような、デフォルトのHTML記述をそのまま利用したコード記述では無理なわけですね。リストタグ「li」を利用した記述に変更して、リストスタイルとして行間を設定した方がいいのです。
ついでに、この記事では記事タイトルの先頭に「◆」マークを付けていますが、リストタグを使えば、簡単に自分が準備したリストマーク（画像）を使えます。
変更した記事はこの記事でのカスタマイズが前提になっていますので、まずはこの記事の通りに編集してもらいたいと思います。その上で、こちらの記事をお読みください。
■【Seesaaブログ新デザインシステム】過去ログページの記事リスト先頭にマークを付ける
この記事では「タグ一覧ページ」の記事リストを編集します。記事タイトルが長文になった場合に、記事リストの行間が少し広く感じてしまうのと、単語の途中で折り返されてしまうのが気に入らないので編集します。‥‥
この記事では「タグ一覧ページ」の記事リストを編集します。記事タイトルが長文になった場合に、記事リストの行間が少し広く感じてしまうのと、単語の途中で折り返されてしまうのが気に入らないので編集します。‥‥
次の記事の紹介
次の記事では、Seesaaブログのすべてのサムネイル画像に枠線を付ける方法を説明します。
■【Seesaaブログ新デザインシステム】すべてのサムネイル画像に枠線を付ける
何となく「カスタマイズ、終わったかなぁ」とか思いながらページを開いて確認をしている時に、記事に白っぽい画像を挿入した場合、サムネイル画像が並んで表示されるパーツの見た目がおかしいことに気が付きました。‥‥
何となく「カスタマイズ、終わったかなぁ」とか思いながらページを開いて確認をしている時に、記事に白っぽい画像を挿入した場合、サムネイル画像が並んで表示されるパーツの見た目がおかしいことに気が付きました。‥‥
