出版・寄稿の書籍の行に書影を添える

.claude/skills/publish-qiita/SKILL.md

@@ -60,11 +60,23 @@ description: Qiita の下書き URL と著者名を入力に、hexiita 変換 
 
   - `name` は書名・号の名前、`url` は**出版社の商品ページ**（Amazon ではなく、
     オライリー・技術評論社・KADOKAWA など。Amazon しか無いならそれでよい）
-  - `work` は雑誌だけ。その号に載った寄稿のタイトル。書籍には書かない
+  - `work` は雑誌だけ。その号の**特集・章の名前**。一覧は「号＋`work`」で1行にまとまるので、
+    同じ特集に複数人が寄稿しているなら**同じ文字列**にする（章番号や章タイトルまで
+    書き分けると号が2行に分かれる）。書籍には書かない
+  - `cover` は書籍・雑誌の両方に書ける。**表紙を一覧のパネルの左に出すので、
+    記事のサムネイルが表紙でないときだけ**（本棚や机の写真）画像のパスを書く。
+    省くと `thumbnail` が使われる。ただし**1つの記事で複数の号を紹介するときは
+    サムネイルを借りない**（どの号のものでもないため）ので、表紙を出したい号には
+    `cover` を書く。書かなければ空き枠になる
+    - 号の表紙が手元に無いときは、**出版社のページの書影を
+      `source/images/publications/<誌名>-<号>.jpg` に保存**して指す
+      （`sd-202601.jpg`。幅300pxのJPEGに縮める）。記事ごとのディレクトリに
+      置かないのは、同じ号を複数の記事が指すため
   - `by` は**記事の著者と書いた人が違うときだけ**書く（イベント参加レポートなど）。
-    省くと記事の `author` が使われる。連名は `、` で区切る
-  - **1つの号に複数の寄稿があるなら、その記事が扱う分だけ書く。** 一覧は号ではなく
-    寄稿1件を単位にしているので、同じ号が2行出てよい
+    省くと記事の `author` が使われる。連名は `、` で区切る。
+    **一覧には出ない**（1名しか出ないと共著が単著に見えるため）。記録として残す欄
+  - **1つの号に複数の寄稿があるなら、その記事が扱う分だけ書く。** 同じ号を書いた記事が
+    既にあっても気にしなくてよい。一覧は号ごとに1行へまとめ、寄稿をその行の中に積む
   - **参考として挙げた他者の本は書かない。** 一覧は「フューチャーの社員が書いたもの」で、
     本文に出てくる書籍リンクをすべて拾う場所ではない
   - 並びは `url` から取る号の年月なので、記事の日付とずれていてよい

CLAUDE.md

@@ -728,17 +728,20 @@ bootstrap-subset → theme-styles.styl の順で `/css/site.css` に連結する
   生まれない。以前は 2 / 3 / 5 / 6 / 10 / 14 / 25px が混ざっており、多くは
   「円の直径の半分」のようにその場で計算した値で、隣の部品と揃える理由が無いまま
   1px ずつ違っていた
-- **サムネイルの寸法は4つしかない。新しい値を作らず、器の形で選ぶ**（#2790）。
+- **サムネイルの寸法は5つしかない。新しい値を作らず、器の形で選ぶ**（#2790）。
   いずれも `object-fit: cover` で切り抜き、角丸は `radius-small`。サムネの実寸は
   幅300px・高さがばらばら（比 1.0〜3.2）なので、寸法はこちら側の枠が決める
 
   | 器 | 寸法 | 使うところ |
   | --- | --- | --- |
   | 行に添える（`post-list-icon`） | 72×48 | 関連記事・被参照・ランキング・索引記事の表 |
+  | 表紙（`panel-thumb-cover`） | 60×80 | 出版・寄稿の書籍・技術誌のパネル |
   | 横並びのカード（`panel-thumb`） | 88×59 | サイドバーの枠・記事末のパネル・We're hiring |
   | パネルのグリッド | 200×135 | ホームの連載/特設パネル・`/series/` 一覧 |
   | 一覧カードの頭（`card-thumb`） | 幅100%・`aspect-ratio: 1200/630` | 記事一覧のカード（OGP と同じ比） |
 
