管理 | 差分 || 新規作成 || カテゴリ一覧 | ページ一覧 | 更新履歴 | 差分履歴 || アンテナ || PUT || more≫ ≫omit
shortcut: FrontPage || WikiLab | StoreRoom/最新 | 日々の泡 | むず痒いパソコン日記/最新 || HelpPage ||[edit]
category: WikiLab/BeginnerGuidance

WikiLab/BeginnerGuidance/InterWikiと画像の表示 - 画像をフロート表示させる試み。

LastModified :
[管理]

画像をフロート表示させる試み。

2003/04/02(Wed)
修正 2003/04/08(Tue)
追加 2003/05/02(Fri)
wal4 修正 2003/06/25(Wed)
| WikiLab | WikiLab/BeginnerGuidance |

画像のフロート表示

[TOP↑] [管理]

テキスト回り込みを解除する。_

[TOP↑] [管理]

大きな画像を貼った場合など、適宜テキストの回りこみを制御するルールを追加する必要があります。

ファイルアップとの連携。

[TOP↑] [管理]

なお、ファイルアップ CGI をつけてデータ用ディレクトリを登録すると、ちょっと便利です。 ファイルアップ用の CGI WalWiki:WalRack2 を「なんとな〜く wiki のフリして使う試み」はこちらのページをご覧下さい。

コメント

[TOP↑] [管理]

お名前: タイムスタンプを更新: 荷札を付ける:


InterWiki 登録ディレクトリ内画像のインライン表示。[Wal3以前]

[TOP↑] [管理]

InterWikiName のページにディレクトリを登録すると、[[ 登録名:ファイル名 ]] でディレクトリ内のファイルにリンクを張ることが出来ますが、例えば theme ディレクトリ内の画像ファイルを <img src=""> で呼び出せるといいんじゃないかと思いました。こんな感じで。

2003/04/02(Wed)


InterWiki のインライン画像表示は Wal4 で追加されました。
できればそちらを使うことをお勧めします。


概要。

[TOP↑] [管理]

簡易版:全ての画像ファイルをインライン表示する

[TOP↑] [管理]

書き換える部分。sub make_link

