编辑“WordPress:Styling Page-Links”

__FORCETOC__

__FORCETOC__

Did you know you could split a single post up into different web pages?  Using the '''Next-Page''' [[WordPress:Write_Post_SubPanel#Quicktags|Quicktag]] from the '''Write Post''' Panel, you can break a single post up into different web pages.  Called the '''Page-link''' tag, place your cursor in the spot where you want a page break to appear in your post and click the '''Next-Page''' Quicktag.  You can use it throughout a long post to make two, three, four, or more pages out of the single post.  In your Post Editing textarea, it will looks like:

你知道你可以将一篇文章分成几个不同的网页吗？使用'''编写文章'''面板中的'''下一个网页'''[[WordPress:Write_Post_SubPanel#Quicktags|Quicktag]]，你可以将一篇文章分成几个不同的网页。调用'''网页链接'''标签，将你的鼠标指针放到你想要分割文章的位置，并且点击'''下一个网页''' Quicktag。你可以在一篇很长的文章中使用这种方法，并且将一篇文章分成两个，三个，四个，或者更多的网页。在你的文章编辑文本区，这看起来像：

 <nowiki><!--nextpage--></nowiki>

<nowiki><!--nextpage--></nowiki>

When you view your post on your site, the multi-page links appear as links at the bottom of the generated post and usually look like: 

当你在站点上访问文章的时候，多个网页链接在产生的文章的底部以链接的形式出现，通常看起来像：

<div style="border:1px solid blue; width:50%; color: blue; margin: 10px; padding:10px">Page <span style="color:black">1</span>, 2, 3</div>

<div style="border:1px solid blue; width:50%; color: blue; margin: 10px; padding:10px">Page <span style="color:black">1</span>, 2, 3</div>

Did you know you could customize these page links?
你知道你可以自定义这些网页链接吗？
=Examining the Page-Links Tag=

=查看网页链接标签=

The default look for the page-links is shown above. The web page you are on isn't highlighted as a link but shown as a solid number.  If you do only a few multi-page posts, this might be all you need to have the reader continue reading the pages in sequence.

网页链接的默认外观在上面显示了。你所在的网页没有作为链接，而是作为solid number显示。如果你只有几篇拥有多个网页的文章，你可能需要这个，使得读者继续按顺序阅读网页。

There are two template tags that may be used to style your page-links tag.  The [[WordPress:Template_Tags/link_pages|link_pages()]] and [[WordPress:Template_Tags/wp_link_pages|wp_link_pages()]] template tags.  The <tt>link_pages()</tt> tag uses ''strings'' in quotes as parameters and the <tt>wp_link_pages()</tt> uses [[WordPress:Template_Tags/How_to_Pass_Tag_Parameters#Tags_with_PHP_function-style_parameters|boolean phrases]] as parameters.  Both do basically the same thing.

有两个模板标签，可以用来设计网页链接标签。[[WordPress:Template_Tags/link_pages|link_pages()]] 和[[WordPress:Template_Tags/wp_link_pages|wp_link_pages()]]模板标签。<tt>link_pages()</tt>标签在引用中使用''字符串''作为参数而且<tt>wp_link_pages()</tt>使用[[WordPress:Template_Tags/How_to_Pass_Tag_Parameters#Tags_with_PHP_function-style_parameters|boolean phrases]]作为参数。两个基本上是相同的。

The default usage, shown above, for the <tt>wp_link_pages()</tt> tag is:

<tt>wp_link_pages()</tt>标签的默认用法，如上显示，是：

<pre><?php wp_link_pages(); ?></pre>

<pre><?php wp_link_pages(); ?></pre>

The parameters we'll be working with for the template tag are:

我们处理模板标签的参数是：

* '''before:''' Text to put before all the links. Defaults to <code>&lt;p&gt;Pages:</code>.

* '''after:''' Text to put after all the links. Defaults to <code>&lt;/p&gt;</code>.
* '''next_or_number:''' Indicates whether page numbers should be used. Valid values are <code>number</code> (Default) and <code>next</code>
* '''nextpagelink:''' Text for link to next page. Defaults to <code>Next page</code>.
* '''previouspagelink: (''string'') Text for link to previous page. Defaults to <code>Previous page</code>.
* '''pagelink:''' Format string for page numbers. The <code> % </code> in the parameter string will be replaced with the page number, so <code>Page %</code> generates "Page 1", "Page 2", etc. Defaults to <code>%</code>, just the page number.

You've seen the default look. Let's play with some other possibilities.




* '''before:''' 放置在所有链接之前的文本。默认为<code>&lt;p&gt;Pages:</code>.

* '''after:''' 放置在所有链接之后的文本。默认为<code>&lt;/p&gt;</code>.
* '''next_or_number:''' 暗示是否应该使用网页页码。有效的参数值是<code>number</code> (默认) 和 <code>next</code>
* '''nextpagelink:''' 链接到下一个网页的链接文本。默认为<code>Next page</code>.
* '''previouspagelink: (''string'') 链接到上一个网页的链接文本。默认为<code>Previous page</code>.
* '''pagelink:''' 网页页码的格式字符串。参数字符串中的 <code> % </code>会由网页页码所取代，因此 <code>Page %</code> 产生 "Page 1", "Page 2", 等等。默认为<code>%</code>，只是网页页码。

你已经看到了默认外观。让我们处理一些其它外观内容。

=Changing the Look of Page-Links=

=更改网页链接的外观=

By default, the page-links are in an HTML paragraph tag. Add a [[WordPress:CSS]] class to the DIV section surrounding the paragraph tag and you have even more control over the look of the page-link tag.

默认情况下，网页链接是在HTML段落标签中。向包围段落标签的DIV部分添加[[WordPress:CSS|CSS]] class，你更能够控制网页链接标签的外观。

The following use of the tag adds a DIV tag before and after the page-links, shows the word "Page" next to each page number, and when you are in the middle of the page order you will see the page number instead of the word "next", and lists the pages as shown below.

使用下面的标签在网页链接的前后分别添加一个DIV标签，在每个网页页面旁边显示单词"网页"，而且当你在很多网页的中间次序的时候，你会使用网页页码，而不是单词"下一个"，而且如下所示，列出网页。

<pre><div class="pagelink"><?php wp_link_pages('pagelink=Page %'); ?></div></pre>

<pre><div class="pagelink"><?php wp_link_pages('pagelink=Page %'); ?></div></pre>

Let's give our style class "pagelink" a green color and italics:
让我们将样式类别"pagelink"设置为绿色斜体：
<div style="border:1px solid blue; width:50%; margin: 20px; padding:20px; color: green; font-style: italic; padding:20px">Page 1   Page 2   Page 3</div>

<div style="border:1px solid blue; width:50%; margin: 20px; padding:20px; color: green; font-style: italic; padding:20px">Page 1   Page 2   Page 3</div>

Want to have more fun? Let's design these so they do more than just tell the reader "page 1".

想要更有趣？我们设计这些，这样就不止会通知用户"网页 1"

<pre><?php link_pages('To read this story, ', '. ', 
'next', ' or you can read on to the next page', 
'you can go back to the previous page'); ?> </pre>

<pre><?php link_pages('阅读这个故事, ', '. ', 
'next', '或者你可以继续阅读下一个网页', 
'你可以返回到上一页'); ?> </pre>

If you were on page three of four pages, it might look like this:
如果你在四个网页中的第三页上，可能看起来像：
<div style="border:1px solid blue; width:50%; padding:10px">To read this story, [[WordPress:#Changing the Look of Page-Links|you can go back to the previous page]] [[WordPress:#Changing the Look of Page-Links|or you can read on to the next page]].</div>


<div style="border:1px solid blue; width:50%; padding:10px">阅读这个故事，[[WordPress:#Changing the Look of Page-Links|你可以返回到上一页]] [[WordPress:#Changing the Look of Page-Links|或者你可以继续阅读下一页]]。</div>


Using the <tt>link_pages()</tt> you can add a [[WordPress:Fun_Character_Entities|extended character or character entity]] to replace the '''next''' and '''previous''' for an interesting look.  Let's add the double right arrow &raquo; and double left arrow&laquo;.

使用<tt>link_pages()</tt>，你可以添加[[WordPress:Fun_Character_Entities|扩展的字符或者字符实体]]，来替换'''下一个''' 和 '''上一个'''，产生有趣的外观。让我们添加两个右箭头&raquo;和两个左箭头&laquo;。

<pre><?php link_pages('<p>Pages: ', '</p>', 'next', ' &amp;raquo;', '&amp;laquo; '); ?></pre>

<pre><?php link_pages('<p>Pages: ', '</p>', 'next', ' &amp;raquo;', '&amp;laquo; '); ?></pre>

And it might look like:
可能看起来像：
<div style="border:1px solid blue; width:50%; margin: 20px; padding:20px; padding:20px">Pages: <span style="color:blue">«  »</span></div>

<div style="border:1px solid blue; width:50%; margin: 20px; padding:20px; padding:20px">Pages: <span style="color:blue">«  »</span></div>

:'''Note:''' ''You can only use [[WordPress:Fun_Character_Entities|extended characters or HTML character entities]] with <tt>link_pages()</tt> because the ampersand required to create the entity is seen by <tt>wp_link_pages()</tt> as the boolean "and" and the tag will not work. Try using the direct character instead of an entity.''

:'''注:''' ''你只可以将[[WordPress:Fun_Character_Entities|扩展的字符或者HTML字符实体]] 和 <tt>link_pages()</tt> 一起使用，因为需要的&符号创建的实体， <tt>wp_link_pages()</tt> 看做是boolean "和" 而且标签也不能够运行。试着使用直接的字符而不是实体。 ''


These are just a few samples and you can use your imagination to create a wide range of different styles and looks for your page links on your site or theme.

有一些样本，你只要发挥你的想象力，为站点或者主题上的网页创建不同的样式和外观。