方法是 F12 Mashiro大佬博客的，和大佬博客展示的一毛一样。=￣ω￣=
公开的主题Sakura和Mashiro主站有一些差别，只能自己动手，丰衣足食咯。

开工

1. WP后台-Sakura主题设置-CDN-开启本地调用主题 js、css 文件
2. 找到主题根目录的 style.css 文件，在底部添加如下CSS代码

   /*诗*/
   .poem-wrap {
       position: relative;
       width: 730px;
       max-width: 80%;
       border: 2px solid #797979;
       border-top: none;
       text-align: center;
       margin: 80px auto;
   }
   
   .poem-wrap h1 {
       position: relative;
       margin-top: -20px;
       display: inline-block;
       letter-spacing: 4px;
       color: #797979
   }
   
   .poem-wrap p {
       width: 70%;
       margin: auto;
       line-height: 30px;
       color: #797979;
   }
   
   .poem-wrap p#poem {
       font-size: 25px;
   }
   
   .poem-wrap p#info {
       font-size: 15px;
       margin: 15px auto;
   }
   
   .poem-border {
       position: absolute;
       height: 2px;
       width: 27%;
       background-color: #797979;
   }
   
   .poem-right {
       right: 0;
   }
   
   .poem-left {
       left: 0;
   }
   
   @media (max-width: 685px) {
       .poem-border {
           width: 18%;
       }
   }
   
   @media (max-width: 500px) {
       .poem-wrap {
           margin-top: 60px;
           margin-bottom: 20px;
           border-top: 2px solid #797979;
       }
   
       .poem-wrap h1 {
           margin: 20px 6px;
       }
   
       .poem-border {
           display: none;
       }
   }
   

3. 修改Sakura主题目录下的 js/sakura-app.js 文件，找到大概第10行的位置

   mashiro_global.ini = new function () {
       this.normalize = function () { // initial functions when page first load (首次加载页面时的初始化函数)
           lazyload();
           social_share();
           post_list_show_animation();
           copy_code_block();
           //诗初加载
           if ($("div").hasClass("poem-wrap")) {
               get_poem('#poem', '#info')
           }
           coverVideoIni();
           checkskinSecter();
           scrollBar();
       }
       this.pjax = function () { // pjax reload functions (pjax 重载函数)
           pjaxInit();
           social_share();
           post_list_show_animation();
           copy_code_block();
           //诗重载
           if ($("div").hasClass("poem-wrap")) {
               get_poem('#poem', '#info')
           }
           coverVideoIni();
           checkskinSecter();
       }
   }
   

4. 然后在此文件底部增加如下代码

   /*诗*/
   function get_poem(poem_ele, info_ele) {
       var poem = document.querySelector(poem_ele);
       var info = document.querySelector(info_ele);
       var xhr = new XMLHttpRequest();
       xhr.open('get', 'https://v2.jinrishici.com/one.json');
       xhr.withCredentials = true;
       xhr.onreadystatechange = function() {
           if (xhr.readyState === 4) {
               var data = JSON.parse(xhr.responseText);
               poem.innerHTML = data.data.content;
               info.innerHTML = '【' + data.data.origin.dynasty + '】' + data.data.origin.author + '《' + data.data.origin.title + '》';
           }
       };
       xhr.send();
   }
   

5. 最后在WordPress中新建一个页面模版选 默认模版 ，内容中填入如下代码

<div class="poem-wrap">
    <div class="poem-border poem-left"></div>
    <div class="poem-border poem-right"></div>
    <h1>念两句诗</h1>
    <p id="poem">挑选中...</p>
    <p id="info">
</div>

展示

https://m1314.cn/leave/