Skip to content

Instantly share code, notes, and snippets.

@nektobit
Created October 10, 2018 10:26
Show Gist options
  • Save nektobit/dd9ee275375f12b512622d94c31bebca to your computer and use it in GitHub Desktop.
Save nektobit/dd9ee275375f12b512622d94c31bebca to your computer and use it in GitHub Desktop.
<?php
function wcpi_add_my_products_section( $sections ) {
$sections['wcpi_settings'] = 'Иконки товаров';
return $sections;
}
add_filter( 'woocommerce_get_sections_products', 'wcpi_add_my_products_section' );
// Add Settings for new section
function wcpi_add_my_products_settings( $settings, $current_section ) {
// make sure we're looking only at our section
if ( 'wcpi_settings' === $current_section ) {
$my_settings = array(
array(
'title' => 'Иконки товаров',
'type' => 'title',
'id' => 'wcpi_settings',
),
array(
'type' => 'wcpi_table',
'id' => 'wcpi_table',
),
array(
'id' => 'wcpi_product_options',
'type' => 'textarea',
'title' => 'Названия свойств товара и ссылки на картинки',
'options' => array(
'uno' => __( 'The first option', 'my-textdomain' ),
'dos' => __( 'The second option', 'my-textdomain' ),
),
'default' => '',
'desc' => "формат:<br>Фотообои|imageurl<br>Можно мыть|imageurl ",
'desc_tip' => true,
),
array(
'type' => 'sectionend',
'id' => 'wcpi_settings',
),
);
return $my_settings;
} else {
// otherwise give us back the other settings
return $settings;
}
}
add_filter( 'woocommerce_get_settings_products', 'wcpi_add_my_products_settings', 10, 2 );
//Custom html
add_action('woocommerce_admin_field_wcpi_table','wcpi_table_render');
function wcpi_table_render() {
?>
<p>
<table border="3" class="custom_wp_table" id="custom_wp_table">
<tbody>
<thead>
<tr>
<th>Ключ</th>
<th>Название</th>
<th>URL иконки</th>
<th></th>
</tr>
</thead>
<tr>
<td contenteditable='true'></td>
<td contenteditable='true'></td>
<td contenteditable='true'></td>
<td><input type="button" value="Удалить" onclick="deleteRow(this)"/></td>
</tr>
</tbody>
</table>
<a href="javascript:addRow();">Добавить</a>
</p>
<style>
.custom_wp_table td {
min-width: 100px;
max-width: 500px;
min-height: 10px;
}
.custom_wp_table td input {
width: 100%;
}
</style>
<script>
function addRow() {
var tbody = document.getElementById('custom_wp_table'),
n, row, cell;
var cellcount = tbody.rows[0].cells.length;
row = tbody.insertRow();
for(var i=0; i < cellcount - 1; i++){
row.insertCell().setAttribute("contenteditable", true);
}
var lastcell = row.insertCell();
lastcell.innerHTML = '<input type="button" value="Удалить" onclick="deleteRow(this)"/>';
}
function deleteRow(btn) {
var row = btn.parentNode.parentNode;
row.parentNode.removeChild(row);
}
</script>
<script>
jQuery(document).ready(function($) {
var tbody = document.getElementById('custom_wp_table'),
n, row, cell;
var cellcount = tbody.rows[0].cells.length;
var i=0;
$('#custom_wp_table').bind("DOMSubtreeModified",function(){
var myRows = [];
var $headers = $("#custom_wp_table th");
var $json = '';
var $rows = $("#custom_wp_table tbody tr").each(function(index) {
$cells = $(this).find("td");
myRows[index] = {};
$cells.each(function(cellIndex) {
if( i != cellcount - 1 ) {
myRows[index][$($headers[cellIndex]).html()] = $(this).html();
i++;
}
});
i=0;
});
// Let's put this in the object like you want and convert to JSON (Note: jQuery will also do this for you on the Ajax request)
var myObj = {};
myObj.myrows = myRows;
$json = JSON.stringify(myObj);
$('#wcpi_product_options').val($json);
});
})
</script>
<?php
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment