使用jquery / isotope类调用/链接wordpress类别

我正在研究我的网站的投资组合部分，以及我在filter.js脚本中的这些代码（在wp-includes / js文件夹中）

jQuery(document).ready(function(){ jQuery(".grid-item").first().addClass("comercial"); jQuery(".grid-item:eq(1)").addClass("residencial"); jQuery(".grid-item:eq(2)").addClass("cultural"); jQuery(".grid-item:eq(3)").addClass("interiores"); jQuery(".grid-item:eq(4)").addClass("residencial"); jQuery(".grid-item:eq(5)").addClass("residencial"); jQuery('.grid').isotope({ itemSelector: '.grid-item', layoutMode: 'fitRows' }); jQuery(".dcjq-parent-li ul li a").click(function() { jQuery(".dcjq-parent-li ul li a").removeClass("active"); jQuery(this).addClass("active"); var filtro=jQuery(this).attr("data-filter"); jQuery(".grid").isotope({ filter: filtro}); }); jQuery(".dcjq-parent").click(function() { if(jQuery(this).siblings("ul").css("display")=="block") jQuery(this).siblings("ul").slideToggle( "slow" ); else { jQuery(".accordionMenu ul").each(function( index ) { if(jQuery(this).css('display')=="block") { jQuery(this).slideToggle( "slow" ); jQuery(this).siblings("a").removeClass("active"); } }); jQuery(this).siblings("ul").slideToggle( "slow" ); jQuery(this).addClass("active"); } }); }); 

我在上面的代码中有不同的类，但我不确定如何在wordpresspost中使用这些类或如何创建一个函数/循环来在post中使用这些类。

我在我的投资组合页面中的代码：

 
 
 
 Tipologia  
 
todos
 
Residencial
 
Comercial
 
Cultural
 
Interiores
 
 
 
 Datas 
 
todos
 
1980 - 1984
1985 - 1989
1990 - 1994
1995 - 1999
2000 - 2004
2005 - 2009
2010 - 2014
 
 
 
 
 
 have_posts()) : $my_query->the_post(); ?> ID) );?>  
<a href="https://stackoverflow.com/questions/34103768/call-link-wordpress-category-with-jquery-isotope-classes/">
<img alt="" src="https://stackoverflow.com/questions/34103768/call-link-wordpress-category-with-jquery-isotope-classes/" />
 
<a href="https://stackoverflow.com/questions/34103768/call-link-wordpress-category-with-jquery-isotope-classes/">
 
ID, 'text', true ); ?> 
 
  
 
   

我已经通过阅读wordpress / isotope集成的教程，在jquery中创建类，在项目页面上执行代码以及我不理解的是如何在wordpresspost中使用这些同位素/ jquery类来完成所有这些代码所以它们将是显示为filter。 我知道，它可以通过类别过滤，标签，元框或自定义循环完成，但我不知道如何创建自定义循环，它使用类别中的filter类。

对不起，如果我没有以正确的方式提出问题，我是初学者，并尝试通过教程和专家的帮助来做所有事情。

Answer 1

删除自动添加您想要手动添加的类的JS代码，

这些线

 jQuery(".grid-item").first().addClass("comercial"); jQuery(".grid-item:eq(1)").addClass("residencial"); jQuery(".grid-item:eq(2)").addClass("cultural"); jQuery(".grid-item:eq(3)").addClass("interiores"); jQuery(".grid-item:eq(4)").addClass("residencial"); jQuery(".grid-item:eq(5)").addClass("residencial"); 

在你的wordpress循环中，获取当前项的类别列表并将它们存储在由空格分隔的变量中，因为这将在以后用作类，你可以使用get_the_category函数

 //get the category assign to the post //$cat_objects = get_the_category(); $cat_objects = wp_get_post_terms( get_the_ID(), 'portfolio_category'); /**Define category variable to be use as class, leave empty if you don't want to add global classes you can add 'grid-item' in here and remove it on the LI element, **/ $categories = ''; // Loop through each category object foreach ( $cat_objects as $cat ) { // extract the category slug and add them to $categories variable, $categories .= ' '. $cat->slug; /** Added Space at the beginning of each category so they will be separated during actual output**/ } 

然后，您可以将上面代码中存储在$categories变量中的$categories列表添加为grid-item li的附加类，

你的循环看起来应该是这样的

 
 have_posts()) : $my_query->the_post(); $cat_objects = get_the_category(); $categories = ''; foreach ( $cat_objects as $cat ) { $categories .= ' '. $cat->slug; } ?> ID) );?>  
 
 
ID, 'text', true ); ?>