+  - **表紙だけ縦長（3:4）。** ほかの4つは横長で、比 0.71〜0.79 の表紙を
+    `cover` で切ると書名が読めない。ここだけ器の向きが中身に従う
   - 比は 3:2 前後に揃っているが完全には一致しない（1.500 / 1.492 / 1.481）。
     200×135 が標準サムネの寸法で、88×59 はその比を88px幅に丸めた値。
     72×48 だけ 3:2 ちょうどなのは、48×32 では何の画像か読み取れず
@@ -1959,15 +1962,58 @@ bootstrap-subset → theme-styles.styl の順で `/css/site.css` に連結する
     57件を実際に見ると、**自社の本と参考に挙げた他者の本が同じ形で混ざる**
     （「日本語書き下ろしで3版まで進んでいるのは Sphinxをはじめようと、本書のみ」・
     「後藤ゆきさん著の細かく紹介している本」）。どちらかは本文を読まないと分からない
-  - **まとめる単位は号ではなく寄稿1件。** 1つの号に複数の寄稿がある
-    （2019年3月号は機械学習の章とJavaScriptの章の2本で、書いた人も違う）
+  - **1枚のパネルは「号＋特集」。題の行が What、添えが報告の記事。**
+    題の行は号の名前（リンク）と特集・章の名前（`panel-card` の `note`。
+    リンクの外に置くので押せない。**色も段も号名と同じ**（`ink-strong` × `text-body`）で、
+    落とすのは太さだけ。**12px には落とさない**——あの段は添え・注記のもので、
+    site.css の 12px を持つ53ルールはすべて `ink-mute` か `ink-faint` と対になっている）、
+    添えは記事へのリンクだけ。**同じ特集に複数の記事があれば添えに積む**
+    （2026年1月号は特集「アルゴリズムはどこに効く？」に2本）。
+    章まで書き分けると同じ号が2枚に分かれるので、`work` は特集の名前でそろえる
+    - **号だけを題にはしない。** 特集の違う寄稿を1枚に畳むと、下に並ぶ記事が
+      どちらの特集のものか読めなくなる（2019年3月号は機械学習の章とJavaScriptの章で、
+      いまも2枚に分かれている）
+    - **特集名を添えに落とさない。** `panel-meta` の中では素の文字（特集名）と
+      リンク（記事）が**同じ段・同じ色**（12px・`ink-mute`。`.panel-meta a` が
+      metronic の青を打ち消して地の文と同じ色にしている）で隣り合い、区別が付かない。
+      **記事のリンクに静止の下線を足す手は採らない**——同じカードの中で
+      号名（hover で下線）と記事（常時下線）が違う振る舞いになる
+    - 題の行と記事の間は 12px（題の行の 4px ＋ `.publication-panels .panel-meta` の 8px）、
+      記事と記事の間は 4px。組の切れ目を刻み2つぶん広く取る
+    - 冊数は23、寄稿は24件なので、**本文が名乗るのは寄稿の件数**（`magazineCount`）
   - **並べるのは記事の日付ではなく「出たもの」の順。** 号の年月は URL の
     `/archive/YYYY/YYYYMM` から取る（2024年8月号の記事が12月に出ていた）。
     巻で数える WEB+DB PRESS は年までしか取れないのでその年の最後に置く。
     **取れる行と取れない行で基準を変えると比較が一貫せず、並びが崩れる**
     （一度踏んだ）。全部を YYYYMM の数値1つに寄せてから比べる
