WordPress:Creating a Static Front Page

来自站长百科
跳转至： 导航、​ 搜索


UPDATE: With the release of WordPress Version 2.1, the option to set your own front page can be accomplished via your Administration > Settings > Reading panel. However unlike the old explanation that follows, you must NOT name your home page template file "home.php". If you do, this will cause a conflict with the WordPress 2.1 system. The approach that follows on this page is no longer necessary with WordPress 2.1 or newer

更新: 随着WordPress 2.1版本的发行，可以通过, 管理 > 设置 > 阅读 面板设置你自己的首页。 然而与先前的说明不同，你不能将你的注意模板文件命名诶"home.php"。如果你那样命名了，会与WordPress2.1系统产生冲突。这个网页下面的方法不再适用于WordPress2.1版本或者更新的版本。


模板:Oldpage

模板:旧的网页

Known as a static front page or splash page, this is the first page seen by users entering your site. Unlike a traditional WordPress front page, featuring the WordPress Loop which generates a list of your most recent posts, the static front page is a customized page that lacks WordPress:The Loop and displays static information that can either invite people to "click through" to the real good stuff or offer highlighted post or article features and information that direct users to different areas of your WordPress site. It can have static information and links that do not change, or it can incorporate some automatically changing information.

作为静态首页 或者 splash page，这是用户进入你的站点首先看到的网页。与传统的WordPress首页不同，传统的首页拥有WordPress Loop，产生你最近所写文章的列表，而静态首页是个自定义的网页，缺少The Loop并且显示静态的信息，能够邀请人们"点击到"真正的好内容，或者提供突出的文章或者帖子功能和信息，能够将用户导向WordPress网站的不同区域。可以拥有静态的信息和链接，信息和链接不会更改，或者可以包含一些动态的，可以更改的信息。

This page contains a technique that requires editing several files. There's a different, shorter technique to get a static front page while maintaining a separate blog area, that is based on WordPress's static pages, and another one that works entirely with template files. Both of these techniques, unlike WordPress 2.1's front page setting, lend themselves to creating a richer, more interactive front page.

这个网页包含有一种方法，需要编辑几个文件。有一个不同的，更简单的的方法，得到为静态网页的同时，保持分开的博客区，以WordPress静态页面为基础，而且http://www.nyceducated.info/blog/internet/the-real-ultimate-static-front-page/ 另一个完全与模板文件一起运行]。两种方法，与WordPress2.1的首页设置不同，能够创建内容更丰富，更具有互动性的首页。

Using WordPress as CMS[ ]

将WordPress用在CMS[ ]

If your goal is to have a WP-created Page with static information called "Home" at example.com/, and the standard blog index at example.com/news/, the method below may cause the more tag to fail.

如果你的目的是使得WP创建的网页的称为"主页"的静态信息，位于example.com/，而标准的博客索引位于example.com/news/，下面的例子可能导致更多的标签失效。

Use a plugin such as Filosofo Home-Page Control instead. It works fine with WP installed in root.

使用一个插件，例如Filosofo 主页控制。这个插件能够与安装在根目录上的插件，一起运行。

Create and Upload a Static Front Page[ ]

创建并且上传静态首页[ ]

By default, most websites feature their main page as one of the following, and you can set yours to be any of these:

默认情况下，大多数网站的主页类似于下面的一种形式，而且你可以将你的主页设置为下面的一种形式：

  • index.html
  • home.html
  • index.php
  • home.php
  • default.htm


  • index.html
  • home.html
  • index.php
  • home.php
  • default.htm

To create your static front page: 要创建你的静态首页：

  1. Using a text editor, open a blank document.
  1. 使用一个文本编辑器，打开一个空白的文档。
  1. Design the inside of your Static Front Page.
  1. 设置你的静态首页的内部内容。
  1. Save it with any name listed above (Example: home.php).
  1. 用以上列出的任何名称，保存这个文档（例如：home.php）。
  1. If you have WordPress in another folder, upload your static page to your root HTML folder.
  1. 如果你将WordPress放在另一个文件夹，将你的静态网页上传到你的根HTML文件夹。

