■ウェブサイト管理:コラム 記事一覧■
[サイト作成]お手軽jQueryでテンプレート風サイトデザイン  2011年09月27日
[ツール妄想]戦国史シナリオをXML化したい  2011年09月07日
[Twitter]フォローして!とサイトやブログで表明  2010年01月20日
[Twib]ブログやサイトにTwitterリンクを貼る  2009年12月22日
全コンテンツのCMS化への模索…  2009年03月13日



2011年09月27日

[サイト作成]お手軽jQueryでテンプレート風サイトデザイン


こんばんは、蛛賢です。
戦国史同盟のリニューアルを今現在(2011.9.27)行っております。

ちょっと前まで、Joomla!、Drupal等のCMSを用いたサイトリニューアルを考えておりましたが、
なんだかんだで手打ちの方が手前に合っていたこともあり、手打ちかつ手軽な方法を探しておりました。

まず思いつくのは、CSSなんか便利ですよね。
あとはヘッダフッタ、常に表示するメニューバーなどをテンプレートとして組み込めれば最高です。

そんな中で手段として案に上がったのが「jQuery」でした。(別にJavascriptと言っても良いんですけどね) 
戦国史同盟のソースを見れば分かりますが「load」という命令でテンプレートファイルを読み込んでいます。
該当するdiv要素を読み込んだテンプレートファイルの内容に書き換えることで、サイトの骨子を構築しているわけです。

トップページ


手軽なんですが留意点もあります。(よくハマるかも)

  • 同じドメインのファイルじゃないと呼び出せない。
    http://sengokushi.net から呼び出すなら http://sengokushi.net より下のディレクトリのファイルだけ
  • javascriptを含むHTMLファイルを読み込んでも思ったように動かないことがある。
    表示用のHTMLファイルを別に用意してiframeで表示すると良いかも
  • 相対パス指定していると、他のディレクトリのHTMLから呼び出したとき、呼び出せずに表示が崩れることがある。
    無難に絶対パス指定がおすすめ
  • document.writeで表示が崩れることがある。(個人的にjQueryと相性の悪い命令と感じました)

大体思いつくのはこれくらいですが、それを踏まえてもやっぱり便利ですね。
部品のHTMLを編集すれば全てのページに反映されますからね。
様々なスクリプト(アップローダや掲示板等)にも簡単に組み込むことが出来ます。


そんなに大掛かりなサイトじゃないんだけど、デザインは変えたい!
…という非ブログ志向な方、ポータルサイト運営の方、趣味サイト運営の方、HTML手打ち派の方、おすすめです。
(もちろんですが、大人数でサイト管理運営するならCMSのが良いかも)

【参考】load( url, data, callback ) - jQuery 日本語リファレンス


at 00:48|Edit

Comment

2011年09月07日

[ツール妄想]戦国史シナリオをXML化したい


こんばんは(?)、蛛賢です。
戦国史用のツールをもっと作りたい今日この頃ですが、
その前にシナリオをもっと汎用性の高い形式に変換することも重要かなぁと思っています。

そのほうが色々な人にツールを作ってもらえる機会も増えますからね。
いかんせん、戦国史シナリオファイルのテキストファイルに記述してあるデータを、
一つ一つ読み込んでいく機構を、皆さんが皆さん千差万別の方法で読み込んでいくのは時間がもったいないです。

XMLと呼ばれるマークアップ言語に準じた形式に変換してしまえば、
あとはその変換された形式を一定のルールにのっとってインポートすれば
いとも簡単に、戦国史シナリオファイルを用いたツールを作成することができます!(できるはずです!)(できるかな?)

すなわち、
まず、戦国史シナリオファイルを戦国史シナリオXMLファイルに変換する。
XMLファイルを読み込むツールで何かしら加工する。
という翻訳機みたいな役割ですね。

XMLエクスポートツールを作ったら、次に作りたいツール
・戦国史シナリオ紹介用ウェブサイト自動生成ツール(名前なっが…)
・ディテイルメーカーX(リベンジ)
・ 条件イベントエディタ

他にも、いろいろなユーザの方にも、手軽にツールを作って頂ければ嬉しいです。
インポートする手間をそこまで考えなくて良い!というのは、かなり大きいことだと思いますが、いかがでしょうか。

ある意味、簡単な戦国史シミュレータも作れるのではないでしょうか。

ただし、一度XMLの形式を固め、ツールが生まれ始めた後、その仕様をころころ変更することは厳禁です。
ちょっとした変更でも、ツールからインポート出来なくなったり、影響がどんどん広がっていきますからね。

以下のサイトは、XMLについて分かりやすく解説されております。
http://www.magiclab.net/XML_lesson.htm 

また、戦国史シナリオファイルと可逆関係でないといけません。
XMLとしてエクスポートはできて、その逆ができないとディテイルメーカー等はまず無理です。 
シナリオファイルとして出力するツールに使われる人が多いのではないでしょうか。

<?xml version="1.0" encoding="UTF-8"?>
<sengokushi>

</sengokushi>

こんな感じで、中身を煮詰めていく感じでしょうか?

本当に終始ふわっふわしたお話でしたが、
もしXMLに詳しい方が居られれば、独自形式作成のコツや苦労話、ご教授願いたいです。

以上です。

at 03:31|Edit

Comment
2010年01月20日

[Twitter]フォローして!とサイトやブログで表明


Twitterでは、ブログよりも高頻度で発言中の蛛賢です。

