Try your search with a different keyword or use * as a wildcard.
@model FacebookPixelModel
<div asp-validation-summary="All"></div>
<div class="content">
<div class="form-horizontal">
<div class="cards-group">
<div class="card card-default">
<div class="card-body">
<p>
To configure the Facebook Pixel you will need your pixel's ID, which you can find in the <a
href="https://business.facebook.com/events_manager" target="_blank">Ads Manager > Events
Manager</a>. If you have not created a pixel, <a
href="https://www.facebook.com/business/help/952192354843755" target="_blank">follow these
instructions</a> to create one - all you will need is the pixel's ID.<br />
<br />
Standard events are predefined visitor actions that correspond to common, conversion-related
activities, such as searching for a product, viewing a product, or purchasing a product.<br />
You can configure tracking of these events by enabling the appropriate settings below.<br />
<em>Note: As an additional parameter, some events include product SKU or product combination
SKU; make sure that they are filled out correctly in your catalog.</em><br />
<br />
If predefined standard events aren't suitable for your needs, you can track your own custom
events, which also can be used to define custom audiences for ad optimization.<br />
You can configure them below. Specify the name and choose widget zones in which the custom event
will be tracked. If you don't know which zone to use for your custom event, you can ask about it
in <a href="@Nop.Services.Common.NopLinksDefaults.OfficialSite.Boards" target="_blank">our
forums</a>.<br />
<br />
The General Data Protection Regulation (GDPR) took effect on May 25, 2018, and creates
consistent data protection rules across Europe. Businesses who advertise with the Facebook
companies can continue to use Facebook platforms and solutions in the same way they do
today.<br />
If you already enabled the <a
href="@Url.Action("GeneralCommon", "Setting", new { area = AreaNames.ADMIN })"
target="_blank">settings</a> to display Cookie Consent for users, you can pause sending
pixel fires to Facebook for users who have not accepted Cookie Consent by enabling the
appropriate settings below.<br />
See also <a href="https://developers.facebook.com/docs/facebook-pixel/support#pixelcollect"
target="_blank">What data does the Facebook pixel collect?</a><br />
</p>
<div class="form-group row">
<div class="col-md-3">
<nop-label asp-for="PixelScriptEnabled" />
</div>
<div class="col-md-9">
<nop-editor asp-for="PixelScriptEnabled" />
<span asp-validation-for="PixelScriptEnabled"></span>
</div>
</div>
<div class="form-group row">
<div class="col-md-3">
<nop-label asp-for="PixelId" />
</div>
<div class="col-md-9">
@if (string.IsNullOrEmpty(Model.PixelId))
{
<nop-editor asp-for="PixelId" asp-required="true" />
}
else
{
<nop-editor asp-for="PixelId" asp-required="true"
html-attributes="@(new { disabled = true, value = Model.PixelId })" />
<input asp-for="PixelId" type="hidden" />
}
<span asp-validation-for="PixelId"></span>
</div>
</div>
<div class="form-group row">
<div class="col-md-3">
<nop-label asp-for="ConversionsApiEnabled" />
</div>
<div class="col-md-9">
<nop-editor asp-for="ConversionsApiEnabled" />
<span asp-validation-for="ConversionsApiEnabled"></span>
</div>
</div>
<nop-nested-setting asp-for="ConversionsApiEnabled" disable-auto-generation="true">
<div class="form-group row" id="pnlConversionsApiEnabled">
<div class="col-md-3">
<nop-label asp-for="AccessToken" />
</div>
<div class="col-md-9">
@if (string.IsNullOrEmpty(Model.AccessToken))
{
<nop-editor asp-for="AccessToken" asp-required="true" />
}
else
{
<nop-editor asp-for="AccessToken" asp-required="true"
html-attributes="@(new { disabled = true, value = Model.AccessToken })" />
<input asp-for="AccessToken" type="hidden" />
}
<span asp-validation-for="AccessToken"></span>
</div>
</div>
</nop-nested-setting>
@if (!Model.HideStoresList)
{
<div class="form-group row">
<div class="col-md-3">
<nop-label asp-for="StoreId" />
</div>
<div class="col-md-9">
@if (string.IsNullOrEmpty(Model.PixelId))
{
<nop-select asp-for="StoreId" asp-items="Model.AvailableStores" />
}
else
{
<nop-select asp-for="StoreId" asp-items="Model.AvailableStores" disabled="disabled" />
<input asp-for="StoreId" type="hidden" />
}
<span asp-validation-for="StoreId"></span>
</div>
</div>
}
<div class="form-group row">
<div class="col-md-3">
<nop-label asp-for="UseAdvancedMatching" />
</div>
<div class="col-md-9">
<nop-editor asp-for="UseAdvancedMatching" />
<span asp-validation-for="UseAdvancedMatching"></span>
</div>
</div>
<div class="form-group row">
<div class="col-md-3">
<nop-label asp-for="PassUserProperties" />
</div>
<div class="col-md-9">
<nop-editor asp-for="PassUserProperties" />
<span asp-validation-for="PassUserProperties"></span>
</div>
</div>
<div class="form-group row">
<div class="col-md-3">
<nop-label asp-for="TrackPageView" />
</div>
<div class="col-md-9">
<nop-editor asp-for="TrackPageView" />
<span asp-validation-for="TrackPageView"></span>
</div>
</div>
<div class="form-group row">
<div class="col-md-3">
<nop-label asp-for="TrackAddToCart" />
</div>
<div class="col-md-9">
<nop-editor asp-for="TrackAddToCart" />
<span asp-validation-for="TrackAddToCart"></span>
</div>
</div>
<div class="form-group row">
<div class="col-md-3">
<nop-label asp-for="TrackPurchase" />
</div>
<div class="col-md-9">
<nop-editor asp-for="TrackPurchase" />
<span asp-validation-for="TrackPurchase"></span>
</div>
</div>
<div class="form-group row">
<div class="col-md-3">
<nop-label asp-for="TrackViewContent" />
</div>
<div class="col-md-9">
<nop-editor asp-for="TrackViewContent" />
<span asp-validation-for="TrackViewContent"></span>
</div>
</div>
<div class="form-group row">
<div class="col-md-3">
<nop-label asp-for="TrackAddToWishlist" />
</div>
<div class="col-md-9">
<nop-editor asp-for="TrackAddToWishlist" />
<span asp-validation-for="TrackAddToWishlist"></span>
</div>
</div>
<div class="form-group row">
<div class="col-md-3">
<nop-label asp-for="TrackInitiateCheckout" />
</div>
<div class="col-md-9">
<nop-editor asp-for="TrackInitiateCheckout" />
<span asp-validation-for="TrackInitiateCheckout"></span>
</div>
</div>
<div class="form-group row">
<div class="col-md-3">
<nop-label asp-for="TrackSearch" />
</div>
<div class="col-md-9">
<nop-editor asp-for="TrackSearch" />
<span asp-validation-for="TrackSearch"></span>
</div>
</div>
<div class="form-group row">
<div class="col-md-3">
<nop-label asp-for="TrackContact" />
</div>
<div class="col-md-9">
<nop-editor asp-for="TrackContact" />
<span asp-validation-for="TrackContact"></span>
</div>
</div>
<div class="form-group row">
<div class="col-md-3">
<nop-label asp-for="TrackCompleteRegistration" />
</div>
<div class="col-md-9">
<nop-editor asp-for="TrackCompleteRegistration" />
<span asp-validation-for="TrackCompleteRegistration"></span>
</div>
</div>
<div class="form-group row">
<div class="col-md-3">
<nop-label asp-for="DisableForUsersNotAcceptingCookieConsent" />
</div>
<div class="col-md-9">
<nop-editor asp-for="DisableForUsersNotAcceptingCookieConsent" />
<span asp-validation-for="DisableForUsersNotAcceptingCookieConsent"></span>
</div>
<script>
$(function() {
$("#@Html.IdFor(model => model.DisableForUsersNotAcceptingCookieConsent)").click(toggleCheckbox);
$("#@Html.IdFor(model => model.ConversionsApiEnabled)").click(toggleConversionsApiFormField);
toggleCheckbox();
toggleConversionsApiFormField();
});
function toggleCheckbox() {
warningValidation('@Url.Action("CookieSettingsWarning", "FacebookPixel")', '@Html.NameFor(model => model.DisableForUsersNotAcceptingCookieConsent)',
{ disableForUsersNotAcceptingCookieConsent: $('#@Html.IdFor(model => model.DisableForUsersNotAcceptingCookieConsent)').is(':checked') });
}
function toggleConversionsApiFormField() {
if ($('#@Html.IdFor(model => model.ConversionsApiEnabled)').is(':checked')) {
$('#pnlConversionsApiEnabled').showElement();
}
else {
$('#pnlConversionsApiEnabled').hideElement();
}
}
</script>
</div>
</div>
</div>
</div>
<div class="cards-group">
<div class="card card-default">
<div class="card-header">
@T("Plugins.Widgets.FacebookPixel.Configuration.CustomEvents")
</div>
@if (Model.Id > 0)
{
<div class="card-body">
@if (!Model.HideCustomEventsSearch)
{
<div class="row">
<div class="col-md-6">
<div class="form-group row">
<div class="col-md-3">
<nop-label asp-for="@Model.CustomEventSearchModel.WidgetZone" />
</div>
<div class="col-md-9">
<nop-editor asp-for="@Model.CustomEventSearchModel.WidgetZone" />
</div>
</div>
<div class="form-group row">
<div class="col-md-9 offset-md-4">
<button type="button" id="search" class="btn btn-primary btn-search">
<i class="fas fa-magnifying-glass"></i>
@T("Admin.Common.Search")
</button>
</div>
</div>
</div>
</div>
}
@await Html.PartialAsync("Table", new DataTablesModel
{
Name = "grid",
UrlRead = new DataUrl("CustomEventList", "FacebookPixel", new RouteValueDictionary
{
[nameof(Model.CustomEventSearchModel.ConfigurationId)] = Model.Id
}),
UrlDelete = new DataUrl("CustomEventDelete", "FacebookPixel", new RouteValueDictionary
{
[nameof(Model.CustomEventSearchModel.ConfigurationId)] = Model.Id
}),
SearchButtonId = "search",
Length = Model.CustomEventSearchModel.PageSize,
LengthMenu = Model.CustomEventSearchModel.AvailablePageSizes,
Filters = new List<FilterParameter>
{
new FilterParameter(nameof(Model.CustomEventSearchModel.WidgetZone), nameof(CustomEventSearchModel))
},
ColumnCollection = new List<ColumnProperty>
{
new ColumnProperty(nameof(CustomEventModel.EventName))
{
Title = T("Plugins.Widgets.FacebookPixel.Configuration.CustomEvents.Fields.EventName").Text,
Width = "200"
},
new ColumnProperty(nameof(CustomEventModel.WidgetZonesName))
{
Title = T("Plugins.Widgets.FacebookPixel.Configuration.CustomEvents.Fields.WidgetZones").Text
},
new ColumnProperty(nameof(CustomEventModel.EventName))
{
Title = T("Admin.Common.Delete").Text,
Width = "100",
ClassName = NopColumnClassDefaults.Button,
Render = new RenderButtonRemove(T("Admin.Common.Delete").Text)
}
}
})
</div>
<div class="card-footer">
<div class="form-group row">
<div class="col-md-3">
<nop-label asp-for="@Model.CustomEventSearchModel.AddCustomEvent.EventName" />
</div>
<div class="col-md-9">
<nop-editor asp-for="@Model.CustomEventSearchModel.AddCustomEvent.EventName" />
<span asp-validation-for="@Model.CustomEventSearchModel.AddCustomEvent.EventName"></span>
</div>
</div>
<div class="form-group row">
<div class="col-md-3">
<nop-label asp-for="@Model.CustomEventSearchModel.AddCustomEvent.WidgetZonesIds" />
</div>
<div class="col-md-9">
<nop-select asp-for="@Model.CustomEventSearchModel.AddCustomEvent.WidgetZonesIds"
asp-items="@Model.CustomEventSearchModel.AddCustomEvent.AvailableWidgetZones"
asp-multiple="true" />
<script>
$(function() {
var input = $('#@Html.IdFor(model => model.CustomEventSearchModel.AddCustomEvent.WidgetZonesIds)').select2({
closeOnSelect: false,
});
});
</script>
</div>
</div>
<div class="form-group row">
<div class="col-md-9 offset-md-3">
<button type="button" id="add"
class="btn btn-primary">@T("Admin.Common.AddNewRecord")</button>
</div>
</div>
<script>
$(function() {
$('#add').click(function () {
$('#add').attr('disabled', true);
var postData = {
EventName: $("#@Html.IdFor(model => model.CustomEventSearchModel.AddCustomEvent.EventName)").val(),
WidgetZones: $("#@Html.IdFor(model => model.CustomEventSearchModel.AddCustomEvent.WidgetZonesIds)").val()
};
addAntiForgeryToken(postData);
$.ajax({
cache: false,
type: "POST",
url: "@Html.Raw(Url.Action("CustomEventAdd", "FacebookPixel", new { configurationId = Model.Id }))",
data: postData,
success: function (data, textStatus, jqXHR) {
if (data.Result) {
//reload grid
updateTable('#grid');
//clear input value
$("#@Html.IdFor(model => model.CustomEventSearchModel.AddCustomEvent.EventName)").val('');
var input = $('#@Html.IdFor(model => model.CustomEventSearchModel.AddCustomEvent.WidgetZonesIds)').select2();
input.val("");
input.trigger("change");
} else {
//display errors if returned
display_nop_error(data);
}
},
complete: function (jqXHR, textStatus) {
$('#add').attr('disabled', false);
}
});
});
});
</script>
</div>
}
else
{
<div class="card-body">
@T("Plugins.Widgets.FacebookPixel.Configuration.CustomEvents.SaveBeforeEdit")
</div>
}
</div>
</div>
</div>
</div>