【ココログ】カテゴリ別記事一覧に機能追加
『【ココログ】カテゴリー毎の記事タイトル一覧作成&表示スクリプト』をマイナーアップデートしました。
- データ作成用スクリプト(ブックマークレットから呼出)
- インデックスファイル(category_index.js)中に各カテゴリの記事数情報を追加。
後付なこともあって、ちょっとすっきりしないフォーマットになっていますが(苦笑)。
- インデックスファイル(category_index.js)中に各カテゴリの記事数情報を追加。
- 表示用スクリプト
- プルダウンメニューに記事数表示追加。
- カテゴリークラウド表示機能追加。
記事の多いカテゴリーのリンクほどフォントサイズを大きくして目立たせるようなタイプのリンクリスト。
TypePadでは標準で用意されているみたいですが(TypePadに便利な機能を追加!)ココログではまだですよね?(実は先日のメンテでこっそり機能追加されていたり?)
カテゴリークラウド表示機能を有効にするには、設置スクリプトを次のように修正します。
<div id="cocoList-category"></div>
<script type="text/javascript" src="https://furyu.tea-nifty.com/script/cocoList.js"></script>
<script type="text/javascript">
<!--
cocoList.useCategoryCloud=true; // カテゴリークラウド(true=有効/false=無効)
cocoList.init() ;
//-->
</script>
<script type="text/javascript" src="https://furyu.tea-nifty.com/script/cocoList.js"></script>
<script type="text/javascript">
<!--
cocoList.useCategoryCloud=true; // カテゴリークラウド(true=有効/false=無効)
cocoList.init() ;
//-->
</script>
デフォルトだと、サイドバーの『カテゴリー』(id='archive-category')内を置換します。
任意の位置に表示したい場合、設置スクリプトに、
cocoList.tgtCategoryCloud='(ターゲットとなる要素のid)';
のような指定をcocoList.init();の前に追加します。
任意の位置に表示したい場合、設置スクリプトに、
cocoList.tgtCategoryCloud='(ターゲットとなる要素のid)';
のような指定をcocoList.init();の前に追加します。
次に、カスタムCSSに以下のような設定を追加します(お好みに応じて修正してください)。
a.cocoListCloudLevel1 {
font-size:10px;font-weight:lighter;
line-height:10px;
}
a.cocoListCloudLevel2 {
font-size:12px;font-weight:normal;
line-height:12px;
}
a.cocoListCloudLevel3 {
font-size:16px;font-weight:bold;
line-height:16px;
}
a.cocoListCloudLevel4 {
font-size:18px; font-weight:bold;
line-height:18px;
}
a.cocoListCloudLevel5 {
font-size:24px; font-weight:bolder;
line-height:24px;
}
font-size:10px;font-weight:lighter;
line-height:10px;
}
a.cocoListCloudLevel2 {
font-size:12px;font-weight:normal;
line-height:12px;
}
a.cocoListCloudLevel3 {
font-size:16px;font-weight:bold;
line-height:16px;
}
a.cocoListCloudLevel4 {
font-size:18px; font-weight:bold;
line-height:18px;
}
a.cocoListCloudLevel5 {
font-size:24px; font-weight:bolder;
line-height:24px;
}
カスタムCSSが使用できないリッチテンプレート等の場合は、メモタイプのマイリスト等(スクリプトを貼り付けているところと同じでよい)に
<style type="text/css">
/* 上記の CSSの内容 */
</style>
のようにして貼付けることで、同様の効果が得られます。
<style type="text/css">
/* 上記の CSSの内容 */
</style>
のようにして貼付けることで、同様の効果が得られます。
« メンテナンス後は『.htaccess』のアップロードが出来なくなりました(哀) | トップページ | 急な出張 »
「ウェブログ・ココログ関連」カテゴリの記事
- 久しぶりの投稿がココログへの苦言というのもなんなのですが……(2019.03.20)
- ココログをTwitterカードに対応させてみる(2016.11.23)
- 【覚書】風柳亭(ココログプロ)をレスポンシブWebデザイン化(Bootstrap3使用)(2015.10.09)
- ココログ用全文検索 - ココログ最強検索を jQuery を使って作り直してみた(既知の不具合の幾つかに対応)(2015.09.01)
- 現在に生きるということ。(2013.01.05)
「おもいつき」カテゴリの記事
- ココログをTwitterカードに対応させてみる(2016.11.23)
- 神使の兎 ~宇治神社にて~(2016.07.10)
- Twitter 原寸びゅー:PC版ブラウザ用・Twitterの画像閲覧と保存がはかどる拡張機能の紹介(2016.02.12)
- スマートフォンをPC上の音楽を再生するためのリモコンとして使いたい(2016.01.10)
- 【覚書】風柳亭(ココログプロ)をレスポンシブWebデザイン化(Bootstrap3使用)(2015.10.09)
コメント