-  - **表紙は並べない。** 買い物ページではなく「誰が何を書いたか」の記録なので、
-    絵よりも書名・寄稿タイトル・執筆者が読めることを優先する
+  - **パネルに執筆者を出さない**（書籍・技術誌とも）。`by`（無ければ記事の `author`）は
+    1名なので、共著・共訳・連名でもその1名だけが出て単著に見える。誰が書いたかは
+    リンク先の記事が名乗る。**`by` はフロントマターの記録として残す**（一覧は出さない）
+  - **書籍・技術誌ともパネルのグリッドで2列**（連載・HTTF と同じ `panel-card`）。
+    **3列にしない**——添えが「執筆者 ／ 記事タイトル」で、3列だと列の文字幅が
+    122〜212px になり添えが3〜4行に折り返す。文字の塊が表紙（80px）より高くなって
+    帯が崩れる。2列なら題は1行、添えは1〜2行で、塊は 43〜82px に収まる（実測）
+  - **表紙を並べる**（#2912 の「表紙は並べない」を改めた）。「絵よりも書名・寄稿
+    タイトル・執筆者が読めることを優先する」は変えていない——表紙はパネルの左の
+    60×80 で、題と添えの可読性を奪わない
+    - **表紙は記事のサムネイルを借りる**（新しい画像を増やさない）。1冊だけを扱う
+      記事はサムネイルにその表紙を使うのが慣例で、書籍8件と技術誌10件がこれに当たる。
+      サムネイルが表紙でない記事だけ `cover:` が上書きする
+    - **複数の号をまとめて紹介する記事のサムネイルは借りない。** 寄稿まとめ記事の
+      サムネイルは表紙のコラージュで、どの号のものでもない。借りられない13件は
+      **出版社の書影を `source/images/publications/<slug>.jpg` に保存**して
+      `cover:` で指した（`sd-201710` のように誌名と号で名付け、幅300pxのJPEG＝
+      記事のサムネイルと同じ寸法に縮める）
+      - **記事ごとのディレクトリに置かない。** 1つの号の表紙を複数の記事が指す
+        （2019年3月号は「寄稿まとめ」と「Software Design 後記」の2記事）ので、
+        どちらかの記事の下に置くと持ち主が決められない
+      - **`cover:` も記事サムネイルも無い号は空き枠（`surface-mute`）**になる。
+        枠と大きさは表紙があるときと同じに保つ（#2864）。いまは0件
+  - **ページ本文でリンク先を説明しない。** 「書名・号の名前は出版社のページに…」の
+    一文は落とした。書名・誌名は**その本・その号の名前そのもの**なので、
+    リンクテキストから外部と読める（#2346 の「印を付けるのはリンクテキストから
+    外部と読めないものだけ」に当たらない）。表紙と題は同じ行き先なので
+    サムネのリンクは読み上げから外している（#2845）
   - **記事の無い書籍は載らない。** 「記事に付随して書く」ことの帰結。
     **ページ本文にはそう書かない**（#2895。読者に語るのは中身であって、
     ページの作り方と収録の運用ではない）

scripts/publications.js

@@ -16,24 +16,56 @@ const issueKey = (url) => {
   return /^\d{6}$/.test(m[2]) ? Number(m[2]) : Number(m[1]) * 100 + 12;
 };
 
