翻书笔记 《 人人都能学会的 WordPress 实战课》

好久没有好好的看一本书了,说明这段日子过的太浮躁。 现在是2020年初,特殊时期,导致了足不出户的现状,人呐闲久了总会想找点事情做。 这片博文算是一篇读书笔记,写的是自己在看 《 人人都能学会的 WordPress 实战课》这本书的过程的一些笔记。东西写的不是十分的高阶,所以就尽快读完写完了。

WP基本使用技巧

站点优化

  • 动静分离,静态文件与冬天文件进行分离,比如静态文件放在 COS 上进行托管

  • 图片压缩来进行加载提速Compress JPEG &PNG image作为一个图片统一压缩的插件

  • 启用站点预加载功能来实现,用户点击的预加载WordPress Instant Articles


  • 使用 nginx 代替 apache 来作为 webserver
  • PHP 开启OPCache,使用操作码缓存提升运行速度
  • mysql 打开Query Cache,Mysql 查询缓存来提高速度

  • 对象缓存 使用 Memcached 和 Batcache 进行缓存
  • WP Super Cache,html页面缓存
  • Super Static Cache 插件来实现页面静态化

  • 关闭谷歌字体,来提升页面加载速度
  • Gravatar头像使用国内cdn 代替
  • 图片使用LazyLoad
  • Smart WordPress 插件来开启 ETag

安全加固

一个系统的安全与否与它本身的价值相关

  • 使⽤邮箱登陆, Email Login
  • 关闭 XML-RPC
  • 关闭 JSON Rest API

WP主题使用以及管理

快速说明

前面主题安装使用的部分就直接跳过了。

  • 主题分为 header/footer/siderbar/single 这三大部分

  • 在indexphp 的文件中分为 get_header/get_sidebar/get_footer 这三个函数来分辨渲染这三个部分。

  • wp的文章主循环:

    <?php if ( have_posts() ) : ?>
    <?php while ( have_posts() ) : the_post(); ?>
    ... Display post content
    <?php endwhile; ?>
    <?php endif; ?>
      
    // 标题 替换为 <?php the_title();?>;
    // 摘要 替换为 <?php the_excerpt();?>;
    // 作者 替换为 <?php the_author();?>;
    // 作者标签的 href 的值替换为 <?php the_author_link();?> 
    // ⽇期 替换为 <?php the_date();?> 
    // 文章的永久链接: <?php the_permalink();?>
    

文件结构

WordPress 主题可能会有很多⽂件,不过总体来说可以将它们分为三类:

  • CSS 样式⽂件和 JS 脚本⽂件:style.css ;

  • 函数⽂件:function.php ;

  • 模板⽂件:index.php/home.php/single.php/etc.


WordPress 的每个模块的调用关系在下面的

主题开发

关于页面的功能不仅仅是自己编写的,里面的内容可以使用自己预先使用 php 编写的模板。来实现归档页面,或者友链词云之类的功能。这里我直接 COpy一下书里的一个例子来,对开发的内容来进行说明:

<?php
/*
Template Name: 归档
*/
function _PostList($atts = array())
{
  global $wpdb;
  $rawposts = $wpdb->get_results("SELECT ID, year(post_date) as post_year, post_date, post_title FROM $wpdb->
  posts WHERE post_status = 'publish' AND post_type = 'post' AND post_password = '' order by post_date desc");
	foreach ($rawposts as $post) {
  	$posts[$post->post_year][] = $post;
  }
  
  $rawposts = null;
  $html = '<div class="archives-container"><ul class="archives-list">';
  
  foreach ($posts as $year => $posts_yearly) {
    $html .= '<li><div class="archives-year">' . $year . '年</div><ul class="archives-sublist">';
    foreach ($posts_yearly as $post) {
      $html .= '<li>';
      $html .= '<time datetime="' . $post->post_date . '">' . mysql2date('m⽉d⽇ D', $post->post_date, true) . '</time>';
      $html .= '<a href="' . get_permalink($post->ID) . '">' . $post->post_title . '</a>';
      $html .= "</li>";
    }
    $html .= "</ul></li>";
  }
	  $html .= "</ul></div>";
  	return $html;
}
  
  function _PostCount()
  {
  	$num_posts = wp_count_posts('post');
	  return number_format_i18n($num_posts->publish);
	}
	get_header();
?>
<div class="row">
<div class="col-sm-12 blog-main">
<?php echo _PostList();
?>
</div>
</div>
</div>
<?php get_footer();?>

可以在代码的内容看到,这里的页面模板实际上是一个进行数据库查询,之后把结果在页面上进行渲染的功能,这里的输出内容是直接使用的html 来进行拼接生成。


另外一个简单的例子是实现一个标签云,来实现文章的tag统一展示。

<?php
/*
Template Name: 标签云
*/
get_header();?>
<div class="row">
	<div class="col-sm-12 blog-main">
	 <?php wp_tag_cloud("smallest=20&largest=50&unix=px&number=200");?>
 	</div>
 </div>
 </div>
<?php get_footer();?>

这里是直接使用 的Wordpress的内置函数,来实现一个标签云。


GenerateWP 可以直接生成一些常用的 wordpress的代码,

WP插件开发

WP运行机制

index.php 文件开始 加载 wp-blog-header.php ,再加载 wp-load.php h和 template-loader.php , 继续加载 wp-config.php 之后是 wp-settings.php

在 setting 里面对已启用的插件来进行加载。


插件是通过Wordpress提供的API函数来实现继承的,之间的耦合挺弱的,相关的函数可以在 wp-includes/plugin.php 中来看到API函数,类似于HOOK的方法,来hook到每个动作上去。

其中的hook分 action/filter ,前者勾动作消息后执行,后者是接到消息处理。


配置项目入库

/**
* 初始化设置项
*/
function gitchat_copyright_activate() {
	add_option('gitchat_copyright_code','<hr><p>这是⼀个来⾃ GitChat 达⼈课的插件</p><hr>');
}
register_activation_hook(__FILE__,'gitchat_copyright_activate' );

// 在插件应用数据库的值的时候
$content .= get_option('gitchat_copyright_code');

短代码插件

shortCode 这里可以理解为一个洪,允许用户插入在页面中的地方,之后会在渲染页面的时候会自动的进行替换。

// 不带参数与内容
// [git]
function gitchat_git_shortcode() {
	return "Hello World";
}
add_shortcode( 'git', 'gitchat_git_shortcode' );

// 带参数与内容
[git id='222' title='jah']this is a test[/git]
function gitchat_git_shortcode( $atts , $content = null ) {
  $atts = shortcode_atts(array(
    'id' => '1',
    'title' => 'hahaha',
    ),$atts,'git');
  return $atts['id']."__".$atts['title']."---".$content;
}

// 使用 [git] 来使用短代码
标签:

留下点什么吧