# テーマの main-outlet の左側と右側に要素を追加する
**URL:** https://meta.discourse.org/t/adding-elements-to-the-left-and-right-side-of-main-outlet-in-a-theme/222134
**Category:** Development
**Created:** [2022 年 3 月 28 日午前 8:11 UTC](https://meta.discourse.org/t/adding-elements-to-the-left-and-right-side-of-main-outlet-in-a-theme/222134 "2022-03-28T08:11:30Z")
**Posts on this page:** 4
**Page:** 1
### Author:  [@piffy](https://meta.discourse.org/u/piffy)
#### Post date: [2022 年 3 月 28 日午前 8:11 UTC](https://meta.discourse.org/t/adding-elements-to-the-left-and-right-side-of-main-outlet-in-a-theme/222134/1 "2022-03-28T08:11:30Z")
こんにちは。Discourseで使われている開発規約の多くに慣れていないので、いくつか方向性を教えていただきたいです。
基本的に、私が作成しているテーマで`main-outlet`の4つのすべての辺に画像を追加しようとしています。`below-site-header`と`above-footer`のアウトレットを参照することで、上下にアクセスするのはかなり簡単そうです。しかし、`main-outlet`の左右に画像を追加する方法は、それほど明確ではありません。
何かヒントはありますか？あるいは、同様のことを行った他のテーマのソースコードはありますか？
---
### Author:  [@merefield](https://meta.discourse.org/u/merefield)
#### Post date: [2022 年 3 月 28 日午前 8:17 UTC](https://meta.discourse.org/t/adding-elements-to-the-left-and-right-side-of-main-outlet-in-a-theme/222134/2 "2022-03-28T08:17:17Z")
なぜこれを使用しないのですか？ [カスタムレイアウトプラグイン - プラグイン - Discourse Meta](https://meta.discourse.org/t/custom-layouts-plugin/55208)
ウィジェット開発ガイドはこちら: [Pavilion](https://thepavilion.io/t/widget-development/3214/2)
---
### Author:  [@piffy](https://meta.discourse.org/u/piffy)
#### Post date: [2022 年 3 月 28 日午前 8:21 UTC](https://meta.discourse.org/t/adding-elements-to-the-left-and-right-side-of-main-outlet-in-a-theme/222134/3 "2022-03-28T08:21:20Z")
素晴らしい、探しているものに似ています。ソースを確認します。ありがとうございます！
---
### Author:  [@merefield](https://meta.discourse.org/u/merefield)
#### Post date: [2022 年 3 月 28 日午前 8:23 UTC](https://meta.discourse.org/t/adding-elements-to-the-left-and-right-side-of-main-outlet-in-a-theme/222134/4 "2022-03-28T08:23:53Z")
プラグインは無期限にサポートされているので、カスタムウィジェットの構築に集中して、再発明しなければならないものを限定するのはどうでしょうか？
全体的なポイントは、ウィジェットを一度作成すれば、設定だけで移動したり、他のウィジェットとの相対的な順序を変更したりできることです。
また、任意のHTMLをプッシュできる[互換性のあるカスタムHTMLウィジェット](https://thepavilion.io/t/custom-html-widget/3480/18)もありますが、最終的にはネイティブウィジェットを作成することが、JavaScriptレベルで完全に統合するための方法です。