さて、お気づきの方も居られるかも知れませんが、
不撓不屈ブログの右側に「Follow Me」なんていう
「あなたがもしTwitterをしてるなら友達になりましょう!」

という縦長のボタンバナーが貼り付いています。
画面をスクロールしても一定の場所を同期してスクロールします。

これは、GO2WEB20.netのサービスの一つです。
「Twitter "Follow" Badge for your site/blog」

英文のサイトですが、書かれていることはそう難しくないので、
簡単にタグ生成までいけると思います。(scriptタグで始まるHTMLソース)

生成したタグを自分のサイトのソースに貼り付けるだけでOKです。
貼り付ける場所は、BODYタグの中であれば、どこでも良いでしょう。

Livedoorブログの場合、つまり私の場合は、
トップページ、個別記事ページ、カテゴリアーカイブ、月別アーカイブ、
の全ての</body>の一歩手前に貼りつけています。

以上です。

みなさん、もしTwitterユーザであるなら友達になりましょう

at 16:22|Edit

Comment
2009年12月22日

[Twib]ブログやサイトにTwitterリンクを貼る


Twitterといえば、ご存知の方も増えてきた「ささやき」を行えるサービスですね。
ミニブログとも言われたりしています。

ちなみに私のTwitter

ふと面白い記事を見つけたときに、「ささやき」たいと思うことがあるかも知れません。
そのときに、そのURIと内容をすぐにささやけたら便利ですよね。
はてブやLDクリップとかもそういうコメントを残せるようになっています。

そこで今回「Twib」というサービスをご紹介します。
この「Twib」のAPIを用いることで、その記事からささやくことを強力に補助してくれるのです。

論より証拠。とりあえず以下のリンクが現物です。

このエントリをつぶやくこのWebページのtweets

左の「t」をクリックすればURIやタイトルを引用してささやくことが出来ます。
右の数字は既に何人がこの記事をささやいているかを表示しています。

だいたいの使い方は上記のURIに記載されています。

以下に例として、ライブドアブログに貼る方法と、一般的なサイトに貼る方法をご紹介します。

【Livedoor Blogに貼る】

<a href="http://twib.jp/share?url=<$ArticlePermalink$>" target="_blank" rel="nofollow"><img src="http://twib.jp/static/images/t.gif" alt="このエントリをつぶやく" /></a><a href="http://twib.jp/url/<$ArticlePermalink$>"><img src="http://image.twib.jp/counter/<$ArticlePermalink$>" alt="このWebページのtweets" /></a>
(人数表示込み)

【一般的なサイトに貼る】
(Wikiなどの動的なサイトでもJavascriptが使えれば適応できます)
<a href='javascript:location.href=&quot;http://twib.jp/share?url=&quot;%2bencodeURIComponent(location.href);' rel='nofollow'><img src='http://twib.jp/static/images/t.gif' alt='このエントリをつぶやく' /></a>
(人数表示ナシ)
もちろんJavascriptを用いずに、ベタにURIを入力してもOKです。

これを適宜デザイン上で設置したい場所に書き込みます。
私は記事の右下に表示させることにしました。

それにしてもこんな便利なAPIを個人で提供できるって素晴らしいですね。快適ですし。

【追記】
私が次に注目しているのは(若干遅れていますが)「Tumblr」です。
まさにネットスクラップ専用ブログですね。
そのせいで著作権問題が顕著らしいですが…

Shuken's Tumblr Scraps

at 23:58|Edit

Comment
2009年03月13日

全コンテンツのCMS化への模索…


ご無沙汰しております。蛛賢です。
タイトルのまんまなんですけど、CMSという管理システムをサーバにインストールし、
複数人数で管理をやっていくことで、同盟を存続させましょうってことです。

まぁ「もうちょっと忙しいので閉鎖します」というのを唐突にするのは、
あんまりにも無責任ですし、以降、戦国史界に顔を出しにくいです(?)

そこで、とりあえずサンプルシナリオ改造の一応の完了を見て、
戦国史同盟のコンテンツを出来る限りWeb2.0に、CMSに移行しようと考えています。

とりあえず、具体案を示します。(進捗予定は未定)
戦国史Wiki を、現状のPukiwikiから、Pukiwiki Plus!に移行し、複数管理人制を導入します。
戦国史同盟のアップローダ掲示板といった機能は、OpenPNE3を導入して、無料登録ID制にはなりますが、自由に感想、コメント、意見の言い合える、敷居の低いSNSを実現します。
戦国史同盟の主要コンテンツは、SOYCMSMagic3などのCMSを導入して、複数管理人制を導入し、コンテスト等も大人数で開催できるようにします。

これは、理想案。
OpenPNE3を導入することで運営するSNSは「戦国史SNS」ではなく、「シミュレーションゲーム製作ツールのSNS」もしくは「ゲーム製作ツールのSNS」として門戸を広げる。
他ゲーム間での情報交換や、素材提供、また他ゲームユーザの戦国史への勧誘などにも効果はあるのかな?

まるで有り得ない案。
コンテストに何かしらでかめのスポンサーを付ける(笑)

一応時間があれば地道に取り組んで行く予定ではありますので、
「頑張ってください!」(自分で言うな)などの応援コメントや、
「それはちょっと…」「こういう案はどうか」などのご助言コメントなど、
いろいろ下されば励みになりますし、作業もはかどります。
ブログはちょくちょく見ていますので、どうぞ宜しくお願い致します。

at 04:22|Edit

Comment