网站备忘录 1

自适应窗口大小需要修改footer.php

<script type="text/javascript">
    var elements = document.getElementsByClassName("bilibili");
    for (var i = 0; i < elements.length; i++) { var element = elements[i]; element.style.height = element.scrollWidth * 0.5625 + "px"; }
</script>
Code language: HTML, XML (xml)

最后插入用自定义html：

<iframe class="bilibili" src="//player.bilibili.com/player.html?bvid=BV1yS4y187mt&autoplay=0;page=1" scrolling="no" border="0" frameborder="no" framespacing="0" allowfullscreen="true" width=100%> </iframe>
Code language: HTML, XML (xml)

歌曲页面找外联播放器，自定义html插入

<iframe frameborder="no" border="0" marginwidth="0" marginheight="0" width=330 height=86 src="//music.163.com/outchain/player?type=2&id=1918916921&auto=0&height=66"></iframe>
Code language: HTML, XML (xml)

上传音频，加入playlist，嵌入playlist的html代码：

<div id="player">
[cue id="128"]
</div>
Code language: HTML, XML (xml)

参考https://medium.com/@bharatkaravadra/how-to-reduce-the-header-height-size-of-the-twenty-seventeen-theme-front-page-562f1230044c和https://wordpress.com/forums/topic/theme-2017-less-height-for-featured-images/

添加额外的CSS类：

/*Computer screen */
@media screen and (min-width: 48em) {
    .twentyseventeen-front-page.has-header-image .custom-header-image {
    /*height: 1200px;*/
    /*height: 100vh;*/
    height: 62vh;
    /*max-height: 100%;*/
    /*overflow: hidden;*/
    }
    .panel-image {
    height: 70vh;
    /*max-height: 1200px;*/
    }
    .single-featured-image-header {
    height: 40vw;
    /*not vh because it creates black edge on longer screen*/
    }
}

/* Mobile screen*/
.has-header-image.twentyseventeen-front-page .custom-header {
    /*display: table;*/
    /*height: 300px;*/
    /*height: 75vh;*/
    height: 62vh;
    /*width: 100%;*/
}

/* Computer screen with logged in user and admin bar showing on front end*/
@media screen and (min-width: 48em) {
    .admin-bar.twentyseventeen-front-page.has-header-image .custom-header-image {
    /*height: calc(100vh - 32px);*/
    height: calc(62vh - 32px);
    }
}
Code language: CSS (css)

height控制header image纵向长度. panel-image和single-featured-image-header分别控制panel image和featured image. Mobile screen实际上似乎会影响所有平台。以及wp-content/themes/twentyseventeen/style.css里：

.background-fixed .panel-image {
	background-attachment: fixed;
}
Code language: CSS (css)

好像没用，理论上应该是控制panel image在移动端是固定还是滑动的。

代码块用的是Syntax-highlighting Code Block (with Server-side Rendering)。Lean4代码示例：

example {G X : Type*} [Group G] [MulAction G X] (x : X) :
    orbit G x ≃ G ⧸ stabilizer G x :=
  MulAction.orbitEquivQuotientStabilizer G x

example {c : ℝ} (ubf : FnHasUb f) (h : c ≥ 0) : FnHasUb fun x ↦ c * f x := by
  rcases ubf with ⟨b, ubfb⟩
  use c * b
  unfold FnUb at ubfb;
  rintro x; dsimp
  exact mul_le_mul_of_nonneg_left (ubfb x) h

example : FnHasUb f → FnHasUb g → FnHasUb fun x ↦ f x + g x := by
  rintro ⟨a, ubfa⟩ ⟨b, ubgb⟩ -- 缩写
  -- simp only [FnHasUb]
  exact ⟨a + b, fnUb_add ubfa ubgb⟩

example : FnHasUb f → FnHasUb g → FnHasUb fun x ↦ f x + g x :=
  fun ⟨a, ubfa⟩ ⟨b, ubgb⟩ ↦ ⟨a + b, fnUb_add ubfa ubgb⟩

example {c : ℝ} (ubf : FnHasUb f) (h : c ≥ 0) : FnHasUb fun x ↦ c * f x := by
  rcases ubf with ⟨b, ubfb⟩
  use c * b
  unfold FnUb at ubfb;
  rintro x; dsimp
  exact mul_le_mul_of_nonneg_left (ubfb x) h

