Render fonts on frontend
[MAILPOET-2849]
This commit is contained in:
@ -46,6 +46,15 @@ jQuery(($) => {
|
|||||||
return true;
|
return true;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function renderFontFamily(fontName, formDiv) {
|
||||||
|
const originalFontFamily = formDiv.css('font-family');
|
||||||
|
const newFontFamily = `"${fontName}", ${originalFontFamily}`;
|
||||||
|
formDiv.css('font-family', newFontFamily);
|
||||||
|
formDiv.find('input, option').css('font-family', 'inherit');
|
||||||
|
formDiv.find('input[type=text], textarea, input[type=email], select').css('font-family', newFontFamily);
|
||||||
|
formDiv.find(':header').css('font-family', 'inherit');
|
||||||
|
}
|
||||||
|
|
||||||
function showForm(formDiv, showOverlay = false) {
|
function showForm(formDiv, showOverlay = false) {
|
||||||
const form = formDiv.find('form');
|
const form = formDiv.find('form');
|
||||||
const position = form.data('position');
|
const position = form.data('position');
|
||||||
@ -87,6 +96,12 @@ jQuery(($) => {
|
|||||||
$('.mailpoet_form').each((index, element) => {
|
$('.mailpoet_form').each((index, element) => {
|
||||||
$(element).children('.mailpoet_paragraph, .mailpoet_form_image, .mailpoet_form_paragraph').last().addClass('last');
|
$(element).children('.mailpoet_paragraph, .mailpoet_form_image, .mailpoet_form_paragraph').last().addClass('last');
|
||||||
});
|
});
|
||||||
|
$('form.mailpoet_form').each((index, element) => {
|
||||||
|
const form = $(element);
|
||||||
|
if (form.data('font-family')) {
|
||||||
|
renderFontFamily(form.data('font-family'), form.parent());
|
||||||
|
}
|
||||||
|
});
|
||||||
$('.mailpoet_form_close_icon').click((event) => {
|
$('.mailpoet_form_close_icon').click((event) => {
|
||||||
const closeIcon = $(event.target);
|
const closeIcon = $(event.target);
|
||||||
const formDiv = closeIcon.parent();
|
const formDiv = closeIcon.parent();
|
||||||
|
@ -157,6 +157,7 @@ class DisplayFormInWPContent {
|
|||||||
$templateData['delay'] = $formSettings[$displayType . '_form_delay'] ?? 0;
|
$templateData['delay'] = $formSettings[$displayType . '_form_delay'] ?? 0;
|
||||||
$templateData['position'] = $formSettings[$displayType . '_form_position'] ?? '';
|
$templateData['position'] = $formSettings[$displayType . '_form_position'] ?? '';
|
||||||
$templateData['backgroundColor'] = $formSettings['backgroundColor'] ?? '';
|
$templateData['backgroundColor'] = $formSettings['backgroundColor'] ?? '';
|
||||||
|
$templateData['fontFamily'] = $formSettings['font_family'] ?? '';
|
||||||
|
|
||||||
// generate security token
|
// generate security token
|
||||||
$templateData['token'] = Security::generateToken();
|
$templateData['token'] = Security::generateToken();
|
||||||
|
@ -35,6 +35,7 @@
|
|||||||
data-delay="<%= delay %>"
|
data-delay="<%= delay %>"
|
||||||
data-position="<%= position %>"
|
data-position="<%= position %>"
|
||||||
data-background-color="<%= backgroundColor %>"
|
data-background-color="<%= backgroundColor %>"
|
||||||
|
data-font-family="<%= fontFamily %>"
|
||||||
>
|
>
|
||||||
<input type="hidden" name="data[form_id]" value="<%= form_id %>" />
|
<input type="hidden" name="data[form_id]" value="<%= form_id %>" />
|
||||||
<input type="hidden" name="token" value="<%= token %>" />
|
<input type="hidden" name="token" value="<%= token %>" />
|
||||||
|
Reference in New Issue
Block a user