6.3 Side Panel

Side Panelとは

ブラウザの右側に常時表示できるパネル。Popupより広いスペースで操作可能。

// manifest.json
{
  "permissions": ["sidePanel"],
  "side_panel": {
    "default_path": "sidepanel/sidepanel.html"
  }
}

サイドパネルを開く

// アイコンクリックでサイドパネルを開く
chrome.sidePanel.setPanelBehavior({ openPanelOnActionClick: true });

// プログラムで開く
chrome.sidePanel.open({ windowId: chrome.windows.WINDOW_ID_CURRENT });

動的なパネル設定

// 特定のタブでのみ有効化
chrome.sidePanel.setOptions({
  tabId: tabId,
  path: 'sidepanel/custom.html',
  enabled: true
});

// グローバル設定
chrome.sidePanel.setOptions({
  path: 'sidepanel/default.html'
});

活用例

• AI チャットアシスタント
• メモ・ノートアプリ
• 翻訳ツール
• ページ情報の詳細表示
• タスク管理ツール