?目前，這個(gè)首頁(yè)的內(nèi)容還是死的，是一個(gè)靜態(tài)的文件，wordpress后臺(tái)發(fā)表新的文章，這里也不會(huì)發(fā)生變化。我們需要實(shí)現(xiàn)的是：在我們發(fā)表文章后，這里就要發(fā)生相應(yīng)的變化——我們新發(fā)表的文章會(huì)展示在這個(gè)列表中。還有，我們要實(shí)現(xiàn)點(diǎn)擊分頁(yè)按鈕時(shí)，也能跳到對(duì)應(yīng)的頁(yè)面。下面，我們就來(lái)一步一步地操作。
第一步：左側(cè)刪除掉所有的文章列表，只保留一條。
原index.html靜態(tài)模板的左側(cè)列表中有5個(gè)文章，代碼如下圖：
可以看出，他們的代碼都是一樣的。這里，我們留下第一條< div class="list">，其余4條全部刪除掉。它的代碼如下：
< div class="left_bottom">< div class="list">< ul class="list_h">< a href="/">網(wǎng)站索引量一直在下降是什么原因</a>< /ul>< ul class="list_con">< ul class="list_con_left">< a href="/">< img src="./images/index_17.jpg" alt=""></a>< /ul>< ul class="list_con_right">< li>所謂網(wǎng)站索引量，就是指搜索引擎把你的網(wǎng)頁(yè)內(nèi)容索取到數(shù)據(jù)庫(kù)中。… </li>< li>< span class="dashicons-before dashicons-admin-users">木易</span>< span class="dashicons-before dashicons-calendar-alt">2020年5月21日</span>< span class="dashicons-before dashicons-visibility">274</span>< /li>< /ul>< /ul>< /div>< /div>
第二步：添加wordpress循環(huán)語(yǔ)句。
因?yàn)椋谑醉?yè)左側(cè)文章列表中，每一個(gè)模塊的布局是一樣的，只是每個(gè)模塊中的數(shù)據(jù)不一樣而已，所以，我們只需要保留一個(gè)模塊，然后，循環(huán)調(diào)用wordpress的文章數(shù)據(jù)添加到這個(gè)模塊中。這里，我們先調(diào)用wordpress循環(huán)語(yǔ)句，讓這個(gè)模塊循環(huán)輸出。wordpress網(wǎng)站有多少篇文章，它就會(huì)循環(huán)多少次，當(dāng)然，這個(gè)循環(huán)會(huì)受到分頁(yè)的限制，這個(gè)分頁(yè)我們?cè)诤竺嬖僬f(shuō)。
在< div class="left_bottom">這個(gè)標(biāo)簽前添加如下代碼：
<?php if ( have_posts() ): //如果有文章while ( have_posts() ) : //就循環(huán)所有文章the_post(); //循環(huán)一次，就調(diào)用一次數(shù)據(jù)?>
在< div class="left_bottom">的結(jié)束標(biāo)簽</div>后面，添加結(jié)束循環(huán)和結(jié)束如果的語(yǔ)句，代碼如下：
<?php endwhile; endif; ?>
一定要結(jié)束循環(huán)，也要結(jié)束如果，否則會(huì)報(bào)錯(cuò)。
第三步：給循環(huán)體里的模塊添加數(shù)據(jù)。
循環(huán)體里包含的是< div class="list">這個(gè)標(biāo)簽，我們需要把每次循環(huán)獲取到的數(shù)據(jù)，放到這個(gè)< div class="list">里的對(duì)應(yīng)的子孫標(biāo)簽里。代碼如下：
< div class="list">< ul class="list_h">< a href="< ?php the_permalink(); ?>">< ?php the_title(); ?></a>< /ul>< ul class="list_con">< ul class="list_con_left">< a href="< ?php the_permalink(); ?>"> < ?php if(has_post_thumbnail()) { //如果有特色圖片，就調(diào)用特色圖片the_post_thumbnail( 'thumbnail' ,array( 'alt'=> trim(strip_tags( $post->post_title )), 'title'=> trim(strip_tags( $post->post_title )),'class'=> 'home-thumb')); }else { //否則調(diào)用文章第一張圖片echo '< img src="'.catch_first_image().'" alt="'.$post->post_title.'" width="150" height="150" />';}?>< /a>< /ul>< ul class="list_con_right">< li>< ?php echo mb_substr(strip_tags($post->post_content),0,120,'utf-8'); ?> ... < /li>< li>< span class="dashicons-before dashicons-admin-users">< ?php the_author(); ?>< /span>< span class="dashicons-before dashicons-calendar-alt">< ?php the_time("Y年m月d日"); ?> < /span>< span class="dashicons-before dashicons-visibility">< ?php echo get_post_meta($post->ID, 'views', true); ?> < /span>< /li>< /ul>< /ul>< /div>
代碼解釋：
the_permalink()=> 文章鏈接the_title()=> 文章標(biāo)題the_post_thumbnail()=> 文章特色圖片the_author()=> 文章作者the_time()=> 文章發(fā)表的時(shí)間get_post_meta()=> 獲取文章自定義字段$post->post_title=> 文章標(biāo)題$post->post_content=> 文章內(nèi)容
上面這些函數(shù)與變量，都是wordpress自帶的，我們只需直接拿來(lái)用就可以了。
當(dāng)然，上面的代碼中，我們也用到一些PHP語(yǔ)言的原生函數(shù)，如：trim()去除空白函數(shù)、strip_tags()去除html標(biāo)簽函數(shù)、mb_substr()截取中文字符串函數(shù)。
另外，上面的代碼中，我們還調(diào)用了一個(gè)在trans主題的functions.php文件中創(chuàng)建的一個(gè)函數(shù)——catch_first_image()，這個(gè)函數(shù)的功能是獲取文章的第一張圖片。因?yàn)?，有時(shí)候，我們的文章可能沒有添加特色圖片，這時(shí)，我們可以調(diào)用文章第一張圖片來(lái)作為文章的縮略圖。這個(gè)函數(shù)的代碼如下：
// 獲取文章第一張圖片function catch_first_image() {global $post, $posts;$first_img='';ob_start(); ob_end_clean();$output=preg_match_all('/<img.+src=[\'"]([^\'"]+)[\'"].*>/i', $post->post_content, $matches);$first_img=$matches [1] [0];if(empty($first_img)){$random=mt_rand(1, 10);$first_img=get_bloginfo("template_url").'/images/random/'.$random.'.jpg'; //默認(rèn)多張圖片，隨機(jī)顯示//$first_img="/images/default.jpg"; //默認(rèn)圖片}return $first_img;};
好了，到這里，我們就完成了wordpress主題trans首頁(yè)左側(cè)文章列表的循環(huán)調(diào)用數(shù)據(jù)，這樣，trans主題的首頁(yè)左側(cè)就不會(huì)再是死代碼了，而是動(dòng)起來(lái)的代碼，只要wordpress網(wǎng)站的后臺(tái)文章有變化，這里就會(huì)相應(yīng)的變化，這也就是wordpress動(dòng)態(tài)模板的魔性所在。嗯，分頁(yè)部分，我們將在下一節(jié)介紹。
在加入官方交流群還可以結(jié)識(shí)更多小伙伴，趕快輸群號(hào)：260234942，加入97973的大家庭吧。
各位小伙伴們，已經(jīng)看到有人在論壇中分享了《我叫MT開荒團(tuán)》的時(shí)裝圖了，還有人找GM要高清圖?你們要的高清圖來(lái)了!!!
死侍——有沒有看出來(lái)是哀木涕呢!（智障寫成忍者...）
蝙蝠俠同款，你猜猜是哪個(gè)主角呢?
當(dāng)方磚遇到洛基——洛基方磚
怎么樣?是不是很給力啊!《我叫MT開荒團(tuán)》除了以上三款主題的服裝外還有更多有趣好玩的服裝哦，只要你有自己喜歡的影視角色、動(dòng)漫角色、游戲角色都可以反饋給我們哦，經(jīng)過(guò)投票，我們會(huì)讓研發(fā)大大們制作更多大家喜歡的人氣服裝的。
順便說(shuō)一句：游戲是有皮膚系統(tǒng)的哦~
以上就是本期小編帶給大家的全部?jī)?nèi)容，希望對(duì)大家有所幫助，更多精彩攻略，請(qǐng)繼續(xù)關(guān)注97973手游網(wǎng)，期待你的到來(lái)，我們下期再見。
想要第一時(shí)間知道有關(guān)《我叫MT開荒團(tuán)》手游的相關(guān)信息嗎，想要參加第一手的游戲活動(dòng)嗎，趕緊在APP Store里搜索下載“開荒團(tuán)攻略”，我叫MT開荒團(tuán)專版攻略APP，歡迎你的加入！
掃描二維碼下載開荒團(tuán)攻略
97973手游網(wǎng)聲明：97973手游網(wǎng)登載此文出于傳遞更多信息之目的，并不意味著贊同其觀點(diǎn)或證實(shí)其描述。
軟表示，這些主題可以 "創(chuàng)造美麗和沉浸式的視覺體驗(yàn)"。你可以將不同的主題應(yīng)用到每個(gè)配置文件中，以便與工作，家庭或家庭分開。該公司指出，它將很快在Edge附加組件商店中添加更多主題。截至發(fā)稿，除了《神奇女俠1984》主題外，商店還包含了《光環(huán)》、《微軟飛行模擬器》、《Forza Horizon 4》、《Gears 5》、《盜賊之海》、《Ori》、《Will of the Wisps》等主題。
微軟表示，這些主題可以 "創(chuàng)造美麗和沉浸式的視覺體驗(yàn)"。該公司指出，它將很快在Edge附加組件商店中添加更多主題。
以下是主題列表和下載地址：
Halo
Wandering Fields
The Mist -Sea of Thieves theme
Satin Stacks
Wonder Woman 1984 Theme
Microsoft Flight Simulator – Ocean Flight
Halo – Alpha Halo
Fortune Island – Forza Horizon 4 theme
The Forest -Ori and Will of the Wisps theme
Grounded -Ground War
Halo- Ghosts of Reach
The Megalodon
Gears x Luke Preece -Gears 5 theme
Microsoft Flight Simulator – Mt. Fuji
Swallow’s Nest -Ori and Will of the Wisps theme
Verdant Views
Microsoft Flight Simulator – Twilight Vista
Steampunk Omen – Gears Tactics theme
Spirit Willow -Ori and Will of the Wisps theme
Howl –
Winter Horizon
Ships of Fortune
Halo – Arrival
Gold Hoarder
下載地址：
https://microsoftedge.microsoft.com/addons/microsoft-edge-themes
從Edge附加組件商店安裝主題：
啟動(dòng)Edge瀏覽器
附加組件 - 主題
瀏覽所有主題，找到滿意的后點(diǎn)擊 "獲取 "按鈕。
進(jìn)一步，點(diǎn)擊 "添加主題"按鈕，在Edge瀏覽器中安裝主題。
隨后標(biāo)簽欄和工具欄的外觀將切換到主題定義的設(shè)計(jì)，新標(biāo)簽頁(yè)墻紙將被替換為剛才安裝的自定義主題。
要卸載一個(gè)Edge主題：
訪問設(shè)置 > 外觀
點(diǎn)擊 "自定義主題"下的刪除按鈕。