在zblog站点内容页中以标题第一个标点前内容，利用wp rest api 调用wordpress站点相关外链。

zblog的tpure主题为例，

在主题文件single.php的body中添加以下代码：

                <script>
//网页中以标题第一个标点前内容，调用wordpress站点相关外链
document.addEventListener('DOMContentLoaded', function() {
var pageTitle = document.title;
console.log('Page Title:', pageTitle);
// 寻找标题中的第一个标点符号的索引
var firstPunctuationIndex = pageTitle.search(/[.,\/#!$%^&*;:{=\-_`~(，。、？！；：“‘【《〈（ ]/);
// 如果标题中有标点符号，则截取标点符号之前的内容作为搜索词；否则使用完整的标题作为搜索词
var searchWord;
if (firstPunctuationIndex !== -1) {
searchWord = pageTitle.slice(0, firstPunctuationIndex).trim();
} else {
searchWord = pageTitle;
}
console.log('Search Word:', searchWord);
fetch('https://www.ystcw.com/wp-json/wp/v2/posts?search=' + encodeURIComponent(searchWord))
.then(response => response.json())
.then(data => {
// 处理数据并渲染到 HTML 中
const linksContainer = document.getElementById('links-container');
// 截取前10个结果
const first10Results = data.slice(0, 10);
first10Results.forEach(post => {
const link = post.link.replace(/\\/g, '/'); // 替换转义字符为正常斜杠
const title = post.title.rendered;
const linkElement = document.createElement('a');
linkElement.classList.add('link');
linkElement.href = link;
linkElement.target = "_blank"; // 添加 _blank 属性
linkElement.textContent = title;
linksContainer.appendChild(linkElement);
// 添加换行
linksContainer.appendChild(document.createElement('br'));
});
})
.catch(error => {
console.error('Error fetching data:', error);
});
});
</script>

在post-single.php中的文章正文{$article.Content}下，添加以下代码用于显示前端：

<div id="links-container"></div>

效果截图

zblog站点启用API及调用

插件名称：文章列表站外调用

作者: 沉冰浮水

使用说明：

最新的10篇发布文章

<script type="text/javascript" src="https://www.n305.com/?Api&keyword=10,null,null,null,null,null,null,new"></script>

调用某个分类下的前N篇文章

（右侧案例为分类目录1下面的前10篇文章）

<script type="text/javascript" src="https://www.n305.com/?Api&keyword=10,1,null,null,null,null,null,new"></script>

参数说明：?Api&keyword=10,1,null,null,null,null,null,new分别对应

$count（条数）,$cate（分类）,$auth（作者id）,null,$tags(标签id),null,null,$order(排序：new最新、hot最热、comm热评、rand随机)

例如： 调用分类ID为2，作者id为1的最近发布的前3篇文章。

<script type="text/javascript" src="https://www.n305.com/?Api&keyword=3,2,1,null,null,null,null,new"></script>

效果图

Wordpress调用另一个wordpress站点的API数据，随机显示10条数据，search关键词可能无效。

/body前添加代码：

  <script>
document.addEventListener('DOMContentLoaded', function() {
// 获取JSON数据
fetch('https://www.penglaipavilion.com/wp-json/wp/v2/posts?categories=7868&search=旅游&doing_wp_cron=')
.then(response => response.json())
.then(data => {
// 随机选择10条数据
const randomResults = [];
while (randomResults.length < 10) {
const randomIndex = Math.floor(Math.random() * data.length);
randomResults.push(data[randomIndex]);
}
// 提取链接并渲染到 HTML 中
const linksContainer = document.getElementById('links-container');
randomResults.forEach(post => {
const link = post.link.replace(/\\/g, '/'); // 替换转义字符为正常斜杠
const title = post.title.rendered;
const linkElement = document.createElement('a');
linkElement.classList.add('link');
linkElement.href = link;
linkElement.target = "_blank"; // 添加 _blank 属性
linkElement.textContent = title;
linksContainer.appendChild(linkElement);
// 添加换行
linksContainer.appendChild(document.createElement('br'));
});
})
.catch(error => {
console.error('Error fetching data:', error);
});
});
</script>

特别注意：有些wordpress站点必须要加上&doing_wp_cron=，因为站点启用定时功能的话，没有&doing_wp_cron=不会显示数据。