スライドのページ数をつけるときに、総ページ数も表示したいなと思いました。その方法について書いておきます。この書式だと、全体のうち現在どの辺の位置にいるのかがわかります。
完成イメージ
スライドの右下に、「(現在ページ)／(総ページ数)」の書式になるよう設定します。
Before（デフォルト）
After
前提
Marpについて
VS Codeの拡張機能「Marp」を使ってスライドを作ります。これは、Markdown記法で記述するだけでレイアウトを気にしなくても勝手に適切にスライドを作れるツールです。詳しくは過去記事を参照してください。
CSSの適用について
スライドを作るMarkdownファイルにCSSを適用する必要があります。
適用の方法は過去記事を。
方法
Markdownファイルの記述
スライドを作りたいMarkdownファイルを開き、以降にページ番号をつけたいページ*1に次のコードを書きます。
<!-- paginate: true -->
ページ番号付けを有効にするコードです。
CSSファイルの記述
Markdownファイルに適用されているCSSファイルを開きます。その中に、次のコードを追加します。
/* ページの書式をnow/totalに */
section::after {
content: attr(data-marpit-pagination) " / " attr(data-marpit-pagination-total);
}
以上です！
仕組み（おまけ）
Marpのシステム中にある現在のページ数を示す「data-marpit-pagination」や総数を示す「data-marpit-pagination-total」をCSSのattr()関数でそれぞれ取得しています。
それを「content」で書式を整え、ページを示すsectionの最後の擬似要素（after）として適用することで表示させているようです。
...備忘録を公開する上で自分の認識が間違っていないか調べていたところ、公式に載ってました。していることはほとんど同じで、説明は開発者向けとのことなので、Marpを深く理解する必要がなければコードを参考にするのみで良いかと思います。
*1:例えば、タイトルページ（１枚目）のみページ番号を振りたくないなら、２枚目のページ
