1. 程式人生 > >楊澤業:wordpress博客開發技巧之添加快遞查詢功能

楊澤業:wordpress博客開發技巧之添加快遞查詢功能

width part 是否 講解 lin port 位置 ESS number

前幾天,我說到了給你的博客添加《漢字轉拼音》和《二維碼在線生成》的功能,這兩個功能都是額外增加的,而且是可以增加在任何的網站裏面,今天講的是wordpress博客功能開發,是在wordpress博客模版的基礎上添加新功能,調用博客主題的頁眉和頁腳,側邊欄等。

今天我們就以增加快遞查詢的功能為例,講解知更鳥主題,新建一個獨立頁面應用的方法,並列出詳細的步驟,方便小白用戶實踐操作:

1、下載自己主題裏面的默認文章頁面,比如我的是page.php,位置在/wp-content/themes/begin目錄裏面,查看文件全部代碼為:

  1. <?php get_header(); ?>

  2. <div id="primary"

    class="content-area">

  3. <main id="main" class="site-main" role="main">

  4. <?php while ( have_posts() ) : the_post(); ?>

  5. <?php get_template_part( 'template/content', 'page' ); ?>

  6. <?php if ( comments_open() || get_comments_number() ) : ?>

  7. <?php comments_template( '', true ); ?>

  8. <?php endif; ?>

  9. <?php endwhile; ?>

  10. </main><!-- .site-main -->

  11. </div><!-- .content-area -->

  12. <?php get_sidebar(); ?>

  13. <?php get_footer(); ?>

2、我們在第一行的最前面添加一個頁面模板名稱為快遞查詢的代碼標識。

  1. <?php

  2. /*

  3. Template Name: 快遞查詢

  4. */

  5. ?>

3、刪除默認文章頁面的<?php get_template_part( 'template/content', 'page' ); ?>這個頁面內容代碼。

4、到快遞100網站,獲取調用代碼,代碼為:

  1. <iframe name="kuaidi100" src="https://www.kuaidi100.com/frame/730px.html" width="750" height="900" marginwidth="0" marginheight="0" hspace="0" vspace="0" frameborder="0" scrolling="no"></iframe>

5、把這個頁面,另存為kuadi.php,保存格式為UFT-8。

6、把這個頁面上傳到上傳到博客主題系列單頁面模板列表,比如我的是放在wp-content/themes/begin/pages文件夾裏面。

7、後臺--頁面--新建頁面--填寫標題和固定網址,選擇模板頁面為快遞查詢的模板,點擊發布。(我已經發布過了,所以截圖中是更新)

技術分享圖片

新建快遞查詢頁面

發布成功以後,電腦和手機都瀏覽一下這個頁面看看是否正常,我這裏查看一切是正常的,

體驗地址:、技術分享圖片

快遞查詢頁面效果

小夥伴們,你學會了開發wordpress新功能頁面了嗎?敢快去試試吧!


本文由楊澤業原創發布於51cto博客

楊澤業:wordpress博客開發技巧之添加快遞查詢功能