• ホームページ
  • ヘルプセンター
  • 機能ガイド
  • Sider Code - 文章で簡単にウェブサイトをカスタマイズ

Sider Code - 文章で簡単にウェブサイトをカスタマイズ

どんなウェブサイトもあなた好みに。望むことを伝えるだけで、AIがコード不要でページをカスタマイズします。

Sider Codeとは?

Sider CodeはAIを活用したウェブページカスタマイズツールで、ほぼすべてのウェブページを簡単な自然言語で変更できます。 コードを書く代わりに、変更したい内容を伝えるだけで、Sider Codeがあなたの要望を理解しページをカスタマイズします。 Sider Codeでできること:
  • AI搭載機能の追加、例えば長文記事の要約ボタンの追加や何千ものコメントの要約など
  • 注意をそらす要素の削除、広告やポップアップ、サイドバー、またはスポンサーコンテンツの除去など
  • ページの見た目カスタマイズ、ダークモードへの切り替えやページレイアウトの変更など
たとえば、以下のように依頼できます:
  • 「コメントを要約するボタンを追加して」
  • 「このページのすべての広告を削除して」
  • 「サイドバーを隠して記事を全幅表示にして」
  • 「このページをもっとシンプルで読みやすくして」
詳しい例は、こちらをご覧ください:sider.ai/agents/code

Sider Codeの設定方法

Sider Codeを使う前に、次の2つの簡単な設定手順を完了してください:
  1. ユーザースクリプトを有効にする
  1. Sider Operatorをインストールする
これらのステップで、Sider Codeがウェブページの変更を適用し、カスタマイズのテストやデバッグを自動で行えるようになります。

ステップ1:Sider Codeを開く

Siderのサイドバーを開き、Codeアイコンをクリックします。 Sider Codeのウェルカムページが表示されます。はじめるをクリックしてください。
WechatIMG1815.jpg


ステップ2:ユーザースクリプトを有効にする

Sider Codeはウェブページの変更を適用するためにユーザースクリプトの権限が必要です。 設定パネルで拡張機能の設定を開くをクリックしてください。 Chromeの拡張機能設定ページが開きます。 ユーザースクリプトを許可を見つけてオンにしてください。 有効化したらSider Codeのパネルに戻ると、最初の設定ステップが完了済みになります。
WechatIMG1817.jpg


ステップ3:Sider Operatorをインストール

次にSider Operatorをインストールします。 Sider OperatorはSider Codeがウェブページの変更をテスト・デバッグできるよう支援し、カスタマイズがより安定して動作するようにします。 Sider Codeの設定パネルでSider Operatorを入手をクリックすると、 ChromeウェブストアのSider Operatorページが開きます。
WechatIMG1818.jpg


ステップ4:Sider OperatorをChromeに追加

ChromeウェブストアのページでChromeに追加をクリックします。 Chromeが確認ウィンドウを表示するので、拡張機能を追加をクリックしてください。 インストール完了後、Sider Codeに戻ってウェブページのカスタマイズを開始できます。
WechatIMG1819.jpg


Sider Codeの使い方

ステップ1:Sider Codeを開く

カスタマイズしたいウェブページを開き、SiderサイドバーのCodeアイコンをクリックします。

ステップ2:AIへ変更内容を伝える

あなたの望みをわかりやすい言葉で伝えてください。
例えば:
  • 「このページのスポンサー投稿を削除して」
  • 「浮動の目次を追加して」
  • 「各商品に商品の評価を表示して」
また、広告削除ダークモード切替画像一括抽出自動スクロールなどの提案されたプロンプトをクリックすることもできます。
WechatIMG1832.jpg


ステップ3:確認と調整

Sider Codeは現在のページに変更を適用します。 もし結果が希望通りでなければ、追加の指示を続けてください。 例えば:
  • 「フォントを小さくして」
  • 「コメント欄は残して」
  • 「右のサイドバーだけ削除して」
  • 「スペースを広げて」
特定の部分でうまくいかない場合は、変更したい部分のスクリーンショットを撮ってAIにどう変えたいか伝えられます。
例えば:
  • 「このセクションを消して」
  • 「このボタンを小さくして」
  • 「このブロックを上に移動して」
  • 「この部分が窮屈に見えるので、もっとすっきりさせて」
WechatIMG1829.jpg

スクリーンショットはAIが正確な場所を理解し、より精密な変更を行うのに役立ちます。 複雑な変更の場合は、最適な結果を得るために数回の追加指示が必要なこともあります。 スクリプトが生成されたらページを更新して効果を確認してください。

カスタマイズの管理

カスタマイズを整理して管理するには、次のことが可能です:
  • カスタマイズごとに新しいチャットを開始 別のスクリプトを作る際は特に、異なるウェブサイトや同じサイトの別バージョンごとに新しいチャットを使ってください。
  • マイスクリプトで保存済みスクリプトを確認 マイスクリプトパネルを開くと、保存したすべてのカスタマイズが見えます。
WechatIMG1830.jpg

  • スクリプトをいつでもオン/オフ切替可能 スクリプトがオンの時は、同じウェブサイトにアクセスするたび自動的にカスタマイズが適用されます。 マイスクリプトからいつでも切り替えられます。
WechatIMG1833.jpg


指示は具体的に伝えてください

要望は具体的であるほど結果が良くなります。
例えば:「これを良くして」ではなく こう伝えてみてください:「右側のサイドバーを隠して記事部分を全幅にしてください」
例えば:「デザインを変えて」ではなく こう伝えてみてください:「ページをもっとシンプルにして、フォントサイズを大きくし、カード間の間隔を減らしてください」

よくある質問

ページを更新しても変更は残りますか? はい。スクリプトがオンになっていれば、保存したカスタマイズは同じサイトを再訪問した時も有効です。
カスタマイズをオフにできますか? はい。マイスクリプトパネルでスクリプトのオン・オフ切替が可能です。
結果が完璧でない場合は? 追加の指示を送って調整を依頼してください。 また、改善したい部分のスクリーンショットを撮って具体的に伝えることも効果的です。
Sider Codeはすべてのウェブサイトで使えますか? 多くのサイトで使えるよう設計されています。 ただし、一部のサイトでは制限や複雑なレイアウトがあり、追加の指示が必要な場合があります。
Sider Codeのクレジット課金はどうなっていますか? タスクの複雑さに応じて動的に課金されます。 すでにスクリプトが生成されている場合は、同じサイトを再訪問時に再課金されません。 しかし、AI機能を新たに追加すると、その機能実行時に課金されることがあります。 例えば、ChatGPTの回答ごとに「反論」ボタンを設置し、そのボタンをクリックして反論を生成するたびにクレジットが消費される場合があります。 Sider Codeは誰が使えますか?
Sider Codeは、新しい有料プランのLite、Plus、Maxで利用可能です。
無料ユーザーや旧有料プラン(Basic、Professional、Unlimited、Ultraなど)をご利用の方は、Sider Code使用前に新しい有料プランへアップグレードが必要です。
Sider Codeは全画面モードで使えますか?
いいえ。現在Sider CodeはSiderサイドバー内のみで動作します。
Sider Codeは現在のブラウザタブで操作する必要があるため、全画面モードには対応していません。