Changing Custom HTML Widget into Tab. Using AJAX?

Not sure if this is appropriate or not, but I’m kinda lost on what to do here. Need some advice and clarification.

So, at this site http://iceiceicy.com/wingwah/, I’ve created a Custom HTML Widget (located above the product thumbnails)

<div class=”tagcloud”>
<ul class=”tag-widget”>
<li>
<a href=”http://iceiceicy.com/wingwah/”>All Watches</a>
</li>
<li>
<a href=”http://iceiceicy.com/wingwah/product-tag/general-sport/”>General
Sport</a>
</li>
<li>
<a href=”http://iceiceicy.com/wingwah/product-tag/chronograph/”>Chronograph</a>
</li>
<li>
<a href=”http://iceiceicy.com/wingwah/product-tag/military/”>Military</a>
</li>
<li>
<a href=”http://iceiceicy.com/wingwah/product-tag/diver/”>Diver</a>
</li>
<li>
<a href=”http://iceiceicy.com/wingwah/product-tag/dress/”>Dress</a>
</li>
<li>
<a href=”http://iceiceicy.com/wingwah/product-tag/pilots/”>Pilots</a>
</li>
<li>
<a href=”http://iceiceicy.com/wingwah/product-tag/racing/”>Racing</a>
</li>
</ul>
</div>

Currently, the homepage is the Woocommerce product archive page.
My question is, how I want the widget options to act as tab. Meaning when the user click one of the link, the page is not reload, only the watches thumbnails are changing.

I’m thinking the only way is to using AJAX. What I want to know is it possible to make it and what are the basic logic steps to take?

Read more here:: Changing Custom HTML Widget into Tab. Using AJAX?

Leave a Reply

Your email address will not be published. Required fields are marked *