Try your search with a different keyword or use * as a wildcard.
@model ConfigurationModel
@{
Layout = "_ConfigurePlugin";
}
<link rel="stylesheet" href="~/Plugins/Misc.Brevo/Content/styles.css" />
@await Component.InvokeAsync(typeof(StoreScopeConfigurationViewComponent))
<form asp-controller="Brevo" asp-action="Configure" method="post">
<nop-cards id="brevo-cards">
<nop-card asp-name="brevo-general" asp-icon="fas fa-info" asp-title="@T("Plugins.Misc.Brevo.General")" asp-hide-block-attribute-name="@BrevoDefaults.HideGeneralBlock" asp-hide="@Model.HideGeneralBlock" asp-advanced="false">
<div class="card-body">
<div class="card card-default">
<div class="card-body">
@if (!string.IsNullOrEmpty(Model.AccountInfo))
{
<div class="form-group row">
<div class="col-md-3">
<nop-label asp-for="ApiKey" />
</div>
<div class="col-md-9">
<nop-editor asp-for="ApiKey" />
<span asp-validation-for="ApiKey"></span>
</div>
</div>
<div class="form-group row">
<div class="col-md-3">
<nop-label asp-for="AccountInfo" />
</div>
<div class="col-md-9" style="white-space: pre-line">
@Html.Raw(Model.AccountInfo)
</div>
</div>
<div class="form-group row">
<div class="col-md-9 offset-md-3">
<button type="submit" name="save" class="btn btn-primary">@T("Admin.Common.Save")</button>
</div>
</div>
}
else
{
<div class="custombody">
<div class="form-group row">
<div class="logo">
<img src="@Url.Content("~/Plugins/Misc.Brevo/logo.png")" alt="" />
</div>
</div>
<div class="form-group row mt-2">
<h2>Step 1. Create a Brevo account</h2>
</div>
<div class="form-group">
<p>
Drive more sales with all-in-one marketing software platform.
</p>
</div>
<div class="form-group">
<ul class="list-unstyled">
<li>
<i class="fas fa-check"></i><b>Design</b> clean and professional newsletters
</li>
<li>
<i class="fas fa-check"></i>Build and <b>target</b> your audience
</li>
<li>
<i class="fas fa-check"></i><b>Automate</b> your marketing (e.g. abandoned cart recovery)
</li>
</ul>
<div>
<a href="https://get.brevo.com/5f897rrc6cwa" class="btn btn-primary mt-1" target="_blank">Create Free Account</a>
</div>
</div>
<div class="form-group row mt-3">
<h2>Step 2. Connect your store to Brevo </h2>
</div>
<div class="form-group">
<p>Copy your API v3 key from your Brevo account on <a href="https://get.brevo.com/nopcommerce" target="_blank">SMTP & API</a> page, then paste it in the field below and save.</p>
<div class="apikey">
<input class="form-control text-box single-line" id="ApiKey" name="ApiKey" type="text" value="" placeholder="xkeysib-xxxxxxxxxxx">
<span asp-validation-for="ApiKey"></span>
</div>
<button type="submit" name="save" class="btn btn-primary mt-1">@T("Admin.Common.Save")</button>
</div>
<div class="form-group row mt-3">
<h2>Need help?</h2>
</div>
<div class="form-group">
<p>Take a look at our tutorials:</p>
<ul class="list">
<li>
<a href="https://get.brevo.com/yyhs3x" target="_blank">nopCommerce - 1. Set up the plugin</a>
</li>
<li>
<a href="https://get.brevo.com/tv7it" target="_blank">nopCommerce - 2. Recover abandoned carts</a>
</li>
<li>
<a href="https://get.brevo.com/ut1q2p" target="_blank">nopCommerce - 3. Send an order confirmation email</a>
</li>
</ul>
</div>
<br />
<div class="form-group">
<p><b><i>Don’t see your question answered?</i></b></p>
<ul class="list">
<li>
<i>Visit <a href="https://www.nopcommerce.com/boards/?utm_source=admin-panel&utm_medium=sendinblue&utm_campaign=admin-panel" target="_blank">nopCommerce forums</a>. They are free and mostly provided by nopCommerce community (sometimes by nopCommerce team).</i>
</li>
<li>
<i><a href="https://www.nopcommerce.com/nopcommerce-premium-support-services/?utm_source=admin-panel&utm_medium=sendinblue&utm_campaign=admin-panel" target="_blank">nopCommerce premium support services</a>. Paid, fast and provided by nopCommerce team.</i>
</li>
</ul>
</div>
</div>
}
</div>
</div>
</div>
</nop-card>
@if (!string.IsNullOrEmpty(Model.ApiKey))
{
<nop-card asp-name="brevo-synchronization" asp-icon="fas fa-exchange" asp-title="@T("Plugins.Misc.Brevo.Synchronization")" asp-hide-block-attribute-name="@BrevoDefaults.HideSynchronizationBlock" asp-hide="@Model.HideSynchronizationBlock" asp-advanced="false">
<script>
$(function() {
//$("#progressBar").hide();
if (@((ViewData["synchronizationStart"] != null && (bool)ViewData["synchronizationStart"]).ToString().ToLowerInvariant())) {
$("#progressBar").show();
refresh();
}
});
function refresh(){
setTimeout(function(){
$.get('@(Url.Action("GetSynchronizationInfo", "Brevo"))', function(data) {
if (!data) {
refresh();
}
else {
$('#synchronizationInfo').text(data);
$("#progressBar").hide();
}
});
}, 3000);
};
</script>
<div class="card-body">
<div class="card card-default">
<div class="card-body">
<p>
From the dropdown list below, select the Brevo list where your nopCommerce newsletter subscribers and their data will be added.<br />
After the initial sync, a task is scheduled to run every 6000 seconds to automatically add your new subscribers to your Brevo list.<br />
To change the sync frequency, go to <a href="@Url.Content("~/Admin/ScheduleTask/List/")">System > Schedule tasks.</a>
</p>
<div class="form-group row">
<div class="col-md-9 offset-md-3">
<a href="https://get.brevo.com/ypp8fp" class="btn btn-primary" target="_blank">Create a list</a>
</div>
</div>
@for (int i = 0; i < Model.NewsLetterSubscriptionTypes.Count; i++)
{
var brevoLists = await Model.AvailableLists.SelectAwait(async brevoList => new SelectListItem
{
Text = brevoList.Text,
Value = brevoList.Value,
Selected = brevoList.Value.Equals(Model.NewsLetterSubscriptionTypes[i].ListId.ToString())
}).ToListAsync();
<div class="form-group row">
<div class="col-md-3">
<input type="hidden" asp-for="NewsLetterSubscriptionTypes[i].TypeId" />
<nop-label asp-for="@(Model.NewsLetterSubscriptionTypes[i].Name)" />
<span style="padding-top: 7px;margin-right: 5px;float: right;font-weight: 600;">@Model.NewsLetterSubscriptionTypes[i].Name</span>
</div>
<div class="col-md-9">
<nop-select asp-for="NewsLetterSubscriptionTypes[i].ListId" asp-items="@brevoLists" />
<span asp-validation-for="NewsLetterSubscriptionTypes[i].ListId"></span>
</div>
</div>
}
<div class="form-group row">
<div class="col-md-9 offset-md-3">
<button type="submit" name="saveSync" class="btn btn-primary">@T("Admin.Common.Save")</button>
</div>
</div>
</div>
</div>
<div class="card card-default">
<div class="card-header">
@T("Plugins.Misc.Brevo.ManualSync")
</div>
<div class="card-body">
<p>
To run the sync right away, click on the "Sync now" button.
</p>
<div id="synchronizationInfo" style="white-space: pre-line"></div>
<div class="progressBar">
<div class="progress-bar bg-primary progress-bar-striped progress-bar-animated" role="progressbar" aria-valuenow="100" aria-valuemin="0" aria-valuemax="100" style="width: 100%"></div>
</div>
</div>
<div class="card-footer">
<button type="submit" name="sync" class="btn btn-primary">
@T("Plugins.Misc.Brevo.SyncNow")
</button>
</div>
</div>
</div>
</nop-card>
<nop-card asp-name="brevo-transactional" asp-icon="fas fa-envelope" asp-title="@T("Plugins.Misc.Brevo.Transactional")" asp-hide-block-attribute-name="@BrevoDefaults.HideTransactionalBlock" asp-hide="@Model.HideTransactionalBlock" asp-advanced="false">
<div class="card-body">
<div class="card card-default">
<div class="card-body">
<p>
Brevo SMTP is the transactional email service of Brevo. When it is enabled, all transactional emails (e.g. account creation emails, order confirmation emails, recovery password emails, etc) of your store will be sent from your Brevo account.<br />
Copy your SMTP key from your Brevo account on <a href="https://get.brevo.com/nopcommerce" target="_blank">SMTP & API</a> page > SMTP tab, then paste it in the field below and save.
</p>
<div class="form-group row">
<div class="col-md-3">
<nop-override-store-checkbox asp-for="UseSmtp_OverrideForStore" asp-input="UseSmtp" asp-store-scope="@Model.ActiveStoreScopeConfiguration" />
<nop-label asp-for="UseSmtp" />
</div>
<div class="col-md-9">
<nop-editor asp-for="UseSmtp" />
<span asp-validation-for="UseSmtp"></span>
</div>
</div>
<div class="form-group row">
<div class="col-md-3">
<nop-label asp-for="SmtpKey" />
</div>
<div class="col-md-9">
<nop-editor asp-for="SmtpKey" />
<span asp-validation-for="SmtpKey"></span>
</div>
</div>
<div class="form-group row">
<div class="col-md-3">
<nop-override-store-checkbox asp-for="SenderId_OverrideForStore" asp-input="SenderId" asp-store-scope="@Model.ActiveStoreScopeConfiguration" />
<nop-label asp-for="SenderId" />
</div>
<div class="col-md-9">
<nop-select asp-for="SenderId" asp-items=" Model.AvailableSenders" />
<span asp-validation-for="SenderId"></span>
</div>
</div>
<div class="form-group row">
<div class="col-md-9 offset-md-3">
<button type="submit" name="saveSMTP" class="btn btn-primary">@T("Admin.Common.Save")</button>
</div>
</div>
</div>
</div>
@if (Model.UseSmtp)
{
<div class="card card-default">
<div class="card-body">
@await Html.PartialAsync("Table", new DataTablesModel
{
Name = "messages-grid",
UrlRead = new DataUrl("MessageList", "Brevo", null),
UrlUpdate = new DataUrl("MessageUpdate", "Brevo", null),
Length = Model.MessageTemplateSearchModel.PageSize,
LengthMenu = Model.MessageTemplateSearchModel.AvailablePageSizes,
ColumnCollection = new List<ColumnProperty>
{
new ColumnProperty(nameof(BrevoMessageTemplateModel.Name))
{
Title = T("Admin.ContentManagement.MessageTemplates.Fields.Name").Text
},
new ColumnProperty(nameof(BrevoMessageTemplateModel.IsActive))
{
Title = T("Admin.ContentManagement.MessageTemplates.Fields.IsActive").Text,
Width = "100",
ClassName = NopColumnClassDefaults.CenterAll,
Render = new RenderBoolean(),
Editable = true,
EditType = EditType.Checkbox
},
new ColumnProperty(nameof(BrevoMessageTemplateModel.ListOfStores))
{
Title = T("Admin.ContentManagement.MessageTemplates.Fields.LimitedToStores").Text
},
new ColumnProperty(nameof(BrevoMessageTemplateModel.UseBrevoTemplate))
{
Title = T("Plugins.Misc.Brevo.UseBrevoTemplate").Text,
Width = "100",
ClassName = NopColumnClassDefaults.CenterAll,
Render = new RenderBoolean(),
Editable = true,
EditType = EditType.Checkbox
},
new ColumnProperty(nameof(BrevoMessageTemplateModel.Id))
{
Title = T("Plugins.Misc.Brevo.EditTemplate").Text,
Width = "150",
Render = new RenderLink(new DataUrl(string.Empty, nameof(BrevoMessageTemplateModel.EditLink)))
{
Title = T("Plugins.Misc.Brevo.EditTemplate").Text
}
},
new ColumnProperty(nameof(BrevoMessageTemplateModel.Id))
{
Title = T("Admin.Common.Edit").Text,
Width = "200",
ClassName = NopColumnClassDefaults.Button,
Render = new RenderButtonsInlineEdit()
}
}
})
</div>
</div>
}
</div>
</nop-card>
<nop-card asp-name="brevo-sms" asp-icon="fas fa-envelope" asp-title="@T("Plugins.Misc.Brevo.SMS")" asp-hide-block-attribute-name="@BrevoDefaults.HideSmsBlock" asp-hide="@Model.HideSmsBlock" asp-advanced="false">
<div class="card-body">
<div class="card card-default">
<div class="card-body">
<p>
You can send personalized SMS notifications to your customers or the store owner. Simply make sure that you have SMS credits (estimate how many SMS credits you need with this <a href="https://get.brevo.com/5f897rrc6cwa" target="_blank">calculator</a> - the cost of an SMS depends on the recipient’s country) and that sending transactional SMS is enabled on your Brevo account.
</p>
<div class="form-group row">
<div class="col-md-3">
<nop-override-store-checkbox asp-for="UseSmsNotifications_OverrideForStore" asp-input="UseSmsNotifications" asp-store-scope="@Model.ActiveStoreScopeConfiguration" />
<nop-label asp-for="UseSmsNotifications" />
</div>
<div class="col-md-9">
<nop-editor asp-for="UseSmsNotifications" />
<span asp-validation-for="UseSmsNotifications"></span>
</div>
</div>
<div class="form-group row">
<div class="col-md-3">
<nop-override-store-checkbox asp-for="SmsSenderName_OverrideForStore" asp-input="SmsSenderName" asp-store-scope="@Model.ActiveStoreScopeConfiguration" />
<nop-label asp-for="SmsSenderName" />
</div>
<div class="col-md-9">
<nop-editor asp-for="SmsSenderName" />
<span asp-validation-for="SmsSenderName"></span>
</div>
</div>
<div class="form-group row">
<div class="col-md-3">
<nop-label asp-for="StoreOwnerPhoneNumber" />
</div>
<div class="col-md-9">
<nop-editor asp-for="StoreOwnerPhoneNumber" />
<span asp-validation-for="StoreOwnerPhoneNumber"></span>
</div>
</div>
<div class="form-group row">
<div class="col-md-9 offset-md-3">
<button type="submit" name="saveSMS" class="btn btn-primary">@T("Admin.Common.Save")</button>
</div>
</div>
</div>
</div>
@if (Model.UseSmsNotifications)
{
<div class="card card-default">
<div class="card-body">
<div class="form-group row">
<div class="col-md-3">
<nop-label asp-for="AllowedTokens" />
</div>
<div class="col-md-9">
<a id="allowedTokensShowHide" href="javascript:toggleLoadedAllowedTokens();">@T("Admin.Common.Show")</a>
<div id="pnlAllowedTokens" class="d-none" style="white-space: pre-line">
<div class="form-text-row">@Model.AllowedTokens</div>
</div>
</div>
</div>
<script>
function toggleLoadedAllowedTokens() {
$('#pnlAllowedTokens').toggleClass('d-none');
if ($('#pnlAllowedTokens').hasClass('d-none')) {
$('#allowedTokensShowHide').html('@T("Admin.Common.Show")');
} else {
$('#allowedTokensShowHide').html('@T("Admin.Common.Hide")');
}
}
</script>
@await Html.PartialAsync("Table", new DataTablesModel
{
Name = "sms-grid",
UrlRead = new DataUrl("SMSList", "Brevo", null),
UrlDelete = new DataUrl("SMSDelete", "Brevo", null),
Length = Model.SmsSearchModel.PageSize,
LengthMenu = Model.SmsSearchModel.AvailablePageSizes,
ColumnCollection = new List<ColumnProperty>
{
new ColumnProperty(nameof(SmsModel.Name))
{
Title = T("Admin.ContentManagement.MessageTemplates.Fields.Name").Text,
Width = "300",
},
new ColumnProperty(nameof(SmsModel.PhoneType))
{
Title = T("Plugins.Misc.Brevo.PhoneType").Text,
Width = "200",
},
new ColumnProperty(nameof(SmsModel.Text))
{
Title = T("Plugins.Misc.Brevo.SMSText").Text,
Width = "500"
},
new ColumnProperty(nameof(SmsModel.Id))
{
Title = T("Admin.Common.Delete").Text,
Width = "100",
ClassName = NopColumnClassDefaults.Button,
Render = new RenderButtonRemove(T("Admin.Common.Delete").Text)
}
}
})
<div class="card card-default no-margin">
<div class="card-header">
@T("Admin.Common.AddNewRecord")
</div>
<div class="card-body">
<div class="form-group row">
<div class="col-md-3">
<nop-label asp-for="@Model.AddSms.MessageId" />
</div>
<div class="col-md-9">
<nop-select asp-for="@Model.AddSms.MessageId" asp-items="@Model.AddSms.AvailableMessages" />
<span asp-validation-for="@Model.AddSms.MessageId"></span>
</div>
</div>
<div class="form-group row">
<div class="col-md-3">
<nop-label asp-for="@Model.AddSms.PhoneTypeId" />
</div>
<div class="col-md-9">
<nop-select asp-for="@Model.AddSms.PhoneTypeId" asp-items="@Model.AddSms.AvailablePhoneTypes" />
<span asp-validation-for="@Model.AddSms.PhoneTypeId"></span>
</div>
</div>
<div class="form-group row">
<div class="col-md-3">
<nop-label asp-for="@Model.AddSms.Text" />
</div>
<div class="col-md-9">
<nop-textarea asp-for="@Model.AddSms.Text" />
<span asp-validation-for="@Model.AddSms.Text"></span>
</div>
</div>
<div class="form-group row">
<div class="col-md-9 offset-md-3">
<button type="button" id="addSms" class="btn btn-primary">@T("Admin.Common.AddNewRecord")</button>
</div>
</div>
</div>
<script>
$(function() {
$('#addSms').click(function () {
$('#addSms').attr('disabled', true);
var postData = {
MessageId: $("#@Html.IdFor(model => model.AddSms.MessageId)").val(),
PhoneTypeId: $("#@Html.IdFor(model => model.AddSms.PhoneTypeId)").val(),
Text: $("#@Html.IdFor(model => model.AddSms.Text)").val()
};
addAntiForgeryToken(postData);
$.ajax({
cache: false,
type: "POST",
url: "@Html.Raw(Url.Action("SMSAdd", "Brevo"))",
data: postData,
success: function (data, textStatus, jqXHR) {
if (data.Result) {
updateTable('#sms-grid');
//clear input value
$("#@Html.IdFor(model => model.AddSms.MessageId)").val(@(Model.AddSms.DefaultSelectedMessageId));
$("#@Html.IdFor(model => model.AddSms.PhoneTypeId)").val(@(Model.AddSms.DefaultSelectedPhoneTypeId));
$("#@Html.IdFor(model => model.AddSms.Text)").val('');
} else {
display_nop_error(data);
}
},
complete: function (jqXHR, textStatus) {
$('#addSms').attr('disabled', false);
}
});
});
});
</script>
</div>
</div>
</div>
}
<div class="card card-default">
<div class="card-header">
@T("Plugins.Misc.Brevo.SMS.Campaigns")
</div>
<div class="card-body">
<p>
Send a SMS campaign to a Brevo list.
</p>
<div class="form-group row">
<div class="col-md-3">
<nop-label asp-for="CampaignListId" />
</div>
<div class="col-md-9">
<nop-select asp-for="CampaignListId" asp-items="Model.AvailableLists" />
<span asp-validation-for="CampaignListId"></span>
</div>
</div>
<div class="form-group row">
<div class="col-md-3">
<nop-label asp-for="CampaignSenderName" />
</div>
<div class="col-md-9">
<nop-editor asp-for="CampaignSenderName" />
<span asp-validation-for="CampaignSenderName"></span>
</div>
</div>
<div class="form-group row">
<div class="col-md-3">
<nop-label asp-for="CampaignText" />
</div>
<div class="col-md-9">
<nop-textarea asp-for="CampaignText" />
<span asp-validation-for="CampaignText"></span>
</div>
</div>
<div class="form-group row">
<div class="col-md-9 offset-md-3">
<button type="submit" name="submitCampaign" class="btn btn-primary">@T("Plugins.Misc.Brevo.SMS.Campaigns.Submit")</button>
</div>
</div>
</div>
</div>
</div>
</nop-card>
<nop-card asp-name="brevo-ma" asp-icon="fas fa-star" asp-title="@T("Plugins.Misc.Brevo.MarketingAutomation")" asp-hide-block-attribute-name="@BrevoDefaults.HideMarketingAutomationBlock" asp-hide="@Model.HideMarketingAutomationBlock" asp-advanced="false">
<div class="card-body">
<div class="card card-default">
<div class="card-body">
@if (Model.MarketingAutomationDisabled)
{
<p>
Your Marketing Automation platform is disabled, to activate it, go to this <a href="https://get.brevo.com/tvl7ng" target="_blank">page</a> and click on the TRY AUTOMATION FOR FREE button.
</p>
}
else
{
<p>
Automate your marketing - send a series of emails or SMS once a visitor has signed up, a prospect has abandoned their cart, a customer has made a purchase, etc. The plugin will automatically track the activity of shoppers for you to set up workflows to recover lost sales.<br />
</p>
}
<div class="form-group row">
<div class="col-md-3">
<nop-override-store-checkbox asp-for="UseMarketingAutomation_OverrideForStore" asp-input="UseMarketingAutomation" asp-store-scope="@Model.ActiveStoreScopeConfiguration" />
<nop-label asp-for="UseMarketingAutomation" />
</div>
<div class="col-md-9">
<nop-editor asp-for="UseMarketingAutomation" />
<span asp-validation-for="UseMarketingAutomation"></span>
</div>
</div>
<div class="form-group row">
<div class="col-md-3">
<nop-label asp-for="MarketingAutomationKey" />
</div>
<div class="col-md-9">
<nop-editor asp-for="MarketingAutomationKey" />
<span asp-validation-for="MarketingAutomationKey"></span>
</div>
</div>
<div class="form-group row">
<div class="col-md-3">
<nop-label asp-for="TrackingScript" />
</div>
<div class="col-md-9">
<nop-textarea asp-for="TrackingScript" />
<script>
$(function() {
$('#@Html.IdFor(model => model.TrackingScript)').height($('#@Html.IdFor(model => model.TrackingScript)')[0].scrollHeight);
});
</script>
<span asp-validation-for="TrackingScript"></span>
</div>
</div>
<div class="form-group row">
<div class="col-md-9 offset-md-3">
<button type="submit" name="saveMA" class="btn btn-primary">@T("Admin.Common.Save")</button>
</div>
</div>
</div>
</div>
</div>
</nop-card>
}
</nop-cards>
</form>