Movable TypeでMTLoopを使ってkeyでソートしたときに、10個以上表示させると並びがおかしくなる

Movable Typeで配列を作成して<mt:loop>を「sort_by="key"」でkey順にループしたいときがありました。
<mt:CategorySets id="1">
<mt:SetVar name="undef(arr)">
<mt:SubCategories category="$const_maincategory">
<mt:SetVarBlock name="arr" key="$count"><$MTCategoryLabel$></mt:SetVarBlock>
</mt:SubCategories>
</mt:CategorySets>
<mt:loop name="arr" sort_by="key">
<mt:if name="__first__">
<ul>
</mt:if>
<mt:getVar name="__value__" />
<mt:if name="__last__">
</ul>
</mt:if>
</mt:loop>しかしこれを実行すると、意図した並びになりませんでした。
表示する数が少ない場合は問題ありませんでしたが、10個以上になった場合に、下記のように1番目と2番目の間に10番目や11番目が割り込んできてしまいます。
- 1番目
- 10番目
- 11番目
- 12番目
- 13番目
- 2番目
- 3番目
- 4番目
- …
数字としての「10」ではなく「1と0」としか認識していないようです。
解決方法:先頭に「0」をつける
仕方がないのでkeyが1桁の場合は先頭に「0」をつけるようにしました。
こうすれば「01、02、03…10、11」と正しく並んでくれます。
<mt:CategorySets id="○">
<mt:SetVar name="undef(arr)">
<mt:SetVar name="count" value="0">
<mt:SubCategories category="$const_maincategory">
<mt:if tag="count" like="^\d{1}">
<mt:setVarBlock name="keyCount"><mt:getVar name="count" regex_replace="/^\d{1}/","0$1" /></mt:setVarBlock>
<mt:else>
<mt:setVarBlock name="keyCount"><mt:getVar name="count" /></mt:setVarBlock>
</mt:if>
<mt:SetVarBlock name="arr" key="$keyCount"><$MTCategoryLabel$></mt:SetVarBlock>
<mt:SetVar name="count" op="++">
</mt:SubCategories>
</mt:CategorySets>
<mt:loop name="arr" sort_by="key">
<mt:if name="__first__">
<ul>
</mt:if>
<mt:getVar name="__value__" />
<mt:if name="__last__">
</ul>
</mt:if>
</mt:loop>追加した処理は下記の部分です。
<mt:if>を使って1桁かどうかを確認して、1桁の場合は「regex_replace」で数字の先頭に「0」を追加したものを「keyCount」という変数に入れています。
<mt:if tag="count" like="^\d{1}">
<mt:setVarBlock name="keyCount"><mt:getVar name="count" regex_replace="/^\d{1}/","0$1" /></mt:setVarBlock>
<mt:else>
<mt:setVarBlock name="keyCount"><mt:getVar name="count" /></mt:setVarBlock>
</mt:if>もともと「count」変数をkeyに入れていたのですが、先頭に「0」追加が必要になったのでそれとは別に「keyCount」をつくってそれをkeyに入れるようにしています。
これで意図した順番になります。
- 01番目
- 02番目
- 03番目
- 04番目
- …
- 10番目
- 11番目
- 12番目
- 13番目
ただループしているだけなのに、どうして順番がおかしくなるのか分からず「key」の番号を出力して確認してようやく気がつけました。
100個以上表示させる場合は3桁にする必要がある
とり急ぎ今回の対応をしましたが、これだと今度は100個以上表示させたときに並びがおかしくなってしまいます。
100個も表示させることはないと思いますが、表示させる可能性がある場合は3桁にする必要があります。

横幅が広がったときの挙動が変わる!CSS Gridの「auto-fill」と「auto-fit」の違い
gulpでPostCSSを使う方法
gulpfile.jsにAutoprefixerのブラウザオプションを書くとエラーがでる場合の修正方法
Visual Studio Codeで「.html」拡張子以外のファイルでもEmmetを使えるようにする
スクロールしてもテーブルヘッダーが追尾するテーブルの作り方
Local by FlywheelでWordPressのローカル開発環境構築のハードルが一気に下がる
ブラウザでこれ以上スクロールできない場合の挙動を制御する「overscroll-behavior」プロパティ
Visual Studio CodeでSVGをプレビューする拡張機能「SVG Preview」
属性・Class・IdなどHTMLタグの細かい部分を見ていこう!!
iTerm2で「Use System Window Restoration Setting」を設定しているとアラートが表示されて機能しない
Google Chromeのサイト内検索(カスタム検索)機能を別のプロファイルに移行する方法
iPadで入力モードを切り替えずに数字や記号をすばやく入力する方法
iPhoneやiPadでYouTubeの再生速度を3倍速や4倍速にする方法
Keynoteで有効にしているはずのフォントが表示されない現象
MacのKeynoteにハイライトされた状態でコードを貼り付ける方法
AirPodsで片耳を外しても再生が止まらないようにする方法
iTerm2でマウスやトラックパッドの操作を設定できる環境設定の「Pointer」タブ
DeepLで「インターネット接続に問題があります」と表示されて翻訳できないときに確認すること
Ulyssesの「第2のエディタ」表示を使って2つのシートを横並びに表示する
Bartender 6で追加されたWidgets機能で自作メニューバーアイテムを簡単に作成する
Googleカレンダーを便利に活用するための小技集(祝日だけを表示・月末の繰り返しイベントを追加)
Obsidianを使った「自己流PKM」で行う知識トレーニング
テキストエディタ・ノートアプリ関連のショートカットキーをKeyboard Maestroで統一する
Path Finderを使ってキーボードだけでファイル操作する方法(応用編)
macOSのコマンドパレット比較!SpotlightとAlfred、Raycastどれを使えばいい?
1つのノートアプリにすべて集約するのをやめた理由|2025年時点のノートアプリの使い分け
Notionログイン時の「マジックリンク」「ログインコード」をやめて普通のパスワードを使う
AlfredでNotion内の検索ができるようになるワークフロー「Notion Search」