wordpress美化 首页添加一言

首页上只有图片，显得太空了，所以想添加个什么，

最终找到了这个 链接

1.如何添加

我现在用的主题的 layouts/imgbox.php

pre class="wp-block-code"><code lang="markup" class="language-markup line-numbers"

这段话下面添上

<div style="z-index: 99999;background: -webkit-linear-gradient(left,rgba(63, 81, 181, 0.16),rgba(233, 30, 99, 0.16) 100%);border-radius: 25px;margin: 0% 5% 5% 5%;width: 90%;border: 10px solid rgba(14, 14, 14, 0.2);" id="site-branding">
<a href="#" rel="home" style="color: #f1f1f1;">
<h1 style="font-size: 35px; font-weight: 900;line-height: 50px;padding-right: 100px;padding-left: 100px;" id="myHeader" itemprop="name"> 
 <div id="hitokoto" class="hitokoto-fullpage animated fadeIn">
  <!-- <div class="bracket left">『</div>-->
<div class="word" id="hitokoto_text"></div>
 <!--  <div class="bracket right">』</div>-->
 <div class="author" id="hitokoto_author"></div>
 <!-- <p id='uuid'></p> -->
</div>
<script>
var xhr = new XMLHttpRequest();
xhr.open('get', 'https://v1.hitokoto.cn');
xhr.onreadystatechange = function () {
 if (xhr.readyState === 4) {
 var data = JSON.parse(xhr.responseText);
 var hitokoto = document.getElementById('hitokoto_text');
 var from = document.getElementById('hitokoto_author');
 //var from_who = document.getElementById('from_who');
 var uuid = document.getElementById('uuid');
  hitokoto.innerText = data.hitokoto;
 var author = !!data.from ? data.from : "无名氏"
  // $('#hitokoto_author').text("—— " + (data.from_who || '') + "「" + author + "」");
 from.innerText ='——'+ (data.from_who || '') + '「' + author + '」' ;
 //from_who.innerText = data.from_who;
 // uuid.innerHtml = '<a id=\'uuid\' href=https://hitokoto.cn?uuid='+data.uuid+' target="_blank">点击查看详细信息</a>';
	 }
}
 xhr.send();
</script>
</h1> 
</a>
</div>

2.当前的主题的style.css 文件中添加

/*首页文本 */ 
.home #site-branding {
position: absolute; 
top: 50%; 
transform: translateY(-50%); 
left: 0; 
right: 0; 
margin: auto; 
border-radius: 8px; 
width: 100%; 
font-size: 1.5vmax; 
display: block; 
} 
#site-branding { 
display: block; 
padding: 100px 0; 
line-height: 1; 
text-align: center; 
position: absolute; 
top: 50%; 
transform: translateY(-50%); 
left: 0; 
right: 0; 
margin: auto; 
border-radius: 8px; 
width: 100%; 
font-size: 1.5vmax; 
}

参考 https://cangshui.net/ 首页的代码

最后这个功能用来实现显示古诗词了

live2D显示的是古诗词