if ($remoteurl) {
#   $remoteurl =~ s/\b(euc|sjis|ykwk|asis)\(\$1\)/&interwiki_convert($1, $localname)/e;      # Walrus del [amazon associate]
    $remoteurl =~ s/\b(euc|sjis|ykwk|asis|isbn)\(\$1\)/&interwiki_convert($1, $localname)/e; # Walrus add [amazon associate]
    return qq(<a href="$remoteurl">$escapedchunk</a>);
} else {

拡張子が gif png jpe jpeg の場合は、インライン表示するように修正

# if ($remoteurl) {
+ if ($localname =~ /.*(gif|png|jpe?g)/){
+     $remoteurl =~ s/\b(euc|sjis|ykwk|asis|isbn)\(\$1\)/&interwiki_convert($1, $localname)/e;
+     return qq(<img src="$remoteurl">);
+ }elsif ($remoteurl) {
#     $remoteurl =~ s/\b(euc|sjis|ykwk|asis)\(\$1\)/&interwiki_convert($1, $localname)/e;
      $remoteurl =~ s/\b(euc|sjis|ykwk|asis|isbn)\(\$1\)/&interwiki_convert($1, $localname)/e;
      return qq(<a href="$remoteurl">$escapedchunk</a>);                                 
} else {
#            if ($remoteurl) {
+            if ($localname =~ /.*(gif|png|jpe?g)/){
+                $remoteurl =~ s/\b(euc|sjis|ykwk|asis)\(\$1\)/&interwiki_convert($1, $localname)/e;
+                return qq(<img src="$remoteurl">);
+            }elsif ($remoteurl) {
                 $remoteurl =~ s/\b(euc|sjis|ykwk|asis)\(\$1\)/&interwiki_convert($1, $localname)/e;
                 return qq(<a href="$remoteurl">$escapedchunk</a>);
             } else {

InterWiki の登録名が img で始まる場合のみ、画像をインライン表示。

[TOP↑] [管理]

画像のフロート表示。[Wal3以前]

[TOP↑] [管理]

ついでに、画像をフロート表示できるようにする試み。 wiki.css に以下の指定を追加しておきます。

img.left   { border: none; float:left; }
img.right  { border: none; float:right; }
.clear { clear:all; }

ファイルの URL を記述してインライン表示した画像をフロートさせる。

[TOP↑] [管理]

sub make_link

       if ($use_autoimg and $chunk =~ /\.(gif|png|jpeg|jpg)$/) {
           return qq(<a href="$chunk">$name</a>);                    # Walrus add [alias link]
           # return qq(<a href="$chunk"><img src="$chunk"></a>);     # Walrus del [alias link]
       } else {
           return qq(<a href="$chunk">$name</a>);                    # Walrus add [alias link]
           # return qq(<a href="$chunk">$chunk</a>);                 # Walrus del [alias link]
       }

       if ($use_autoimg and $chunk =~ /\.(gif|png|jpeg|jpg)$/) {
+          if ($name =~ /floatl/) {
+              return qq(<img src="$chunk" class="left">);
+          } elsif ($name =~ /floatr/) {
+              return qq(<img src="$chunk" class="right">);
+          } else {
               return qq(<a href="$chunk">$name</a>);                # Walrus add [alias link]
               # return qq(<a href="$chunk"><img src="$chunk"></a>); # Walrus del [alias link]
+          }
       } else {
           return qq(<a href="$chunk">$name</a>);                    # Walrus add [alias link]
           # return qq(<a href="$chunk">$chunk</a>);                 # Walrus del [alias link]
       }

2行目 4行目の floatl floatr の部分は、それぞれ任意の文字列に変えて構いません。

InterWiki に登録したディレクトリの画像をフロート表示させる。

[TOP↑] [管理]
# if ($remoteurl) {
#--------------------ここから--------------------
  if ($intername =~ /img.*/){
      if ($localname =~ /.*(gif|png|jpe?g)/){
          if ($name =~ /floatr/) {
              $remoteurl =~ s/\b(euc|sjis|ykwk|asis|isbn)\(\$1\)/&interwiki_convert($1, $localname)/e;
              return qq(<img src="$remoteurl" class="right">);
          } elsif ($name =~ /floatl/) {
              $remoteurl =~ s/\b(euc|sjis|ykwk|asis|isbn)\(\$1\)/&interwiki_convert($1, $localname)/e;
              return qq(<img src="$remoteurl" class="left">);
          } else {
              $remoteurl =~ s/\b(euc|sjis|ykwk|asis|isbn)\(\$1\)/&interwiki_convert($1, $localname)/e;
              return qq(<img src="$remoteurl">);
          }
      } else {
          $remoteurl =~ s/\b(euc|sjis|ykwk|asis|isbn)\(\$1\)/&interwiki_convert($1, $localname)/e;
          return qq(<a href="$remoteurl">$escapedchunk</a>);
      }
  }elsif ($remoteurl) {
#--------------------ここまで追加行--------------------
#     $remoteurl =~ s/\b(euc|sjis|ykwk|asis)\(\$1\)/&interwiki_convert($1, $localname)/e;
      $remoteurl =~ s/\b(euc|sjis|ykwk|asis|isbn)\(\$1\)/&interwiki_convert($1, $localname)/e;
      return qq(<a href="$remoteurl">$escapedchunk</a>);
  } else {

テキストの回りこみを解除する。

[TOP↑] [管理]

出張ざれごと。「wiki とテキストと画像」

[TOP↑] [管理]

wiki は(あるいは Webは?)主にテキストを扱うものと認識されている気がするんだけど、世の中に画像の好きな人は多い(含む私)。

小さなグループ内で最初に wiki を設置したとき、やっぱり皆に敬遠されてしまった。 一応、wiki で作業を進めるにはうってつけと思えるテーマがあって、「私が提示した不完全な情報を、補完していってください」とお願いしたんだけど、既に設置してあって使い慣れた掲示板のほうに追加情報が書き込まれてしまう。「任意位置で改行が出来ない」というようなところでの戸惑いが、結構致命的だったりするらしい。改行の整形ルールを作ってみたりはしたけど、結局、私が掲示板から情報を拾い出して、wiki に書き写すことになった。

しばらくして、そのグループでちょっとしたイベントがあった時に、デジタルカメラを持参していた約一名に、「写真を wiki に貼り付けてくれるように」とお願いした。 パソコン自体あまり使い慣れない方だったので、渾身の力を込めた丁寧な「ファイルアップの仕方と、写真の貼り付け方」の説明を書いて断れない状況に追い込み(^-^;)、なんとか実行していただいた。 上で書いた wiki の運用に失敗したとき、この方は写真をメールで送ってきてくれた。 それを wiki に貼り付けておいたら、「メールを送ってほんの数時間で写真入のページが出来ていた」ということにしきりに感心するので、「誰にでもできるんだよ」と話して興味を持っていただけた、というわけ。

常用している掲示板では、一つの書き込みに一つのファイルしか添付できない。 20枚の写真には20個書き込み、それに対して感想の返信を続けていけば、イベント以前の古い書き込みがどんどん過去ログに流れていってしまう。イベントに関係ない話題も書き込みづらい雰囲気になってしまう。「ページを作る」というのが、「掲示板ではできないこと」と認識してもらえたのか、次のイベントのときは、お願いしていない方も wiki に写真を置いてくれ、この wiki は「イベントがあったときのアルバム用」という地位を得た。

そんなわけで、取っ掛かりとして「画像」っていうアピールはありなんじゃないかと思う次第。

但しアルバム祭りは、グループ内のブロードバンド環境にない若干名には、気の毒だったかもしれない。 画像をリサイズしたり圧縮し直したり、ページを分け直したりは必要。 その辺も、WalRack(パス制限なし) と Wiki の組み合わせなら各自「自分の都合のいいように」編集し直せるので、○。

shortcut: FrontPage || WikiLab | StoreRoom/最新 | 日々の泡 | むず痒いパソコン日記/最新 || HelpPage || [edit]
select css: default | sakura | mono | greenheck | snow | NN4.x用(多分) || LinuZau!! | VikiWiki!? || others |

管理 | 差分 || 新規作成 || カテゴリ一覧 | ページ一覧 | 更新履歴 | 差分履歴 || PUT