-const entry = (post, item) => ({
+/**
+ * 表紙は記事のサムネイルを既定にする。1冊だけを扱う記事はサムネイルにその表紙を
+ * 使うのが慣例で、そうでない記事だけ cover: が上書きする。
+ * **複数の号をまとめて紹介する記事のサムネイルは借りない**（寄稿まとめ記事の
+ * サムネイルは表紙のコラージュで、どの号のものでもない）。表紙が分からない行は
+ * 空き枠になる
+ */
+const coverOf = (post, item, siblings) =>
+  item.cover || (siblings.length === 1 ? post.thumbnail || '' : '');
+
+const entry = (post, item, siblings) => ({
   name: item.name,
   url: item.url,
   work: item.work || '',
   by: item.by || post.author || '',
+  cover: coverOf(post, item, siblings),
   post: { title: post.title, path: '/' + post.path },
   key: issueKey(item.url),
   date: post.date.valueOf(),
 });
 
+/**
+ * 1行は「号＋章」で、同じ章に複数人が寄稿していれば書いた人をその行の中に積む。
+ * 号だけを見出しにすると、章の違う寄稿に並ぶ「誰が」がどちらの章のものか読めない
+ */
+const groupByIssue = (magazines) => {
+  const issues = [];
+  magazines.forEach((m) => {
+    const last = issues[issues.length - 1];
+    const item = { by: m.by, post: m.post };
+    if (last && last.url === m.url && last.work === m.work) {
+      last.items.push(item);
+      // 表紙は同じ号のどれか1つが分かれば足りる
+      last.cover = last.cover || m.cover;
+      return;
+    }
+    issues.push({ name: m.name, url: m.url, work: m.work, cover: m.cover, items: [item] });
+  });
+  return issues;
+};
+
 hexo.extend.helper.register('publications', function () {
   const books = [];
   const magazines = [];
   this.site.posts.forEach((post) => {
-    (post.books || []).forEach((b) => books.push(entry(post, b)));
-    (post.magazines || []).forEach((m) => magazines.push(entry(post, m)));
+    (post.books || []).forEach((b, _i, all) => books.push(entry(post, b, all)));
+    (post.magazines || []).forEach((m, _i, all) => magazines.push(entry(post, m, all)));
   });
   books.sort((a, b) => b.date - a.date || (a.name < b.name ? -1 : 1));
   magazines.sort((a, b) => b.key - a.key || b.date - a.date || (a.name < b.name ? -1 : 1));
-  return { books, magazines };
+  // 冊数ではなく寄稿の件数を本文が名乗るので、まとめる前の数も返す
+  return { books, magazines: groupByIssue(magazines), magazineCount: magazines.length };
 });

scripts/thumbnail_image_size.js

@@ -8,14 +8,21 @@ const { imageSize } = require('image-size');
 
 const currentDir = process.cwd();
 
+const measure = (path) => {
+  const buffer = readFileSync(currentDir + '/source/' + path);
+  const { width, height } = imageSize(buffer);
+  return { width, height };
+};
+
 hexo.extend.helper.register('image_size_attribute', (path) => {
   if (!path) {
     return ''; // pathが未定義の場合や空の場合は空文字を返す
   }
 
-  const fullPath = currentDir + '/source/' + path;
-  const buffer = readFileSync(fullPath);
-  const dimensions = imageSize(buffer);
+  const dimensions = measure(path);
 
   return `width="${dimensions.width}" height="${dimensions.height}"`;
 });
+
+// 属性の断片ではなく数値で受け取る呼び出し元用（panel-card の thumb など）
+hexo.extend.helper.register('image_size', (path) => (path ? measure(path) : null));

source/_posts/2019/20191016-software-design.md

@@ -14,14 +14,17 @@ lede: "2019年は幸運なことに、技術評論社のSoftware Designという
 magazines:
   - name: "Software Design 2019年1月号"
     url: https://gihyo.jp/magazine/SD/archive/2019/201901
+    cover: /images/publications/sd-201901.jpg
     work: "自然言語処理・画像処理における線形代数の応用"
     by: 上野貴史、貞光九月
   - name: "Software Design 2019年3月号"
     url: https://gihyo.jp/magazine/SD/archive/2019/201903
+    cover: /images/publications/sd-201903.jpg
     work: "微分でつなぐ、機械学習とニューラルネットワーク"
     by: 上野貴史、貞光九月
   - name: "Software Design 2019年9月号"
     url: https://gihyo.jp/magazine/SD/archive/2019/201909
+    cover: /images/publications/sd-201909.jpg
     work: "数字認識APIを作って実感"
     by: 上野貴史、貞光九月
 ---

source/_posts/2022/20220128a_フューチャー社員が行ったIT系技術誌への寄稿まとめ(2017～2022年).md

@@ -15,42 +15,52 @@ lede: "フューチャーにおける、ここ4,5年でIT技術系の雑誌へ
 magazines:
   - name: "Software Design 2017年10月号"
     url: https://gihyo.jp/magazine/SD/archive/2017/201710
+    cover: /images/publications/sd-201710.jpg
     work: "脆弱性スキャナVuls入門"
     by: 林優二郎、枇榔晃裕、牛田隆之、神戸康多
   - name: "Software Design 2018年1月号"
     url: https://gihyo.jp/magazine/SD/archive/2018/201801
+    cover: /images/publications/sd-201801.jpg
     work: "脆弱性管理サービスFutureVuls登場"
     by: 林優二郎、牛田隆之、枇榔晃裕
   - name: "Software Design 2019年3月号"
     url: https://gihyo.jp/magazine/SD/archive/2019/201903
+    cover: /images/publications/sd-201903.jpg
     work: "ES2015〜2018を踏まえた、今どきのJavaScriptの書き方"
     by: 澁川喜規
   - name: "Software Design 2019年5月号"
     url: https://gihyo.jp/magazine/SD/archive/2019/201905
+    cover: /images/publications/sd-201905.jpg
     work: "入門！ Go CLIツールとWebアプリを作って学ぶ 第3章"
     by: 澁川喜規
   - name: "Software Design 2019年11月号"
     url: https://gihyo.jp/magazine/SD/archive/2019/201911
+    cover: /images/publications/sd-201911.jpg
     work: "脆弱性スキャナVuls/Trivy/Dockle"
     by: 神戸康多
   - name: "WEB+DB PRESS Vol.120"
     url: https://gihyo.jp/magazine/wdpress/archive/2021/vol120
+    cover: /images/publications/wdpress-vol120.jpg
     work: "最新Vue.js 3 コアチームが解説！ 第2〜4章"
     by: 太田洋介
   - name: "Software Design 2021年7月号"
     url: https://gihyo.jp/magazine/SD/archive/2021/202107
+    cover: /images/publications/sd-202107.jpg
     work: "［特別企画］WSL 2本格入門"
     by: 澁川喜規
   - name: "Software Design 2022年2月号"
     url: https://gihyo.jp/magazine/SD/archive/2022/202202
+    cover: /images/publications/sd-202202.jpg
     work: "Cypressで作る“消耗しない”E2Eテスト環境【2】"
     by: 枇榔晃裕
   - name: "Software Design 2022年3月号"
     url: https://gihyo.jp/magazine/SD/archive/2022/202203
+    cover: /images/publications/sd-202203.jpg
     work: "Cypressで作る“消耗しない”E2Eテスト環境【3】"
     by: 澁川喜規
   - name: "Software Design 2022年4月号"
     url: https://gihyo.jp/magazine/SD/archive/2022/202204
+    cover: /images/publications/sd-202204.jpg
     work: "Cypressで作る“消耗しない”E2Eテスト環境【4】"
     by: 澁川喜規、枇榔晃裕
 ---

source/_posts/2025/20251218a_Software_Design_2026年1月号のアリゴリズム特集に寄稿したお話.md

@@ -15,7 +15,7 @@ lede: "真野さん、松本さんと一緒にSoftware Designの特集記事に
 magazines:
   - name: "Software Design 2026年1月号"
     url: https://gihyo.jp/magazine/SD/archive/2026/202601
-    work: "アルゴリズム特集"
+    work: "アルゴリズムはどこに効く？"
 ---
 
 <a href="https://gihyo.jp/magazine/SD/archive/2026/202601">

source/_posts/2026/20260217a_今なぜ「アルゴリズム」を学ぶのか？_——_Software_Design2026年1月号への寄稿によせて.md

@@ -11,6 +11,10 @@ categories:
 thumbnail: /images/2026/20260217a/thumbnail.jpg
 author: 真野隼記
 lede: "同僚の澁川さん、松本さんと一緒に、Software Design 2026年1月号の第1特集「アルゴリズムはどこに効く？」にて、第3章「パフォーマンス問題の診断とアーキテクチャの再考」を寄稿しました。"
+magazines:
+  - name: "Software Design 2026年1月号"
+    url: https://gihyo.jp/magazine/SD/archive/2026/202601
+    work: "アルゴリズムはどこに効く？"
 ---
 <img src="/images/2026/20260217a/pxl_20260121_025217424.jpg" alt="" width="1000" height="1333">
 

source/specials/publications/index.md

@@ -1,5 +1,5 @@
 ---
 title: 出版・寄稿
-description: "フューチャーの社員が書いた書籍と、技術誌への寄稿の記録です。書名・号の名前は出版社のページに、それぞれの行は書いた本人によるブログの記事にリンクしています。"
+description: "フューチャーの社員が書いた書籍と、技術誌への寄稿の記録です。"
 layout: publications
 ---