WordPress+WPML通过AJAX读取指定语言的文章

WordPress+WPML多语言网站中,如果用get_posts / WP_Query这这些方法返回文章,默认都会返回当前页面所在的语言的文章。如果要跳出当前页面指定的语言,或者如果当前页面并不在WPML管理下,没有指定语言,那么get_posts / WP_Query默认返回的是网站默认语言的文章。

假如我们网站默认语言是英语,但还有第二种语言是中文,我想在英语的页面只显示中文文章,WPML有一个快捷办法:

global $sitepress;
$lang = "zh-hans";
$sitepress->switch_lang( $lang );

通过$sitepress->switch_lang方法,可以切换当前页面的默认循环语言。

有了这个方法,我们也可以在WP的Ajax接口中切换语言了。本文记录一个通过Ajax接口获取文章的范例。

后端

function brain1981_get_ajax_posts() {
	global $sitepress;
	$sitepress->switch_lang( $_POST["lang"] );
 
	// Query Arguments
	$paged = ( $_POST["paged"] ) ? $_POST["paged"] : 1;
 
	$args = array(
		'post_type' => 'post',
		//'post_status' => array('publish'),
		'posts_per_page' => 9,
		'paged' => $paged,
		'order' => 'DESC',
		'orderby' => 'post_time',
		'cat' => 12,
		'suppress_filters' => 0
	);
	$ajaxposts = new WP_Query( $args );
	$response = '';
	if ( $ajaxposts->have_posts() ) {
		while ( $ajaxposts->have_posts() ) {
			$ajaxposts->the_post();
			setup_postdata( $post );
			//此处调用一个显示文章的模板inc/news-media.php,这个模板需要你自己写
			$response .= get_template_part("inc/news","media");
		}
	} else {
		$response .= "no data";
	}
	echo $response;
	exit;
}
 
// Fire AJAX action for both logged in and non-logged in users
add_action('wp_ajax_get_ajax_posts_media', 'brain1981_get_ajax_posts');
add_action('wp_ajax_nopriv_get_ajax_posts_media', 'brain1981_get_ajax_posts');

前端页面

$(function(){
	//每页显示9条文章
	var perPage=9;
	var countPost = <?php echo $count;?>;
	var pages = Math.ceil(countPost/perPage);
	var pagenationObj = $("#pagenation");
	//指定语言
	lang = "zh-hans";
	for(i=1;i<=pages;i++){
		pagenationObj.append("<a class='page-ajax' href='###' data-page='"+i+"'>"+i+"</a>");
	}
 
	function getAjaxPost(page){
		var ajax_data = {
			action: "get_ajax_posts_media",
			paged: page,
			lang: lang 
		};
		jQuery.post("/wp-admin/admin-ajax.php", ajax_data,
			function(data) {
				$( '#postArea' ).html( data );
				pagenationObj.children("[data-page='"+page+"']").addClass("current");
		});
	}
	//页面加载的时候先显示第一页
	getAjaxPost(1);
	pagenationObj.children(".page-ajax").on("click",function(){
		pagenationObj.children(".page-ajax").removeClass("current");
		$(this).addClass("current");
		var idx = $(this).data("page");
		getAjaxPost(idx);
	});
})

同时在页面上准备两个空的容器

<!--显示文章列表的区域-->
<div id="postArea"></div>
<!--显示分页按钮的区域-->
<div id="pagenation"></div>

这个例子其实也是很多AJAX无刷新的主题的开发思路。

本文代码只作为试例参考,实际页面样式需要看官自己写。我有一个在线的范例,可以访问这里 https://www.tenpowercell.com/about/newsroom?lang=zh-hans

本站所有文章均为原创,欢迎转载,请注明文章出处:https://blog.brain1981.com/2208.html。百度和各类采集站皆不可信,搜索请谨慎鉴别。技术类文章一般都有时效性,本人习惯不定期对自己的博文进行修正和更新,因此请访问出处以查看本文的最新版本。

关注我们的微信公众号-JennyStudio 本站记录了近几年的工作中遇到的一些技术问题和解决过程,“作品集”还收录了本人的大部分作品展示。除了本博客外,我们的工作室网站 – JennyStudio,内有更多作品回顾和展示。
您也可以扫描左边的二维码,关注我们的微信公众号,在微信上查看我们的案例。

发表评论

您的电子邮箱地址不会被公开。 必填项已用*标注