diff --git a/system/admin/views/custom-field-page.html.php b/system/admin/views/custom-field-page.html.php index c7619db..6fae65d 100644 --- a/system/admin/views/custom-field-page.html.php +++ b/system/admin/views/custom-field-page.html.php @@ -10,34 +10,58 @@ if (file_exists($field_file)) { ?>
-

+
-
- - - - - - +
+
+ + +
+
+ + +
+
+ + +
+
+ + +
+
+ + +
+
+ + +
+
+ No spaces for Name input. Underscores and dashes allowed -
+
+
+
Options
+
+ + No spaces for select and option Value input. Underscores and dashes allowed +
-

+
+ + + diff --git a/system/admin/views/custom-field-post.html.php b/system/admin/views/custom-field-post.html.php index cff7004..a49f239 100644 --- a/system/admin/views/custom-field-post.html.php +++ b/system/admin/views/custom-field-post.html.php @@ -10,34 +10,58 @@ if (file_exists($field_file)) { ?>
-

+
-
- - - - - - +
+
+ + +
+
+ + +
+
+ + +
+
+ + +
+
+ + +
+
+ + +
+
+ No spaces for Name input. Underscores and dashes allowed -
+
+
+
Options
+
+ + No spaces for select and option Value input. Underscores and dashes allowed +
-

+
+ + + diff --git a/system/admin/views/custom-field-profile.html.php b/system/admin/views/custom-field-profile.html.php index 92364c6..d7ecef3 100644 --- a/system/admin/views/custom-field-profile.html.php +++ b/system/admin/views/custom-field-profile.html.php @@ -10,34 +10,58 @@ if (file_exists($field_file)) { ?>
-

+
-
- - - - - - +
+
+ + +
+
+ + +
+
+ + +
+
+ + +
+
+ + +
+
+ + +
+
+ No spaces for Name input. Underscores and dashes allowed -
+
+
+
Options
+
+ + No spaces for select and option Value input. Underscores and dashes allowed +
-

+
+ + + diff --git a/system/admin/views/custom-field-subpage.html.php b/system/admin/views/custom-field-subpage.html.php index b75830c..c4e2235 100644 --- a/system/admin/views/custom-field-subpage.html.php +++ b/system/admin/views/custom-field-subpage.html.php @@ -10,34 +10,58 @@ if (file_exists($field_file)) { ?>
-

+
-
- - - - - - +
+
+ + +
+
+ + +
+
+ + +
+
+ + +
+
+ + +
+
+ + +
+
+ No spaces for Name input. Underscores and dashes allowed -
+
+
+
Options
+
+ + No spaces for select and option Value input. Underscores and dashes allowed +
-

+
+ + + diff --git a/system/admin/views/custom-field.html.php b/system/admin/views/custom-field.html.php index 744d776..61ffb68 100644 --- a/system/admin/views/custom-field.html.php +++ b/system/admin/views/custom-field.html.php @@ -3,7 +3,7 @@

Custom fields enable users to add extra, specific data fields to their content, allowing for more detailed and flexible content management.

-

Use get_field() function in your template. Example: +

Use get_field() function in your template.

diff --git a/system/resources/js/form.builder.js b/system/resources/js/form.builder.js index f41cf74..f962170 100644 --- a/system/resources/js/form.builder.js +++ b/system/resources/js/form.builder.js @@ -32,17 +32,23 @@ typeEl.addEventListener('change', () => { // Add new option for select field addOptionBtn.addEventListener('click', () => { const optionDiv = document.createElement('div'); - optionDiv.classList.add('option-item'); + optionDiv.setAttribute('class', 'option-item row mt-1 mb-1'); + const col1Div = document.createElement('div'); + col1Div.classList.add('col'); + + const col2Div = document.createElement('div'); + col2Div.classList.add('col'); + const labelInput = document.createElement('input'); labelInput.type = 'text'; labelInput.placeholder = 'Label (required)'; - labelInput.classList.add('option-label'); + labelInput.setAttribute('class', 'option-label form-control'); const valueInput = document.createElement('input'); valueInput.type = 'text'; valueInput.placeholder = 'Value (required)'; - valueInput.classList.add('option-value'); + valueInput.setAttribute('class', 'option-value form-control'); valueInput.addEventListener('input', () => { valueInput.value = valueInput.value.replace(/\s+/g, ''); // Remove spaces in real-time }); @@ -53,7 +59,10 @@ addOptionBtn.addEventListener('click', () => { removeBtn.setAttribute('class', 'btn btn-danger'); optionDiv.appendChild(labelInput); - optionDiv.appendChild(valueInput); + optionDiv.appendChild(col1Div); + optionDiv.appendChild(col2Div); + col1Div.appendChild(labelInput); + col2Div.appendChild(valueInput); optionDiv.appendChild(removeBtn); optionListEl.appendChild(optionDiv); }); @@ -131,19 +140,25 @@ function editField(index) { optionListEl.innerHTML = ''; field.options.forEach(opt => { const optionDiv = document.createElement('div'); - optionDiv.classList.add('option-item'); + optionDiv.setAttribute('class', 'option-item row mt-1 mb-1'); + + const col1Div = document.createElement('div'); + col1Div.classList.add('col'); + + const col2Div = document.createElement('div'); + col2Div.classList.add('col'); const labelInput = document.createElement('input'); labelInput.type = 'text'; labelInput.placeholder = 'Label (required)'; labelInput.value = opt.label; - labelInput.classList.add('option-label'); + labelInput.setAttribute('class', 'option-label form-control'); const valueInput = document.createElement('input'); valueInput.type = 'text'; valueInput.placeholder = 'Value (required)'; valueInput.value = opt.value.replace(/\s+/g, ''); // Remove spaces - valueInput.classList.add('option-value'); + valueInput.setAttribute('class', 'option-value form-control'); valueInput.addEventListener('input', () => { valueInput.value = valueInput.value.replace(/\s+/g, ''); // Remove spaces in real-time }); @@ -158,7 +173,10 @@ function editField(index) { }); optionDiv.appendChild(labelInput); - optionDiv.appendChild(valueInput); + optionDiv.appendChild(col1Div); + optionDiv.appendChild(col2Div); + col1Div.appendChild(labelInput); + col2Div.appendChild(valueInput); optionDiv.appendChild(removeBtn); optionListEl.appendChild(optionDiv); });