wordpress文章页模板
你的手机里都有哪些APP?有什么好的分享?
wordpress本身就是一个博客程序,它最开始就是做博客起家的,所以用wordpress写博客是非常好的,现在有很多个人博客网站都是使用wordpress搭建的。不过现在wordpress的作用并不仅仅局限于写博客的,它几乎可以做任何类型的网站,现在有很多企业网站也在使用wordpress建站。
你的手机里都有哪些APP?有什么好的分享?
WordPress是一个非常流行的博客平台和内容管理系统 (CMS),它既适合前端也适合非前端用户来写博客。下面是一些关于WordPress适合前端写博客的优点和注意事项:
**优点:**
1. **用户友好的界面:** WordPress提供了一个直观的后台管理界面,允许用户轻松创建、编辑和发布博客文章,无需编程或前端开发经验。
2. **主题和插件:** 你可以选择数千个免费或付费的主题和插件来自定义你的博客。这使得你可以轻松改变博客的外观和功能,无需编写代码。
3. **WYSIWYG编辑器:** WordPress提供所见即所得 (WYSIWYG) 编辑器,允许你在编辑文章时看到最终的外观,这对非技术人员很有帮助。
4. **SEO友好:** WordPress有许多SEO插件和工具,可以帮助你优化博客文章,提高搜索引擎排名。
5. **社交分享:** WordPress可以轻松集成社交分享按钮,使读者可以分享你的博客文章,增加流量和影响力。
6. **多媒体支持:** 你可以轻松地上传和嵌入图片、音频和视频文件,丰富你的博客内容。
7. **社区支持:** 有庞大的WordPress社区,你可以在网上找到大量的教程、插件和主题,以解决问题和改善你的博客。
**注意事项:**
1. **定制性有限:** 尽管WordPress非常灵活,但某些高度定制的设计和功能可能需要编写自定义代码。如果你是前端开发人员,这可能不是问题。
2. **性能优化:** 需要确保你的WordPress博客能够良好运行,这可能需要一些性能优化,特别是在有大量访问者时。
3. **安全性:** 由于其广泛使用,WordPress也成为了潜在的目标,因此需要采取安全措施来保护你的博客免受潜在威胁。
4. **维护:** 你需要不断更新WordPress核心、主题和插件,以确保博客保持安全和正常运行。
总的来说,WordPress适合前端写博客,特别是对于非技术人员来说,因为它提供了一个用户友好的界面和丰富的可定制选项。然而,前端开发人员也可以利用WordPress的强大功能来创建高度定制的博客。
怎样给wordpress网站模板,添加最新文章、随机文章、热评文章?
在前面的章节中,我们已经为wordpress网站模板的首页添加好了头部和左侧主体部分的内容代码,实现了wordpress全站文章列表的调用和分页效果。本节,我们再来对wordpress网站的首页模板的右侧边栏进行修改。一般情况下,wordpress博客主题模板的右侧边栏会有“最新文章、随机文章、热评文章、热门标签、热点文章”这几种内容列表。今天我们就为wordpress模板侧边栏添加“最新文章、随机文章、热评文章”这3个内容(如下图效果)。一起来看看吧。
?一、给wordpress模板侧边栏添加最新文章。
打开wordpress主题的侧边栏模板文件sidebar.php,在里面添加如下代码:
< div class="right_new">< h3>最新文章</h3>< ul><?phpquery_posts('cat=0&posts_per_page=5&caller_get_posts=1&orderby=new'); //开始查询。while (have_posts()) : the_post(); //循环查询结果。echo '< li>< a href="'.get_the_permalink().'" title="'.get_the_title().'">';echo get_the_title().'</a></li>';endwhile; wp_reset_query(); //结束查询。?></ul></div>
这段代码中,我们再次用到了wordpress循环代码,这个在首页文章列表中有介绍,这里就不多说了。这里还使用了一个函数——query_posts(),这个函数的功能是从wordpress网站的数据库wp_posts数据表中查询文章列表。
上面的query_posts()函数用到了4个参数:
cat=0:指定文章列表的分类ID,即调用哪个分类的文章。0表示所有分类。posts_per_page=5:表示调用几篇文章。caller_get_posts=1:表示排除置顶文章。orderby=new:表示按最新排列。
还要注意一点:使用query_posts()函数查询后,我们还要在循环语句后面添加wp_reset_query()来结束查询。
二、给wordpress模板侧边栏添加随机文章。在wordpress网站的公共侧边栏文件sidebar.php文件中,添加如下代码:
< div class="right_new">< h3>随机文章</h3>< ul><?php$arr = array('cat'=>'119', //只调用分类ID是119分类下的文章。'posts_per_page'=>5,'caller_get_posts'=>1,'orderby' => 'rand' //这里的rand表示随机调用。);query_posts($arr); //参数是一个数组。while (have_posts()) : the_post(); echo '< li>< a href="'.get_the_permalink().'" title="'.get_the_title().'">';echo get_the_title().'</a></li>';endwhile; wp_reset_query(); ?></ul></div>
在最新文章中,query_posts()函数的参数是一个字符串,跟其它wordpress函数一样,query_posts()的参数也可以是一个数组,所以,在随机文章中调用代码中,我们使用了数组参数。
三、给wordpress模板侧边栏添加评文章。所谓热评文章,就是按照wordpress文章的评论的多少来对文章列表进行排序。在wordpress网站的sidebar.php侧边栏文件中,添加如下代码:
< div class="right_new">< h3>热评文章</h3>< ul><?php$arr = array( 'posts_per_page'=>5,'caller_get_posts'=>1,'orderby' => 'comment_count' //按照文章的评论数量来排序);query_posts($arr); while (have_posts()) : the_post(); echo '< li>< a href="'.get_the_permalink().'" title="'.get_the_title().'">';echo get_the_title().'</a></li>';endwhile;wp_reset_query(); ?></ul></div>
通过上面的三步,我们就为wordpress网站模板的侧边栏添加好了“最新文章、随机文章、热评文章”的调用代码,是不是很简单。这里重点用到了query_posts()查询函数和wordpress的循环函数语句。在后面的章节中,我们再来介绍如何添加“热点文章和热门标签”。
如果你有什么不懂的,或者想要了解什么,可以在下面的评论中给我留言。同时,欢迎【关注】我。
wordpress网站模板首页,怎样添加全站文章列表?
在前面的章节中,我们为wordpress网站的首页模板的头部、右侧边栏、底部添加了数据调用代码,实现了我们想要的效果。这时,我们看到,这个网站首页还有一个主体部分——左侧边主体,还没有添加数据调用代码。因为,这是一个wordpress博客网站的模板主题,所以,一般情况下,左侧边显示的是wordpress网站的全站文章列表。那么,怎样给wordpress网站模板的首页添加全站文章列表调用呢?下面,我们就一起来看看吧。
第一步:添加循环代码。打开首页模板文件index.php,找到< div class="c_left">这个标签(当然,你开发的wordpress模板可能不是这个标签元素),在这个标签内部添加如下代码:
if ( have_posts() ) :while ( have_posts() ) : the_post();
endwhile;endif;
在上面的代码中,我们用到了PHP的相关语法,if判断语句和while循环语句,这里,我们没有采用大括号的方式来包含语句的主体部分,而是以冒号的形式,所以,我们需要在后面添加 endwhile和endif来结束它们,如果不添加结束语句,PHP就会报错。
代码中同我们还用到了2个函数:
have_posts():这个函数被调用时,会调用全局变量$wp_query->have_posts()成员函数,查看全局数组变量$posts的一个循环计数器,检查还有没有post文章,如果有就返回真,否则返回假。
the_post():这个函数调用$wp_query->the_post()成员函数前移循环计数器,并且创建一个全局变量$post,把当前的post文章的所有信息都赋值给这个$post变量中,以备接下来使用。
第二步:在循环体中调用文章数据。这里,我们要实现的效果,是一个简单的博客文章标题列表的形式,所以,我们在循环体中添加如下代码:
echo '< li>< a href="'.get_permalink().'">'.$post->post_title.'</a>< em>'.get_the_time("Y-m-d").'</em></li>';
意思是只调用文章的标题和发布时间。这里,我们又用到了几个函数和变量调用:
$post->post_title:这个是调用文章的标题;get_permalink():获取文章的链接地址;get_the_time("Y-m-d"):获取文章的发布时间,"Y-m-d"参数表示只显示年月日。
上面这句代码,我们用到了 “点运算符”,把变量跟字符串连接在一起。使用点运算符可以把几个变量或几个字符串或变量与字符串连接在一起,形成一个综合变量,然后,再通过echo来打印显示出来。
左边栏文章列表的整个调用代码如下:
< div class="c_left"><?phpif(have_posts()):while(have_posts()):the_post();echo '< li>< a href="'.get_permalink().'">'.$post->post_title.'</a>< em>'.get_the_time("Y-m-d").'</em></li>';endwhile;endif;?></div>
好了,通过上面的两步,我们为wordpress网站博客主题模板的首页左侧添加好了全站文章列表,效果如上图。在接下来的章节中,我们将为这个文章列表添加分页按钮,欢迎到时观看。
WP主题开发14:怎样添加wordpress主题trans的文章列表页模板?
在前面的章节中,我们创建了wordpress主题trans的公共模板:header.php头部模板、sidebar.php侧边栏模板、footer.php底部模板,这样就更加方便了trans主题的其它动态模板的开发。就比如,今天我们要开发的模板——文章列表页模板,就不需要再去修改头部、侧边栏、底部的代码了。好了,闲话不多说,我们直接进入到今天的主题当中,怎样添加trans主题的文章列表页模板?
第一步:创建列表页模板文件。
在trans主题目录下创建一个列表页模板的文件——archive.php。wordpress程序默认的文章列表页模板的名字必须是:archive 或 categoty,也就是说,可以是archive.php,也可以是category.php,我们这里用archive.php。
第二步:引入头部模板。
用sublime等编辑器打开trans主题的静态模板list.html,把你的代码复制到archive.php文件中。然后,在代码找到</header>这句代码,从<!doctype html>与</header>之间的所有代码全部删除,因为这段代码,我们已经可以使用公共模板——header.php来代替了。
删除后,我们再来引入header.php这个头部模板:
< ?php get_header(); ?>
这时,我们可以正常打开列表页了。但是有一个小问题:标题显示的不是文章分类的名称,仍然是网站的名称。而我们需要的效果是,在列表页时,我们需要显示的是文章分类目录的名称。所以,我们要在header.php文件中的<title></title>标签中修改一个调用代码,
原代码是:
< title>< ?php echo get_bloginfo("name"); ?></title>
修改成如下代码:
< title>< ?php if(is_home()){echo get_bloginfo("name"); }else{if(is_category()){$cat_c = get_the_category();echo $cat_c[0]->cat_name; echo " - "; bloginfo("name");}else{the_title(); echo " - "; bloginfo("name");} } ?></title>
这段代码的意思是:如果是网站的首页,就显示网站的名称;如果是列表页,就显示为“分类目录名称 + 网站名称”;否则就显示“文章标题+网站名称”。
第三步:引入右侧边栏模板。
在archive.php中找到< div class="c_right">标签中的所有代码,删除掉,然后,在当前位置上,引入公共模板sidebar.php侧边栏模板,代码如下:
< ?php get_sidebar(); ?>
这样,我们就不需要再去修改原< div class="c_right">标签内的代码了,而只需直接把sidebar.php拿来用就可以了。
第四步:引入底部模板。
同上,在archive.php代码中找到< footer>标签,然后,把< footer>及它后面的所有代码全部删除掉,现在不需要了,因为,我们有footer.php底部公共模板了。删除掉后,我们在原位置上直接引入这个footer.php底部模板,代码如下:
< ?php get_footer(); ?>
在引入完头部、侧边栏、底部的公共模板后,我们再来看看archive.php的模板代码,如下图:
然后,我们只需要修改archive.php模板代码中的 < div class="c_left">标签内部的代码就可以了。
第五步:修改左侧主体部分。
其实,我们查看trans主题的静态代码的效果时,我们可以看到,列表页与首页基本上是一样的,只是左侧的顶部多了一个面包屑导航。所以,我们只需要修改< div class="c_left">标签里的代码就可以了(如上图所示)。我们可以先把archive.php代码中的< div class="c_left">里的代码全部删除掉,然后把首页模板index.php代码中的< div class="c_left">所有代码全部复制下来,粘贴到archive.php中。这段代码包括了左侧的文章列表以及分页按钮。这样,archive.php的左侧主体部分基本弄好。
第六步:添加面包屑导航。
我们在archive.php模板的< div class="c_left"> 标签中的< div class="left_bottom">标签的上方,添加发下代码:
< div class="left_top">< ul>< li><span class="dashicons-before dashicons-admin-generic"></span><?php echo $cat_c[0]->cat_name; //获取当前分类名 ?></li>< li>< a href="< ?php bloginfo("siteurl"); ?>">< span class="dashicons-before dashicons-admin-home"></span>首页</a> > < ?php the_category(","); ?></li></ul>< ul>< ?php $cat_desc = $cat_c[0]->category_description; //获取当前分类的描述。if($cat_desc){echo $cat_desc; }else{echo $cat_c[0]->cat_name; //获取当前分类名}?></ul></div>
这段代码中,我们又用到了几个wordpress的函数:
the_category(","):获取当前分类导航;$cat_c = get_the_category():获取当前分类的信息,并赋值给$cat_c这个变量
面包屑导航的主要作用,就是让用户可以看到当前页面所在的个体位置。而且,可以通过点击面包屑导航中的相关链接,可以跳转到链接页面,如:返回首页(如下图)。
?通过上面的几步,我们就完成了wordpress主题trans的文章列表页动态模板的修改。嗯,是不是有一个小小的发现:修改trans主题的列表页模板要比修改首页模板index.php所花的时间要少得多。是的,因为在修改index.php首页模板时,我们需要所有的代码,而修改archive.php模板时,我们只需要把公共模板拿来直接用就可以了,省去了大量的时间,这就是公共模板的魅力之所在。好了,本节就介绍到这里,如有疑问,欢迎点评。