Shuffle.js. Как перенести на WordPress?

Добрый день! Возникла необходимость перенести скрипт Shuffle.js на Вордпресс (https://vestride.github.io/Shuffle/).

<div class="container">

	 <div class="portfolio-filter-nav">
	  <button class="btn btn-default" data-group="wallpaper">Wallpapers</button>
	  <button class="btn btn-default" data-group="graphics">Graphic Design</button>
	</div>      

<div class="portfolio-filter-column">
	<div data-groups='["wallpaper"]'>
	   <img src="http://placehold.it/400x534" alt="" class="img-responsive">
	</div>

	<div data-groups='["graphics"]'>
		<img src="http://placehold.it/400x566" alt="" class="img-responsive">
	</div>

	<div data-groups='["wallpaper", "graphics"]'>
		<img src="http://placehold.it/400x600" alt="" class="img-responsive">
	</div>

Далее зарегестрировал произвольный тип записи и таксономии:

//страница
add_action('init', 'our_portfolio');
function our_portfolio(){
	register_post_type('our_portfolio', array(
		'public' => true,
		'supports' => array('title', 'editor', 'thumbnail')
	));
};
add_action('init', 'taxonomy_our_portfolio');
function taxonomy_our_portfolio(){
	register_taxonomy('portfolio_one', 'our_portfolio', array(
			'public' => true,
			'labels' => array(
			'name' => 'Рубрики портфолио',
			'all_items' => 'Все рубрики портфолио'),
			'hierarchical' => true
		)
	);
};

далее вставил на страницу page_portfolio.php код:

                    <div id="portfolio-filter-nav">
						<ul id="filter">
							<li data-group="wallpaper"></li>
							<li data-group="graphics"></li>
						</ul>
					</div>

				<?php $our_portfolio = new WP_Query(array('post_type' => 'our_portfolio'));?>
				<?php if ( $our_portfolio->have_posts() ) : ?>
					<div id="portfolio-filter-column">
						<ul class="portfolio-filter" class="clearfix">
				<?php while ( $our_portfolio->have_posts() ) : $our_portfolio->the_post(); ?>
							<li class="portfolio-item item col-4" data-groups='[ -=&&&&&&&=- ]'>
								<?php the_post_thumbnail(); ?>
								<div class="portfolio-text"><?php the_content(); ?></div>
							</li>
				<?php endwhile; ?>
						</ul>
					</div>
				<?php else: ?>
					<div class="no-personal">...</div>
				<?php endif; ?>
				<?php wp_reset_query(); ?>

Собственно ломаю голову как вывести список пользовательских рубрик (таксономий)

так, чтобы итоговый результат был как в HTML-коде (<li data-group=»название рубрики»>)
А также что надо сделать, чтобы вместо -=&&&&&&&=- (data-groups='[«wallpaper», «graphics»]’) выводились те рубрики, которые были выбраны пользователем (то-есть пользователь выбрал при создании поста рубрику wallpaper и итоговый код имеет вид data-groups='[«wallpaper»]’, а если выбрал две рубрики wallpaper и graphics, тогда data-groups='[«wallpaper», «graphics»]’).

Заранее благодарю за ответы!