Amazonで商品を見るセール会場へ

Redmine│Wikiの記法まとめ|画像のサイズ指定と横並び

RedmineのWikiで使うTextile記法を、画像・表・見出し・マクロに分けてまとめます。

最初に編集画面の書式ヘルプで、利用中の書式を確認してください。

2026年10月24日に公式資料と本文の構文を照合しました。

利用中のRedmineでの描画や保存後の表示は未検証です。

目次

よく使う記法チートシート(コピペ用)

Textile 記法を選択した環境での書き方です。公式の記法ページで確認できる構文だけを並べています。

やりたいこと書き方
見出しh1. ページ見出し / h2. 大見出し / h3. 小見出し (行頭に書く)
目次(左寄せ){{toc}}
目次(右寄せ){{>toc}}
添付画像をそのまま表示!image.png!
画像の幅をpxで指定!{width:640px}image.png!
画像の幅を%で指定(はみ出し対策)!{width:100%}image.png!
画像を右に回り込ませる!>image.png!
画像にタイトルを付ける!image.png(タイトル)!
クリックで拡大するサムネイル{{thumbnail(image.png, size=300, title=拡大)}}
長文を折りたたむ
{{collapse(詳細を見る)
ここに本文
}}
他ページを読み込む{{include(ページ名)}}
別プロジェクトのページを読み込む{{include(プロジェクト識別子:ページ名)}}
子ページの一覧{{child_pages}} / 階層を2段に {{child_pages(depth=2)}}
チケットへのリンク(件名付き){{issue(123)}}
水平線----
引用bq. 引用する本文 (行頭に書く)
赤文字%{color:red}赤文字%
蛍光ペン%{background-color: #ffff00}蛍光ペン%

出典は Redmine 公式の RedmineTextFormattingTextile です。

スポンサーリンク

RedmineのWikiでよくつかう記法

Textileの本文書式に、Redmineのリンク記法やマクロを組み合わせます。

見出し

h1. ページ見出し

行頭のh1.の後に半角スペースと見出し本文を書きます。

Wikiページ名そのものを変更する操作ではありません。

h2. 大見出し

大見出し

h3. 小見出し

小見出し

この3つで十分。

目次

{{toc}}

そのページの構成がひと目でわかります。

画像

!{width:640px}image.jpg!

画像のサイズは固定にします。

よく使うので単語登録。

並列に画像を複数並べる

|!{width:320px}a.jpg!|!{width:320px}b.jpg!|

表の1行2セルへ画像を入れる例です。

区切りは各境界に1本の縦棒を使います。

幅320pxの画像2枚でも狭い画面でははみ出す場合があるため、プレビューで確認してください。

水平線

----

一旦、仕切りたい時に。

リンク

"Redmine.JP":http://redmine.jp/

リポジトリのリンク

source:trunk / 特定リビジョンの例:source:trunk@52

リポジトリ内のファイルやディレクトリーにはsource:を使います。

パス・リビジョン・ブランチの指定は登録済みリポジトリに合わせてください。

URLの一部を削れば常に最新になるとは限りません。

テーブル

Wikiのテーブルに色を付ける方法

Wikiのテーブルに色を付ける記法の指定例または表示結果。

table{background:#F5F5F5}.
{background:#666666}. |_. %{color:white}親フォルダ%|_. %{color:white}子フォルダ%|_. %{color:white}備考% |_. %{color:white}発注%|_. %{color:white}制作%|
|/4=. TEST |=.A |. -|/2=. - |/2=. -|
|=.B |. - |
|=.C |. - |=. - |=. -|
|=.D |. - |=. - |=. -|

引用

bq. 引用する本文

折りたたむ

長文を隠したい時に

{{collapse
あいうえお
}}

赤文字

%{color:red}赤文字%

蛍光ペン

%{background-color: #ffff00}蛍光ペン%

蛍光ペン風の強調表示

箇条書き項目

行頭の記号と半角スペースで箇条書きを作ります。

アスタリスクを2つにすると下位の階層になります。

太字を指定するHTMLタグの違いではありません。

第1階層の例

* 親項目

直前の親項目に続けて書く第2階層の例

** 子項目

画像のサイズ指定と並べ方

Wikiに添付した画像は、ファイル名だけで本文に出せます。

そのままだと元のサイズで出るので、幅を指定して揃えるのが基本です。

やりたいこと書き方
添付した画像を表示する!image.png!
幅を指定する!{width:640px}image.png!
親の幅いっぱいに広げる!{width: 100%}image.png!
右に回り込ませる!>image.png!
altとタイトルを付ける!image.png(説明文)!
画像にリンクを付ける!image.png!:https://example.com
横に並べる|!{width:320px}a.png!|!{width:320px}b.png!|

幅の指定はCSSと同じ書き方なので、pxでも%でも通ります。

width: 100%にすると、置いた場所の幅に合わせて伸び縮みします。

クリックで拡大できるサムネイルにする

一覧に小さく並べて、必要な人だけ拡大して見てもらいたい場合があります。

その場合はサムネイルのマクロを使います。

書き方内容
{{thumbnail(image.png)}}サムネイルで表示する。既定の大きさは200ピクセル
{{thumbnail(image.png, size=300, title=説明)}}大きさとタイトルを指定する

サムネイルはクリックすると元の画像が開きます。

手順書のように画像が多いページでは、縦に長くならずに済みます。

添付した画像をクリックで拡大できるサムネイルにします。引数を省略すると200ピクセルで表示されます。

{{thumbnail(image.png)}}

大きさとマウスオーバー時のタイトルを指定する場合は、size と title を付けます。

{{thumbnail(image.png, size=300, title=Thumbnail)}}

公式の記法ページでは、{{thumbnail(image.png)}} が既定200ピクセル、{{thumbnail(image.png, size=300, title=Thumbnail)}} が大きさとタイトルを指定する形として記載されています(RedmineTextFormattingTextile)。画像はそのページに添付されている必要があります。

ページをまたいで使うマクロ

ページが増えてくると、同じ内容を何度も書くことになります。

Redmineには、それを避けるためのマクロがあります。

書き方内容
{{include(ページ名)}}別のWikiページの内容をそのまま読み込む
{{include(プロジェクト識別子:ページ名)}}別プロジェクトのページを読み込む
{{child_pages}}そのページの子ページを一覧にする
{{child_pages(ページ名, parent=1)}}指定したページの子を、親へのリンク付きで一覧にする

共通の注意事項を1ページにまとめて、各ページから読み込む使い方が便利です。

直すときも、読み込み元の1ページだけ直せば済みます。

書式の種類やRedmineの版によって対応が異なります。

特にMarkdownの生HTMLは既定で許可されないと公式ページに記載されているため、imgタグによるサイズ指定を共通手順として扱わないでください。

仕事が捗るほかのツールは、まとめからご覧いただけます。

この記事で紹介しているコードは、GitHubのMOTOKI-LLC/cg-method-codeにもまとめています。

仕事で使うWebサービスの記事は、ほかにもあります。

共通の注意書きや環境情報を1ページにまとめ、各ページから読み込むと更新漏れが減ります。

{{include(ページ名)}}

別プロジェクトの Wiki から読み込むときは、プロジェクトの識別子を付けます。

{{include(プロジェクト識別子:ページ名)}}

マニュアルの目次ページには、子ページの一覧を自動生成するマクロが便利です。

{{child_pages}}
{{child_pages(depth=2)}}
{{child_pages(Foo)}}

depth=2 は2階層までの表示、{{child_pages(Foo)}} は別ページ Foo の子ページ一覧です(RedmineTextFormattingTextile)。

注意:Textile 記法と Markdown 記法で書き方が変わるもの

Redmine のテキスト書式は Textile と Markdown を選べます。本記事の画像・文字装飾の構文は Textile 向けです。Markdown に設定されている場合、画像や表の書き方が変わります。

やりたいことTextileMarkdown
添付画像の表示!image.png!![](image.png)
幅を指定!{width:100%}image.png!HTMLのimg記法が許可されるかは書式エンジン・設定次第。通常のMarkdown画像記法だけでは幅指定を共通化できない
表|見出し|見出し|(|_. で見出しセル)|見出し|見出し| の下に |---|---| の行が必要

一方で {{toc}}、{{collapse}}、{{include}}、{{thumbnail}}、{{child_pages}} といったマクロは、公式の Markdown 記法ページにも同じ形で記載されています(RedmineTextFormattingMarkdown)。{{toc}} は公式のTextile・Markdown説明ともに前後に空行が必要で、同じ行に他の文字を置かない点が明記されています。

自分の環境の設定は、Wiki の編集画面にある書式のヘルプ(リンク先が Textile か Markdown のどちらの説明になっているか)で見分けられます。管理権限があれば[管理]→[設定]のテキスト書式の項目で確認できます。

書式と添付画像を確認する順番

Wikiを書くときの、おおまかな順番です。

内容は、このページの説明にもとづく目安です。

記法はRedmineの設定やバージョンによって異なります。

このページはTextile記法を選択した環境の書き方です。

お使いのRedmineで、書式の設定を確認してください。

  1. まず、お使いのRedmineの書式が、Textile記法か、Markdown記法かを確認する。ページ末尾の「Textile 記法と Markdown 記法で書き方が変わるもの」も参照する。
  2. 見出しと目次から整える。見出しは行頭に書き、目次は専用のマクロで入れる。
  3. 画像を使う場合は、まず、そのページに画像を添付する。ファイル名だけで本文に出せる。
  4. 画像が大きすぎる場合は、幅を指定して揃える。幅はCSSと同じ書き方で、pxでも%でも指定できる。
  5. 画像が多いページでは、クリックで拡大できるサムネイルのマクロを使うと、縦に長くならずに済む。
  6. 同じ内容を何度も書く場合は、ページをまたいで使うマクロを使う。

書いたあとは、プレビューで表示を確認してから保存してください。

スポンサーリンク

よくある質問:RedmineのWiki記法で迷ったときのチェックリスト

Redmineの記法は、Textileですか?Markdownですか?

このページでは、Textile記法を選択した環境での書き方を紹介しています。

公式の記法ページで確認できる構文だけを並べています。

お使いのRedmineの設定によって、使える記法が異なります。

画像のサイズは、どう指定しますか?

幅を指定して揃えるのが基本です。

幅の指定はCSSと同じ書き方で、pxでも%でも通ります。

100%にすると、置いた場所の幅に合わせて伸び縮みします。

画像を右に回り込ませたり、横に並べたりできますか?

できます。

ページの「画像のサイズ指定と並べ方」の表で、書き方を紹介しています。

サムネイルを使うには?

サムネイルのマクロを使います。

引数を省略すると、200ピクセルで表示されます。

大きさとマウスオーバー時のタイトルを指定することもできます。

画像は、そのページに添付されている必要があります。

画像が表示されないときは?

画像がそのページに添付されているかを確認します。

サムネイルのマクロも、画像はそのページに添付されている必要があります。

ページをまたいで使えるマクロは?

ページが増えてきて、同じ内容を何度も書くことになるときに使います。

ページ内の「ページをまたいで使うマクロ」の表で紹介しています。

次に学ぶ・作業環境を選ぶ

学習を続けたい方や、作業環境を整えたい方は、目的に合うガイドをご覧ください。

仕事効率化のおすすめ書籍

仕事用PCの選び方

よかったらシェアしてね!
  • URLをコピーしました!
  • URLをコピーしました!

この記事を書いた人

須澤 元貴のアバター 須澤 元貴 代表社員

MOTOKI合同会社 代表社員。
アニメ・映像業界とゲーム業界で、2D・UI・3D・アニメーション制作、映像編集、ツール制作に携わってきました。
現在はWordPressを中心にWebサイトの制作とカスタマイズを手がけています。
著書に『Unity デザイナーズ・バイブル』『Unityゲーム プログラミング・バイブル 2nd Generation』(ボーンデジタル)。
岡山県出身、埼玉県在住。

目次