html — выводит foreach PHP в виде таблицы с двумя столбцами

Question

html — выводит foreach PHP в виде таблицы с двумя столбцами

Я пытаюсь получить этот PHP в Woocommerce для вывода в таблицу вместо одного большого списка. Я пробовал теги HTML-таблицы, но в таблицу помещается только первый результат «foreach».

add_filter( 'woocommerce_product_tabs', 'woo_new_product_tab' );
function woo_new_product_tab( $tabs ) {

// Adds the new tab

$tabs['test_tab'] = array(
'title'     => __( 'Amenities', 'woocommerce' ),
'priority'  => 20,
'callback'  => 'woo_new_product_tab_content'
);

return $tabs;

}
function woo_new_product_tab_content() {

// The new tab content

echo '<h2>Amenities</h2>';
echo '<h5>On-Site</h5>';
$authorvalues = get_the_terms( $product->id, 'pa_onsite');
echo '<ul>';
foreach ( $authorvalues as $authorvalue ) {
echo '<li>'.$authorvalue->name.'</li>';
echo '</ul>';
}
echo '<h5>Off-Site</h5>';
$authorvalues = get_the_terms( $product->id, 'pa_offsite');
echo '<ul>';
foreach ( $authorvalues as $authorvalue ) {
echo '<li>'.$authorvalue->name.'</li>';
echo '</ul>';
}
}

Результат выглядит так прямо сейчас:

<br/>Amenities<br/>
On-Site
<ul><li>Playground</li></ul>
Off-Site
<ul><li>Golf</li>
<li>Hiking</li>
<li>Outdoor pool</li>
<li>Skiing</li>
<li>Spa</li>
<li>Tennis</li></ul>

Нужно, чтобы это было в двух столбцах, хотя.

0

foreach html php tabular woocommerce

Решение

Другие решения

Других решений пока нет …

Источник

Accepted Answer

HTML это язык для описания семантики текста.
Таблицы предназначены для использования для данных, которые помещаются в таблицу.
Вы действительно хотите списки, но в другом формате, попробуйте немного CSS

<!DOCTYPE html>
<html>
<head>
<title>TODO supply a title</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<style>
.container {
float: left;
margin-right: 30px;

}
.container ul{
list-style: none;
padding: 0;
}
.container li{
border-top: 1px solid black;
margin: 0;
}
.container li:first-child{
border-top: 0;
}
</style>
</head>
<body>
<h1>Amenities</h1>
<div class="container">
<h2>On-Site</h2>
<ul>
<li>Playground</li>
</ul>
</div>
<div class="container">
<h2>Off-Site</h2>
<ul>
<li>Golf</li>
<li>Hiking</li>
<li>Outdoor pool</li>
<li>Skiing</li>
<li>Spa</li>
<li>Tennis</li>
</ul>

</div>

</body>
</html>

Я добавил <style> за .container и завернул два списка в <div> важно class="container" атрибут, который должен соответствовать стилю.
Есть лучшие способы включить стили, но это хороший способ начать.

0