diff --git a/data/locale/en-US.ini b/data/locale/en-US.ini
index 55a7e97..2309041 100644
--- a/data/locale/en-US.ini
+++ b/data/locale/en-US.ini
@@ -62,3 +62,11 @@ TikTokServer="TikTok Server"
TikTokServerInfo="Please enter your stream server, you can find this on your TikTok Live Center."
TikTokStreamKey="TikTok Stream Key"
TikTokStreamKeyInfo="Please enter your stream key, you can find this on your TikTok Live Center."
+
+# Facebook Output Dialog
+FacebookOutput="Facebook Output"
+FacebookServiceInfo="Please complete the following fields to add a new Facebook output."
+FacebookServer="Facebook Server"
+FacebookServerInfo="The stream server URL is preset for Facebook, you do not need to change it."
+FacebookStreamKey="Facebook Stream Key"
+FacebookStreamKeyInfo="Please enter your stream key, you can find this on your Facebook Producer page."
diff --git a/output-dialog.cpp b/output-dialog.cpp
index 6bf7e1a..ce47ca1 100644
--- a/output-dialog.cpp
+++ b/output-dialog.cpp
@@ -623,13 +623,115 @@ QWidget *OutputDialog::WizardInfoTikTok() {
QWidget *OutputDialog::WizardInfoFacebook() {
auto page = new QWidget(this);
-
- auto pageLayout = new QVBoxLayout;
+ page->setStyleSheet("padding: 0px; margin: 0px;");
- auto title = new QLabel(QString("Facebook Service page"));
+ // Layout
+ auto pageLayout = new QVBoxLayout;
+ pageLayout->setSpacing(12);
+
+ // Heading
+ auto title = new QLabel(QString::fromUtf8(obs_module_text("FacebookServiceInfo")));
+ title->setWordWrap(true);
+ title->setTextFormat(Qt::RichText);
pageLayout->addWidget(title);
+ // Content
+ auto contentLayout = new QVBoxLayout;
+
+ // Confirm button - initialised here so we can set state in form input connects
+ auto confirmButton = generateButton(QString("Create Output"));
+
+ // Form
+ auto formLayout = new QFormLayout;
+ formLayout->setFieldGrowthPolicy(QFormLayout::AllNonFixedFieldsGrow);
+ formLayout->setLabelAlignment(Qt::AlignRight | Qt::AlignTrailing | Qt::AlignVCenter);
+ formLayout->setSpacing(12);
+
+ // Output name
+ auto outputNameField = new QLineEdit;
+ outputNameField->setText(QString::fromUtf8(obs_module_text("FacebookOutput")));
+ outputNameField->setStyleSheet("padding: 4px 8px;");
+
+ connect(outputNameField, &QLineEdit::textEdited, [this, outputNameField, confirmButton] {
+ outputName = outputNameField->text();
+ validateOutputs(confirmButton);
+ });
+
+ formLayout->addRow(generateFormLabel("OutputName"), outputNameField);
+
+ // Server field
+ auto serverSelection = new QLineEdit;
+ serverSelection->setText("rtmps://rtmp-api.facebook.com:443/rtmp/");
+ serverSelection->setDisabled(true);
+ serverSelection->setStyleSheet("padding: 4px 8px;");
+
+// connect(serverSelection, &QLineEdit::textEdited, [this, serverSelection, confirmButton] {
+// outputServer = serverSelection->text();
+// validateOutputs(confirmButton);
+// });
+
+ formLayout->addRow(generateFormLabel("FacebookServer"), serverSelection);
+
+ // Server info
+ formLayout->addWidget(generateInfoLabel("FacebookServerInfo"));
+
+ // Server key
+ auto outputKeyField = new QLineEdit;
+ outputKeyField->setStyleSheet("padding: 4px 8px;");
+ connect(outputKeyField, &QLineEdit::textEdited, [this, outputKeyField, confirmButton] {
+ outputKey = outputKeyField->text();
+ validateOutputs(confirmButton);
+ });
+
+ formLayout->addRow(generateFormLabel("FacebookStreamKey"), outputKeyField);
+
+ // Server key info
+ formLayout->addWidget(generateInfoLabel("FacebookStreamKeyInfo"));
+
+ contentLayout->addLayout(formLayout);
+
+ // spacing
+ auto spacer = new QSpacerItem(1, 20, QSizePolicy::Minimum, QSizePolicy::MinimumExpanding);
+ contentLayout->addSpacerItem(spacer);
+
+ pageLayout->addLayout(contentLayout);
+
+ // Controls
+ auto controlsLayout = new QHBoxLayout;
+ controlsLayout->setSpacing(12);
+
+ // back button
+ auto serviceButton = generateButton(QString("< Back"));
+
+ connect(serviceButton, &QPushButton::clicked, [this] {
+ stackedWidget->setCurrentIndex(0);
+ resetOutputs();
+ });
+
+ controlsLayout->addWidget(serviceButton, 0);
+ controlsLayout->addStretch(1);
+
+ // confirm button (initialised above so we can set state)
+ connect(confirmButton, &QPushButton::clicked, [this] {
+ acceptOutputs();
+ });
+
+ controlsLayout->addWidget(confirmButton, 0);
+
+ // Hook it all together
+ pageLayout->addLayout(controlsLayout);
page->setLayout(pageLayout);
+ // Defaults for when we're changed to
+ connect(stackedWidget, &QStackedWidget::currentChanged, [this, outputNameField, serverSelection, outputKeyField, confirmButton] {
+ if (stackedWidget->currentIndex() == 8) {
+ outputName = outputNameField->text();
+ outputServer = serverSelection->text();
+ outputKey = outputKeyField->text();
+ validateOutputs(confirmButton);
+ }
+ });
+
+
return page;
}