Table Of Contents Generator

Table of Contents Generator

Creates table of contents slides for PowerPoint presentations using PptxGenJS. Used for navigation and expectation setting.

Layout Options

Code Example: Numbered Vertical List

function createSlide(pres, theme) {
  const slide = pres.addSlide();
  slide.background = { color: theme.bg };

  // Title
  slide.addText("Table of Contents", {
    x: 0.5, y: 0.3, w: 9, h: 1,
    fontSize: 40, fontFace: "Arial",
    color: theme.primary, bold: true
  });

  // Sections
  const sections = [
    { num: "01", title: "Introduction & Overview" },
    { num: "02", title: "Architecture Design" },
    { num: "03", title: "Implementation Strategy" },
    { num: "04", title: "Results & Next Steps" }
  ];

  sections.forEach((s, i) => {
    const y = 1.5 + i * 0.9;

    // Section number
    slide.addText(s.num, {
      x: 0.5, y: y, w: 0.8, h: 0.6,
      fontSize: 28, fontFace: "Arial",
      color: theme.accent, bold: true, align: "center"
    });

    // Section title
    slide.addText(s.title, {
      x: 1.5, y: y, w: 7, h: 0.6,
      fontSize: 22, fontFace: "Arial",
      color: theme.secondary
    });
  });

  // Page number badge
  slide.addShape(pres.shapes.OVAL, { x: 9.3, y: 5.1, w: 0.4, h: 0.4, fill: { color: theme.accent } });
  slide.addText("N", { x: 9.3, y: 5.1, w: 0.4, h: 0.4, fontSize: 12, color: "FFFFFF", bold: true, align: "center", valign: "middle" });

  return slide;
}
module.exports = { createSlide };

Common Pitfalls

• Too many sections: TOC works best with 3-7 sections
• Inconsistent numbering: Match numbering style with section dividers
• No visual markers: Use colored dots, lines, numbers, or icons to anchor each section
• Missing page badge: TOC MUST include page number badge

Verification Checklist

• Section count appropriate (3-7)
• Section numbers/formatting consistent
• Page number badge included
• Scannable structure (viewer can scan in 2-3 seconds)
• Matches visual style of cover page