在Blogger中导航下一个和上一个帖子在同一标签下 [英] Navigating Next And Prev Posts Under Same Labels in Blogger

问题描述

对于初学者，我希望您阅读

用于Blogger主题的下一个和上一个按钮

了解我想要的概念？然后让我们继续我的问题：

现在我已经将代码嵌入到next和prev按钮的主题中，它们是：

 < nav class ='op-pagi'> 
< a class ='blog-pager-older-link'expr：href ='data：olderPageUrl'expr：id ='data：widget.instanceId +& quot; _blog-pager-older-link& 'expr：title ='data：olderPageTitle'>< i class ='fa fa-angle-left'/>上一页< / A> 
< a class ='blog-pager-newer-link'expr：href ='data：newerPageUrl'expr：id ='data：widget.instanceId +& quot; _blog-pager-newer-link& 'expr：title ='data：newerPageTitle'>下一步< i class ='fa fa-angle-right'/>< / a> 
< / nav> 
  

并使用我以前问过的问题：

如何将相同标签下的帖子列表的URL和标题存储到Blogger中的字符串数组中
和

如何匹配并指向数组中的特定数据在Blogger

我自己创建了一个代码：

 <脚本> 
 //<！[CDATA [
 
< b：if cond ='data：blog.searchLabel'> 
 
 var URLArray =< b：eval expr ='data：posts map（post =& gt; post.url）'/> ;; 
 var TitleArray =< b：eval expr ='data：posts map（post =& gt; post.title）'/> ;; 
 
 var cURL =< data：post.url />; 
 var gTitle =< data：post.title>; 
函数IndexFinder（元素，索引）{
返回元素== cURL 
} 
函数IndexFinderT（元素，索引）{
 return element == gTitle; 
} 
 var sU = URLArray.findIndex（IndexFinder）; 
 var sT = TitleArray.findIndex（IndexFinderT）; 
 
函数prevURL（）{
 var prevU = URLArray [sU-1]; 
 return prevU; 
} 
函数prevTitle（）{
 var prevT = TitleArray [sT-1]; 
 return prevT; 
} 
函数nextURL（）{
 var nextU = URLArray [sU + 1]; 
返回nextU; 
} 
 function nextTitle（）{
 var nextT = TitleArray [sT + 1]; 
返回nextT; 
} 
 
< / b：if> 
 //]]> 
< / script> 
  

现在我试着用下面的代码和prev按钮改变 expr：href ='data：olderPageUrl' to expr：href ='prevURL（）' >
，标题也相同

expr：title ='data：olderPageTitle' to expr：title ='prevTitle（）'

但无效。

你能告诉我我错了什么地方，以及如何使它工作？

注意：我没有特别原因使用 CDATA 标签，只是认为它可能有帮助某种程度上来说。即使我在谷歌上搜索，我也不明白它的确切用法。因为 prevURL（） c>和 prevTitle（）是JavaScript函数而不是Blogger数据标记，因此不需要使用 expr

您将需要修改以下功能 -

 函数prevURL（）{
 var prevU = URLArray [sU-1]; 
 document.querySelector（'。blog-pager-old-link'）。href = prevU; 
} 
 
函数prevTitle（）{
 var prevT = TitleArray [sT-1]; 
 document.querySelector（'。blog-pager-old-link'）。title = prevT; 
} 
  

以及类似的下一页链接。无需更改页面的HTML。

同样在另一个答案中提到了 Bassam 。不要将JavaScript封装在 CDATA 指令中，否则Blogger使用的XML解析器将完全忽略脚本块，也不会评估数据标记。

For starters I want you to read
Next and Prev Buttons for Blogger Theme

Understood the concept of what I want? Then let's continue with my question :

Now I have the code that was already embedded to the theme for next and prev buttons and they were :

<nav class='op-pagi'>
<a class='blog-pager-older-link' expr:href='data:olderPageUrl' expr:id='data:widget.instanceId + &quot;_blog-pager-older-link&quot;' expr:title='data:olderPageTitle'><i class='fa fa-angle-left'/> Prev</a>
<a class='blog-pager-newer-link' expr:href='data:newerPageUrl' expr:id='data:widget.instanceId + &quot;_blog-pager-newer-link&quot;' expr:title='data:newerPageTitle'> Next <i class='fa fa-angle-right'/></a>
</nav>

And Using the questions I had asked before like :
How to store the URL's and Titles of a list of posts under same label into a String array in Blogger AND
How to match and point to a particular data in array in Blogger

I made a code myself :

<script>
//<![CDATA[

<b:if cond='data:blog.searchLabel'>

  var URLArray = <b:eval expr='data:posts map (post =&gt; post.url)'/>;
  var TitleArray = <b:eval expr='data:posts map (post =&gt; post.title)'/>;  

var cURL = "<data:post.url/>";
var gTitle = "<data:post.title>";
function IndexFinder(element,index) {
   return element == cURL
}
function IndexFinderT(element,index){
   return element == gTitle;
}
var sU = URLArray.findIndex(IndexFinder);
var sT = TitleArray.findIndex(IndexFinderT);

function prevURL(){
    var prevU=URLArray[sU-1];
return prevU;
}
function prevTitle(){
    var prevT=TitleArray[sT-1];
return prevT;
}
function nextURL(){
    var nextU=URLArray[sU+1];
return nextU;
}
function nextTitle(){
    var nextT=TitleArray[sT+1];
return nextT;
}

</b:if>
//]]>
</script>

Now I tried Using the code which I showed first for next and prev button by changing expr:href='data:olderPageUrl' to expr:href='prevURL()'
and the same for Title also
expr:title='data:olderPageTitle' to expr:title='prevTitle()'
but didn't work.

Can you please tell me where I went wrong and how to make it work?

Note: I'm using CDATA Tag for no particular reason, just put it there thinking it might help in someway. I didn't understand its exact usage even when I searched on google. If it's causing any problem please mention it.

解决方案

As both prevURL() and prevTitle() are JavaScript functions and not Blogger data tags, you don't need to use the expr in front of the attribute.

You will instead need to modify the functions as follows -

function prevURL(){
    var prevU=URLArray[sU-1];
    document.querySelector('.blog-pager-older-link').href = prevU;
}

function prevTitle(){
    var prevT=TitleArray[sT-1];
    document.querySelector('.blog-pager-older-link').title = prevT;
}

and similarly for the next page links. No need to change the HTML of the page.

Also as Bassam mentioned in the other answer. Don't wrap the JavaScript in CDATA directive otherwise, the XML parser that Blogger uses will completely ignore the script block and no data tag will get evaluated

这篇关于在Blogger中导航下一个和上一个帖子在同一标签下的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！