2008-02-19
グローバルリンクリストの作り方講座1 基本編
とりあえずリングコマンドを動かすための説明です。
グローバルリンクリスト
グローバルリンクリストのブログパーツは、NavigationRingにも設置されている、ページジャンプ機能を持ったリングコマンドです。
このリングコマンドはほぼ標準の設定で作られたページジャンプ機能のみの簡単なものですが、より詳細な設定をにより、リングコマンドの見栄えや動作をカスタマイズする事もできます。
各部名称
まずは部品の名前から
- (1)タイトル表示文
- アイコン画像毎に設定することが出来る表示文です。表示文にはテキスト以外にhtmlフラグメント(innerHTML)を設定できます。
- (2)タイトルDIVパネル
- 表示位置のモードと、DIVパネルの見栄えを決めるCSSを設定できます。
- (3)カーソル画像
- 選択しているアイコン画像の上に表示される画像です。表示モードと表示画像の選択ができます。
- (4)アイコン画像
- ページリンクのアイコン画像です。表示画像と、アイコン画像の見栄えを決めるCSSを指定できます。
とりあえずリングコマンドを作ってみる
↓こちらのページを別ウインドウで開いてください。
http://nyatla.jp/ws/nr/index.php?c=wp&v=0.2&page=editxml&name=links
このページの赤枠の部分に、リングコマンドの画像とリンク先を設定していきます。試しにGoogleとニコニコ動画とAmazonへ飛べるリングコマンドを作ってみましょう。
最低限設定しなければならないのは、リンク先と画像の設定
のイメージのURLとリンク先のURLです。
設定はこんな感じで…。タイトルはとりあえず空にして置いてください。
次に、リングコマンドを設置するページの文字コードを設定します。
とりあえず作ってみるだけならここは適当でかまいません。
設定できたら、ページの下のほうにある動きをプレビューボタンを押します。
プレビュー用のウインドウがポップアップしますので、そこで動作を確認してください。真っ白で何も内容に見えますが(実際何もない)、ページをダブルクリックするとリングコマンドが出てきます。
ダブルクリックすると…
出てきました。これは実際に回したりすることが出来ます。
これで完成!なら、作成ページにあるブログパーツ用のタグをコピーして、ブログやWebページにペーストすれば設置が出来ます。
少し(いやだいぶ?)長い文字列ですが、Bodyタグの下辺りに挿入してください。















