ナチュログの記事に過去記事へのリンクをスマートに入れる方法
お久しぶりのテンプレカスタムネタです。
ブログの記事を書く時に過去記事へのリンクを入れる時・・・
例えばキャンレポを書くときに同じキャンプ場へ過去に行った時の記事のリンクを挟んだり、自作ネタなどで何回かに分けて記事を書く際に以前の記事のリンクを挟んだり。
そんな時に使える小技です。
過去記事へのリンクを入れる
記事入力欄の上に並んでいるアイコンの右側にある鎖のマークのついたアイコンをクリックして、別ウインドウで開いた一覧から目的の記事を探してクリックしてください。
これで、記事入力欄に過去記事へのリンクが入ったと思います。
さて、これだけだと別に記事にしなくても誰でもわかることですよね。
次からは過去記事へのリンクの装飾に入ります。
リンクを装飾する
完成すると上の画像のように、過去記事リンクは枠線で囲まれて「関連記事」というタブ状のタイトルが追加されます。
さて適用方法なのですが、ここからはボクが配布しているテンプレートのみを対象にしています。
他のテンプレートでは全く効果がないので注意してください。
（この記事執筆時2018/02/06以前にテンプレをご利用の方は非対応です。スイマセン…。スタイルシートのみ最新のものに更新してください。）
適用方法
まず、記事内に先程過程どおりに過去記事のリンクを挿入します。
注意！挿入する過去記事は、一番右の「概要（回り込み）」を使ってください！
入力されたコードの先頭の
<div style="clear:left;">の「>」の前にclass="oldentry"と追記するだけ。（先頭に半角スペースを入れること）
入力されたコードの先頭(画像内ピンクの下線部分)が<div style="clear:left;" class="oldentry">となっていればok。
以上で、過去記事リンク「概要（回り込み）」が上の画像のように表示されているはずです。
テンプレートをご利用の方はこちらからどうぞ
バージョン1のテンプレート
- 下記リンク先ページのテンプレートをそれぞれの箇所に貼り付けて保存してください。
- ブログ環境設定で、タブレットテンプレートを利用する・スマートフォンテンプレートを利用するのチェックを外してください。
バージョン2のテンプレート(ガーリー)
- 下記リンク先ページのテンプレートをそれぞれの箇所に貼り付けて保存してください。
- ブログ環境設定で、タブレットテンプレートを利用する・スマートフォンテンプレートを利用するのチェックを外してください。
バージョン2のテンプレート(クール)
- 下記リンク先ページのテンプレートをそれぞれの箇所に貼り付けて保存してください。
- ブログ環境設定で、タブレットテンプレートを利用する・スマートフォンテンプレートを利用するのチェックを外してください。
バージョン3のテンプレート(クール)をご希望の方はこちらからどうぞ
- 下記リンク先ページのテンプレートをそれぞれの箇所に貼り付けて保存してください。
- ブログ環境設定で、タブレットテンプレートを利用する・スマートフォンテンプレートを利用するのチェックを外してください。
僕が公開しているテンプレートは完成品ではないです、不具合などがあれば更新していきますので、たまにはテンプレート更新履歴をのぞいてみてください。
また、テンプレートの改造などはご自由にどうぞ。
ただ、申し訳ございませんが改造などの際のサポートなどは行っておりません。
ご了承くださいませ。
最後に、僕はウエブデザイナーでも何でもございません。
趣味の領域で作成したテンプレートなので、テンプレート運用に関わるサポートはございません。
が、何かしらテンプレートの不具合があれば一緒に解決策を探っていきたいとは思っています。
このテンプレートで気になったことなどがあればお問い合わせください。
また、本職の方で「ここの記述はおかしい・ここはこうした方がいい」などアドバイスなどがあれば、大歓迎でお待ちしておりますので、どしどしコメントください。
お約束ですが、ご使用の際は自己責任でお願いします。
テンプレートの利用で不具合など生じても当方では責任は負えませんのでよろしくお願い致します。
また、このテンプレートは古いブラウザには対応していません。あしからずｗ
技術も知識もないので
既存のテンプレを仕方なく使っています…
トップの写真とかをオリジナルに変えたいんだけど、
トラブったら元通りにする自信もなくて…
スミマセン。
グチです…
ところで、ediさんのブログにアクセスすると、
ウチのカスペルさんが
「暗号化された接続が確立されたドメインに対する信頼性を保証できません」
とか言ってきます。
https://img01.naturum.ne.jp/usr/e/c/o/eco2house/カスペル警告.png
なんでですか??
最新記事で過去記事リンクしたので、試してみたけどダメだったー(T . T)
いじりすぎたかな・・・
これはoldentryという名前で、ediさんがどっかに仕込んでいるということですか？
ウェブデザイナーでもなんでも無いとおっしゃいますが、
一線を越えてますね（笑）
オールドエントリー、早速反映してみました。
こっちの方がスッキリして見やすいですね。
有り難うございました！
テンプレの変更は全く簡単ですよ。
テンプレの変更画面に行き、カスタマイズってボタンを押せば
「スタイルシート」「トップページ」「個別記事」「アーカイブ」の欄があるので
そこへ、この記事の上のリンク先のテキストそれぞれをコピペすれば作業終わりですｗ
間違ってもすぐに戻せるので試しにやってみたらいかがですか＾＾
ちなみにヘッダーの画像の変更はスタイルシートで行います。
あと、エラー画面ですがブログランキングのパーツが悪さしてるみたいですね。
ちょっと解決方法がわからないんで、すいませんがそのまま「続行」を押してください^^;
いちおう、昨日より前のテンプレートでは反映できないのでスタイルシートだけ新たに更新してみてください。
たぶん、それでうまくいくと思うんですが…
せっかくいろいろいじってもらってるのがもとに戻ってしまうのがもったいないですが^^;
そうです、oldentryというクラスを新たに仕込んでみました。
スタイルシートだけ新たに更新してもらわないといけないんですが、一度試してみてくださいな＾＾
HTMLとCSSは独学ですが仕事で使ってるんでそれなりには使えますｗ
でも、素人に毛が生えた程度ですけどね〜
見た目すごいすっきりしていい感じでしょｗ
自画自賛です＾＾
勘違いしてました。
スタイルシートを更新するんですね(^^;;
いじったデザインそのままでうまく行きました！
ありがとうございます。
やってみよ。
過去記事リンク入れると記事に幅が出ると思いますので試してみてくださいｗｗｗ
ご無沙汰しておりました(*ﾉω・*)ﾃﾍ
以前、こちらナチュログにて先達さんに教えていただきつつ
ちょこちょこっとブログカスタマイズはしてみたものの、その後（頭が）続かず放置ないたちですヽ(`･ω･´)ゝ✧
過去記事のリンクを入れることもぼちぼちあるんですが、そのまま鎖のマークのついたアイコンをクリックするだけ
今回のテクニックも「おぉおっ｡.:*･'(*ﾟωﾟ*)'･*:.｡」と思ったものの、
ediさんが配布されているテンプレ限定なんですか(´・ω・｀)
テンプレごと変更すると大改造っぽい（※イメージ）なので二の足を踏みまくります（笑
ボクのテンプレの使い方は全然難しくないですよ。
テンプレの変更の画面に入って、そこにスタイルシート・トップページ・記事本文・アーカイブ（だったかな？）のスペースがあるので、そこへボクが配布しているテンプレートをそれぞれにペーストすれば完成です。
コピペで終わりますｗ
簡単ですよ＾＾