【niftyココログ】webページとマイリスト(メモ形式)の活用【サイドカラムをすっきり】
■web(ウェブ)ページをインデックス用ページとして活用する
当ブログはサイドのカラムにいろいろな要素を表示しているのでゴチャゴチャしていて、且つ、下に長く延びてしまいます。(スタイルシートをいじればいいのかも知れないけど、そこまで手を掛ける程のモチベーションがない...)
それで、サイドに表示している要素、特にたくさんあって場所を取るフォトアルバムを間延びさせずに表示できないかと、webページを活用して工夫してみました。
整理した後のレイアウト(今日現在のもの)は左のような感じです。
webページは、ブログ記事と違い、日付順にブログに表示されると言うことはありません。
また、「デザイン」>「表示項目」で「ウェブページの一覧を表示」にチェックを入れていない限り、ブログのサイドバー上にも表示されません。(ただし、ネット上に公開はされています。)
この特徴を利用して、ブログ記事からリンクを貼ったり、サイドカラムに「マイリスト」(メモ形式でリンクするタグを貼り付ける)で表示したりし、「見たい人だけに見てもらう」ページを作ることができます。
どのように利用しているのかは、左の画像を部分的に拡大した下の画像でご確認ください。
なお、下記の記事にもwebページの扱い方や活用法を記述しています。
- 『【ブログの楽しみ方】他の記事の任意の箇所にリンクするには?【ココログ】』(左記記事の『ココログのwebページとは/どんな使い方をすればいいの?』にジャンプします。)
- 『【ブログの楽しみ方】管理人からの挨拶や問い合わせ用のページの作成/サイドカラムへの表示」【ココログ】』(マイリストにwebぺージヘのリンクを貼る方法)
webページの活用例として「フォトアルバム」とタイトルをつけたページをご紹介します。
この例では、各リンク先はwebページではなく、マイフォト(アルバム)ですが、関連のあるwebページ、ブログ記事、個別の画像、etc.を見やすく一覧にしておくと便利です。
上記リンク部分のhtmlタグは下記のように記述しています。(説明は省略)
<p><img width="33" hspace="10" align="left" src="http://daishi100.cocolog-nifty.com/ico_key.gif" />2010.08<br />
<a href="http://daishi100.cocolog-nifty.com/photos/2010_wakamiya/index.html">若宮八幡宮連合渡御のスナップ写真です。<br clear="left" /></a>
</p>
<p><img width="33" hspace="10" align="left" src="http://daishi100.cocolog-nifty.com/ico_key.gif" />2010.05.23<br />
<a href="http://daishi100.cocolog-nifty.com/photos/20100523/index.html">大師小学校B校舎内覧会後の懇親会の写真です。内覧会の写真はサイドカラムの『Our History』にて公開。<br clear="left" /></a>
</p>
■マイリスト(メモ形式)を使って、サイドバーにインデックス用ページへのリンクを表示する
通常のブログ記事と違って、webページは直接サイドバーに表示しない限り、ブログに表示されません。(URLがある以上、web上には公開されているわけですが。)
そこで、そのページに導くためのリンクをマイリストを使ってサイドバーに表示します。
このページは左に示したバナーにリンクを貼っていますが、もちろんバナーではなく、テキストにリンクを貼っても構いません。ただ、バナーにすると、「目立つ」&「クリックしやすい」という利点があります。
サイドにマイリスト(メモ形式)を使用してアルバムを貼る方法は下記をご参照下さい。
HTMLの説明は省略します。
自分でHTMLタグを書くのが難しければ、一度、ブログやwebページの編集画面でリンクを作成し、「HTMLの編集」モードに切り替えて、HTMLタグをコピーしてメモ形式のマイリストに貼り付ければ簡単です。
【追記】HTMLの説明は公式FAQ『バナー画像によるリンクをブログのサイドバーに表示する方法を教えてください』に説明があります。
■バナーを作るための素材
(Microsoftのクリップアートのご紹介をしましたが、2014/09/03現在、クリップアートはMS Office製品からしか利用できないようなので、これ以降削除しました。)
コメント