Please note that your static page

请注意你的静态网页

may need to have the file extension ".php" in order for the PHP code to be processed. 可以需要文件扩展名".php"，以使得PHP代码能够得到处理。

If your static page is "index.html", then the PHP code may not be executed.

如果你的静态网页是"index.html"，那么PHP代码可能得不到执行。

Install WordPress in its own folder or, if you have already installed it, consider moving WordPress to its own folder (or follow instructions below if you do not want to move entire WordPress core files -- but you might have some problems when upgrading).

安装 WordPress到WordPress自己的文件夹，或者如果你已经安装了WordPress，考虑移动WordPress到WordPress自己的文件夹（或者如果你不想要移动整个WordPress核心文件，你可以遵循以下的指示说明--但是 升级WordPress的时候，你可能会遇到一些麻烦）。

If WordPress is in Root[ ]

如果WordPress在根目录上[ ]

If you do not want to move your WordPress installation to another folder, or you are in a hurry, you can use these instructions or look [[WordPress:#Change Apache Configuration File|below]].

如果你不想将WordPress安装移到 另一个文件夹，或者如果你比较匆忙，你可以使用这些指示说明或者查看 [[WordPress:#Change Apache Configuration File|下面的]]。


  1. Create a new folder on your site server for WordPress index.php file.
  1. 在你的站点服务器上为WordPressindex.php文件创建新的文件夹。
  1. Download index.php WordPress file and open it in a text editor.
  1. 下载index.php文件并且在文本编辑器中将其打开。
  1. Change the require('./wp-blog-header.php'); line to require('../wp-blog-header.php');
  1. 将require('./wp-blog-header.php');命令行更改为require('../wp-blog-header.php');
  1. Save and upload the modified index.php file into the new folder.
  2. 保存并给将更改过的index.php文件上传到新的文件夹。
  1. Login into your WordPress Administration Panel and go to Settings > General.
  2. Change your Blog URI pointing to the new folder. For example, if your site is http://example.com, and the new folder is called blog, enter http://example.com/blog.
  1. 登录到你的WordPress管理面板并且进入设置 > 总的。
  1. 更改你的博客URL，指向新的文件夹。例如，如果你的站点是http://example.com，而且新的文件夹称为blog，输入http://example.com/blog。

Now, upload your splash page to your root server folder. 现在，将你的splash 页面上传到你的根服务器文件夹。

Change Apache Configuration File[ ]

更改 Apache 配置文件[ ]

There is another form to upload your static front page without moving all your WordPress files to another folder.

有另一种形式可以上传你的静态首页，但是不会将你的所有的WordPress文件移到另一个文件夹。

When you request a folder in a Apache web server (for example the folder called /chouette), the core of Apache will search for a file with any of the names in a list saved in httpd.conf. If your server lets you use .htaccess files for change the original configuration, you can follow these steps:

当你在Apache网络服务器上寻求文件夹的时候（例如文件夹称为/chouette），Apache的核心会搜索文件，文件拥有保存在httpd.conf中的列表上列出的任何名称。如果你的服务器允许你使用.htaccess文件，来更改原始配置，你可以遵循以下的这些步骤：

  1. Open the .htaccess file from your root web folder in a text editor.
  2. At the top of the file, add:
  1. 在一个文本编辑器中打开来自你的根网络文件夹中的.htaccess文件。
  2. 在文件的顶上方，添加：
DirectoryIndex home.php index.php
DirectoryIndex home.php index.php

Save and upload the modified .htaccess file.

保存并且上传更改过的.htaccess文件。

You need to mention index.php as a second choice, otherwise you will not be able to access the index.php in directories below the wordpress root directory unless you explicitly mention it in the URL. For instance, the url:

你需要将index.php看做第二种选择，否则，你就不能访问WordPress根目录下面的目录中的index.php，除非你在URL中清楚地提及了。例如，url:

http://<wordpress root URL>/wp-admin/

http://<wordpress root URL>/wp-admin/

would not work. 不能够运行。

Integrating WordPress[ ]

与WordPress 结合[ ]

To incorporate or integrate WordPress with your static front page, you can include the header, sidebar, footer, and even a mini-version of the WordPress Loop.

将WordPress与你的静态首页相结合，你可以包含标头，边栏，页底文字，设置WordPress Loop的微型版本。

Include the Header[ ]

包含标头[ ]

To include the header from your WordPress Theme to maintain a consistent look, add this to the top of the page, using the folder path name you installed WordPress into:

要包含来自WordPress 主题的标头，来维持整体的外观，将这个添加到网页的顶端，使用你安装WordPress的文件夹路径名： 

<?php 
define('WP_USE_THEMES', false);
require('./wordpress/wp-blog-header.php');
get_header();
?>


<?php 
define('WP_USE_THEMES', false);
require('./wordpress/wp-blog-header.php');
get_header();
?>


The purpose of requiring or including wp-blog-header.php is to let you make use of any WordPress function or template tag. When you include it in your page a function such as get_header() becomes available, just as it is in the standard WordPress templates.

需求或者包含wp-blog-header.php的目的是使得你能够利用任何WordPress函数或者模板标签。当你在网页中包含了一个标签，就可以拥有函数，例如get_header() ，因为它是在标准的WordPress模板中。

Note: In rare cases defining the WP_USE_THEMES constant to false may produce non-CSS formatted page output. To workaround this you can try replacing ('WP_USE_THEMES', false) with ('WP_USE_THEMES', true).

注：在很少的一些例子中，将定义code>WP_USE_THEMES常数定义为错误的，可能会导致非CSS格式网页的产生。要处理这个问题，你可以试着用('WP_USE_THEMES', true)替换('WP_USE_THEMES', false)。

Include The Sidebar or Footer[ ]

包含边栏或者页底文字[ ]

To add the sidebar and/or footer from your WordPress Theme, include one or both of the following at the bottom of the page, using the same folder path:

要包含来自WordPress主题的边栏和/或者页底文字，在网页的底部包含下面的一项或者两项，使用相同的文件夹路径： 

<?php get_sidebar(); ?>

<?php get_footer(); ?>
<?php get_sidebar(); ?>

<?php get_footer(); ?>

Adding a Mini-Loop[ ]

添加个微型Loop[ ]

You can incorporate a customized-version of the WordPress Loop in a static page to generate a short list of the latest posts on your WordPress blog. This "mini-Loop" acts like a feed, displaying your posts in a non-WordPress, PHP document. Change the value for $how_many to reflect the number of posts you want to show, and make sure the path to your wp-config.php file is correct.

你可以将自定义版本的WordPress Loop结合到静态页面，产生WordPress博客上最新的文章的简短的列表。这个"微型的Loop"就如一个feed，在非WordPress，PHP文档上显示你的文章。更改$how_many的参数值，反映你想要显示的文章的数目，并且确定打到你的wp-config.php文件的路径是正确的。 

<?php
$how_many=5; //How many posts do you want to show
require_once('wp-config.php'); // Change this for your path to wp-config.php file ?>

<ol id="whats-new">
<?
$news=$wpdb->get_results("SELECT `ID`,`post_title` FROM $wpdb->posts
WHERE `post_type`=\"post\" AND `post_status`=\"publish\" ORDER BY post_date DESC LIMIT $how_many");
foreach($news as $np){
printf ("<li><a href=\"index.php?p=%s\">%s</a></li>", $np->ID,$np->post_title);
}?>
</ol>




<?php
$how_many=5; //How many posts do you want to show
require_once('wp-config.php'); // Change this for your path to wp-config.php file ?>

<ol id="whats-new">
<?
$news=$wpdb->get_results("SELECT `ID`,`post_title` FROM $wpdb->posts
WHERE `post_type`=\"post\" AND `post_status`=\"publish\" ORDER BY post_date DESC LIMIT $how_many");
foreach($news as $np){
printf ("<li><a href=\"index.php?p=%s\">%s</a></li>", $np->ID,$np->post_title);
}?>
</ol>










Also, change "index.php" in the printf statement to include the path to the index.php in your installation directory.

同时，更改printf声明中的"index.php"，包含路径，到达你的安装目录中的index.php。

Alternatively, if using custom WordPress:Permalinks on your blog, you can set the code to retrieve the permalink for each article and use this as the link to the post. This helps with indexing of your site by search engines such as Google, which can blacklist your site if it considers that pages duplicate content (the same content would be accessible both by using the address {YourWordPressURL}/?p=x and {YourWordPressURL}/permalink-address/). To use permalinks on your static page:

此外，如果在你的博客上使用自定义的WordPress:Permalinks，你可以设置代码，返回每篇文章的permalink并且使用这个作为链接到文章的链接。这样能够帮助搜索引擎，如Google，索引你的站点，如果搜索引擎认为网页复制了内容（通过使用{YourWordPressURL}/?p=x 和{YourWordPressURL}/permalink-address/地址，可以得到同样的内容），可以将你的站点记入黑名单。在你的静态页面上使用permalinks: 

<?php
$how_many=5; //How many posts do you want to show
require_once('wp-config.php'); // Change this for your path to wp-config.php file ?>
<ol id="whats-new">
<?
$news=$wpdb->get_results("SELECT `ID`,`post_title` FROM $wpdb->posts
WHERE `post_type`=\"post\" AND `post_status`=\"publish\" ORDER BY post_date DESC LIMIT $how_many");
foreach($news as $np){
printf ("<li><a href=\"%s\">%s</a></li>", get_permalink($np->ID),$np->post_title);
} ?>
</ol>



<?php
$how_many=5; //How many posts do you want to show
require_once('wp-config.php'); // Change this for your path to wp-config.php file ?>
<ol id="whats-new">
<?
$news=$wpdb->get_results("SELECT `ID`,`post_title` FROM $wpdb->posts
WHERE `post_type`=\"post\" AND `post_status`=\"publish\" ORDER BY post_date DESC LIMIT $how_many");
foreach($news as $np){
printf ("<li><a href=\"%s\">%s</a></li>", get_permalink($np->ID),$np->post_title);
} ?>
</ol>



In either case, posts will appear in an ordered list with the CSS ID whats-new. With WordPress:CSS you can change the look of the mini-Loop to suit your own site design.

在两个例子中，文章会在有序列表中出现，拥有CSS IDwhats-new。拥有CSS，你可以更改微型loop的外观，适应你自己的站点设计。

Using Feedburner?[ ]

使用 Feedburner?[ ]

If you are already using Feedburner to manage your feeds, have a look at their "BuzzBoost" feature under Publicize.

如果你已经使用Feedburner管理你的feeds，请看看宣传下面的"BuzzBoost"功能。

With just a small piece of javascript you can add your recent posts to any html page. Very customizable as well.

只有有一点javascript，你就可以将你最近的文章添加到任何html页面。很容易自定义。

(More on WordPress:Using_FeedBurner)

(更多的请看Using_FeedBurner)

Examples[ ]

例子[ ]

What you do with your static front page is up to you and your imagination. Here are a few examples to help you see the possibilities.

你想要怎样处理静态首页，取决于你自己和你的想象力。下面有几个例子，帮助你看看可以怎样处理静态首页。

Typical Page[ ]

典型的网页[ ]

thumb|right|Look of the code on your left

thumb|right|看看左边的代码


A typical welcome static page may feature a greeting that explains what the site is about and welcomes users to click on various links to enter the site. It could include summaries or links to articles or posts within, changed manually by the site administrator.

典型的欢迎静态首页，可能会有问候，解释了站点是关于什么的，同时欢迎用户点击不同的链接，进入站点。可能包含文章摘要或者链接，链接到文章或者帖子，站点管理员可以动手更改这样的设置。

Here is an example of a simple, typical page structure: 下面是一个例子，关于简单而又典型的网页结构： 

<?php 
   define('WP_USE_THEMES', false);
   require('./wp-blog-header.php'); 
   get_header(); 
?>
<div id="content" class="narrowcolumn">
<h1>Welcome to my site</h1>
<p>Hello and welcome to my site. You can go to my web 
page about how to improve your digital photography 
techniques with your new digital camera; or you 
can <a title="Go to my Blog" href="/wordpress/index.php">go 
to my blog.</a></p></div>

<?php get_sidebar(); ?>
<?php get_footer(); ?>



<?php 
   define('WP_USE_THEMES', false);
   require('./wp-blog-header.php'); 
   get_header(); 
?>
<div id="content" class="narrowcolumn">
<h1>欢迎来到我的站点Welcome to my site</h1>
<p>你好，欢迎来到我的站点。你可以进入我的网页，网页关于怎样使用新的数码相机提高你的数码摄影技术；或者你可以 
<a title="进入我的博客" href="/wordpress/index.php">进入我的博客。</a></p></div>

<?php get_sidebar(); ?>
<?php get_footer(); ?>


Static Page with Mini-Loop[ ]

拥有微型Loop的静态网页[ ]

To incorporate the mini-Loop into your static page review this example of a possible structure:

要将微型Loop与你的静态网页相结合，请看看这个结构例子： 





<?php 
  define('WP_USE_THEMES', false);
  require('./wp-blog-header.php'); 
  get_header();
?>
<div id="content" class="narrowcolumn">
<h1>Welcome to my site.</h1>
<p>Hello and welcome to my site. You can go to my web page about how to improve your 
shoots with your digital camera; or you can go to my blog</p>
  
<h2>Latest posts in my blog:</h2>

<?php 
  # Here starts Mini Loop trick: You can use this code, but _at your own risk_
  # If you want to improve this code, you're welcome ;) 
  $how_many=7; //How many posts do you want to show 
?>
<ul class="whats-new">
<?php
  $news=$wpdb->get_results("SELECT ID,post_title FROM $wpdb->posts
    WHERE `post_type`=\"post\" AND `post_status`= \"publish\" ORDER BY `post_date` DESC LIMIT $how_many");
  foreach($news as $np){
    printf ("<li><a href=\"index.php?p=%s\">%s</a></li>", $np->ID,$np->post_title);
  }
?>

</ul></div>
<?php
  get_sidebar(); 
  get_footer(); 
?>

<?php 
  define('WP_USE_THEMES', false);
  require('./wp-blog-header.php'); 
  get_header();
?>
<div id="content" class="narrowcolumn">
<h1>欢迎来到我的站点</h1>
<p>你好，欢迎来到我的站点。你可以进入我的网页，网页关于怎样使用新的数码相机提高你的数码摄影技术；或者你可以进入我的博客。</p>
  
<h2>我的博客中最新的文章:</h2>

<?php 
  # 下面开始微型Loop方法: 你可以使用这个代码量， but _at your own risk_
  #如果你想要改善这个代码，欢迎你那样操作； ;) 
  $how_many=7; //你想要显示多少篇文章
?>
<ul class="whats-new">
<?php
  $news=$wpdb->get_results("SELECT ID,post_title FROM $wpdb->posts
    WHERE `post_type`=\"post\" AND `post_status`= \"publish\" ORDER BY `post_date` DESC LIMIT $how_many");
  foreach($news as $np){
    printf ("<li><a href=\"index.php?p=%s\">%s</a></li>", $np->ID,$np->post_title);
  }
?>

</ul></div>
<?php
  get_sidebar(); 
  get_footer(); 
?>
取自“https://www.zzbaike.com/wiki/index.php?title=WordPress:Creating_a_Static_Front_Page&oldid=7501”