Greetings David,
13+ years and still at it with PT, I'm working on a new layout and I've a modified featured_products page (several actually) that I'm wanting to call in with a php 'on click' function in the below example menu.
It's a product slider that I'm trying to get to call specific categories into the page when the nav link is clicked. The links line up horizontal in a tab formation and I have built a featured page for each of these categories as well. Was hoping you could help me out or provide an alternative suggestion.
<div class='text-center'>
<ul class='product-filter-menu nav-tabs'>
<li class='nav-item'><a class='nav-link' href='#'>TOPS</a></li>
<li class='nav-item'><a class='nav-link' href='#'>JUMPSUITS</a></li>
<li class='nav-item'><a class='nav-link' href='#'>LINGERIE</a></li>
<li class='nav-item'><a class='nav-link active' href='#'>JEANS</a></li>
<li class='nav-item'><a class='nav-link' href='#'>DRESSES</a></li>
<li class='nav-item'><a class='nav-link' href='#'>COATS</a></li>
<li class='nav-item'><a class='nav-link' href='#'>JUMPERS</a></li>
<li class='nav-item'><a class='nav-link' href='#'>LEGGINGS</a></li>
</ul>
</div>Hi David,
Thanks for the suggestion, part of it I'm able to work out, but only getting my first tab list to show in panes. I'm posting the code work below for what I am currently working with.. perhaps you'll see right off where I need to change something. Unless I need to add multiple categories to pull from database? I figure I'm close at any rate, lol
{code saved}
Thanks again, and as expected still awesome support, none better out there!
Ray
Hello Ray,
Thank you for your comments!
For this pattern the <div class='container-fluid'>...</div> containing the tabs should be part of a separate file as what I think will be happening with the above is that every .load() call is creating a new instance of the tabs HTML inside the existing tabs (which would almost certainly break things...)
If you save the code posted without the container-fluid as a separate file - perhaps one just for the purposes of serving the ajax response (and then you don't need the isset() checks) that should be all it is...
Cheers,
David.
--
PriceTapestry.com
Thanks for your expertise David, hope you had a nice Thanksgiving as well.
Wanted to show you what I've ended up with on this, went a little different approach from what we've discussed here.
Have a look {code saved}
You're welcome! Seasons greetings to you also.
Cheers,
David.
--
PriceTapestry.com
Hi Ray,
If your template is using jQuery you could do something with .load() which loads arbitrary HTML from a URL into the specified element, for example if you have on your page below the slider;
<div id='featured_content'></div>...but the content you load needs to be the raw HTML without the header etc. so one thing to do would be to add support for a ?ajax=1 parameter for your featured pages to exclude the header and footer if $_GET["ajax"] is set e.g.
if (!isset($_GET["ajax"])){
require("html/header.php");
require("html/menu.php");
require("html/searchform.php");
require("html/banner.php");
}
...and:
if (!isset($_GET["ajax"])){
require("html/footer.php");
}
Then in your slider HTML, something like;
<li class='nav-item'><a class='nav-link' href='#' onclick='$("#featured_content").load("/featured_tops.php?ajax=1")'>TOPS</a></li>Hope this points you in the right direction...
Cheers,
David.
--
PriceTapestry.com