example {G : Type*} [Group G] [Fintype G] (G' : Subgroup G) : card G' ∣ card G :=
  ⟨G'.index, mul_comm G'.index _ ▸ G'.index_mul_card.symm⟩
Code language: Coq (coq)

Wolfram Mathematica代码示例：（mma函数名比较长，不建议warp line）

textFormating[inputText_] := 
  StringDelete[inputText, ("<" ~~ ___ ~~ ">") // Shortest];
nameAndSection[line_, file_] := Piecewise[{
    {{Sequence @@ 
       StringDelete[StringSplit[FileNameTake[file], "_"][[{3}]], 
        ".csv"], (ToString /@ IntegerDigits[line[[1]], 10, 3]) // 
       StringJoin}, IntegerQ[line[[5]]] && line[[5]] == 1},
    {{ToString@line[[5]], ""}, IntegerQ[line[[5]]] && line[[5]] > 1},
    {StringSplit[line[[5]], "_"], 
     StringQ[line[[5]]] && StringLength[line[[5]]] > 0}}, {"Unclear", 
    "Unclear"}];
textExtract[file_, name_] := 
  Module[{importFile, text, characterText},
   importFile = Import[file];
   text = Quiet@Select[importFile, #[[2]] == ToString[name] &];
   characterText = Piecewise[{
      {(AssociationThread[{"CSV Path", "File Name", "Section", 
             "Character", "CharacterID", "Text"} -> #] & /@
         
         Cases[text, 
          x_ :> Join[{FileNameTake@file}, nameAndSection[x, file], 
            x[[2 ;; 3]], textFormating /@ x[[{4}]]]]), 
       Length[text] > 0}}, Nothing]];
Code language: Mathematica (mathematica)

WP Super Cache安装好之后要改掉默认目录结构才能用；

内存占用高：https://cloud.tencent.com/developer/article/1720300，FPM配置文件：

pm = dynamic #指定进程管理方式，有3种可供选择：static、dynamic和ondemand。
pm.max_children = 16 #static模式下创建的子进程数或dynamic模式下同一时刻允许最大的php-fpm子进程数量。
pm.start_servers = 10 #动态方式下的起始php-fpm进程数量。
pm.min_spare_servers = 8 #动态方式下服务器空闲时最小php-fpm进程数量。
pm.max_spare_servers = 16 #动态方式下服务器空闲时最大php-fpm进程数量。
pm.max_requests = 2000 #php-fpm子进程能处理的最大请求数。
pm.process_idle_timeout = 10s
request_terminate_timeout = 120
Code language: PHP (php)

php-fpm重启：

$ sudo systemctl start php-fpm      # 启动php-fpm
$ sudo systemctl stop php-fpm       # 停止php-fpm
$ sudo systemctl reload php-fpm     # 重载php-fpm
$ sudo systemctl restart php-fpm    # 重启php-fpm
Code language: PHP (php)

伪静态，但是我忘了是干啥的了：https://blog.csdn.net/as339000204/article/details/80761651

location / {
	try_files $uri $uri/ /index.php?$args;
}

# Add trailing slash to */wp-admin requests.
rewrite /wp-admin$ $scheme://$host$uri/ permanent;
Code language: PHP (php)

接下来关于Cloudflare中的Cache Rules：

为保证wp后台工作正常：绕过URI等于/*.php*。缓存其它全部：URI包含/（这个要排到最后，免得影响前面）。验证规则可以去CF首页的“跟踪”里。

隐藏WP登录页面：https://cloud.tencent.com/developer/article/2166588

functions.php文末添加：

add_action('login_enqueue_scripts', 'tb_wp_login_protection');
function tb_wp_login_protection(){
    if( !isset($_GET['mima']) ){
        header( 'Location: ' . home_url() );
        exit;
    }
}
Code language: PHP (php)

然后用/wp-login.php?mima登录。

隐藏管理员用户名：https://cloud.tencent.com/developer/article/1773433

设置宝塔伪静态（顺便解决xmlrpc的问题）：

location ~ ^/wp-json/wp/v2/users {
  deny all;
}
location ~ ^/wp-includes/wlwmanifest.xml {
  deny all;
}
location ~ ^/xmlrpc.php$ {
  deny all;
}

xmlrpc还有一段在宝塔网页配置文件里：

location = /xmlrpc.php {
   deny all;
   access_log off;
   log_not_found off;
}

Wordfence可以开启管理员二次验证、xmlrpc屏蔽。Wordfence防火墙开启的时候好像遇到了问题但是忘了怎么解决的了_(:3 」∠ )_。以及要记得设安全组，改宝塔面板端口、访问路径，关闭phpmyadmin公开访问，SSH只用密钥登录。CDN可以隐藏服务器真实IP，但腾讯云CDN非得加一个裸的CNAME记录，然而我域名已经打开DNSSEC了_(:3 」∠ )_。Cloudflare会拦截环回测试和REST API，要设置WAF来解决：https://www.wordfence.com/help/advanced/compatibility/

设置WP管理员发件邮箱（在functions.php里，WP用这个邮箱向管理员发消息）：

// 配置邮件
add_action('phpmailer_init', 'mail_smtp');
function mail_smtp( $phpmailer ) {
    $phpmailer->FromName = '***'; // 发件人昵称
    $phpmailer->Host = '***'; // 邮箱SMTP服务器
    $phpmailer->Port = 465; // SMTP端口，不需要改
    $phpmailer->Username = '***@***'; // 邮箱账户
    $phpmailer->Password = '***'; // 此处填写邮箱生成的授权码，不是邮箱登录密码
    $phpmailer->From = '***@***'; // 邮箱账户同上
    $phpmailer->SMTPAuth = true;
    $phpmailer->SMTPSecure = 'ssl'; // 端口25时 留空，465时 ssl，不需要改
    $phpmailer->IsSMTP();
}
Code language: PHP (php)