不會寫程式也可以 - 使用 Elementor + ACF 來客製化網站

不會寫程式也可以 - 使用 Elementor + ACF 來客製化網站

80c9848f1aca614f619a9d974b852dc0?s=128

Yucheng Wang

July 19, 2020
Tweet

Transcript

  1. 不會寫程式也可以 使⽤用 Elementor + ACF 來來客製化網站 WordPress 台中⼩小聚 #22

  2. 王昱程 / Yu-Cheng Wang / Stanley
 https://ucheng.io
 Freelance WordPress Developer

    / 網站建置開發顧問 WordPress Meetup Taichung Co-organizer WordPress 台中⼩小聚 #22
  3. 你今天會學到什麼? 1.了解如何善用 WordPress 內容管理的彈性
 2.了解如何新增文章類型 (Post Type)
 3.了解如何使用 ACF 來自定欄位


    4.了解如何使用 Elementor 來顯示自訂內容 WordPress 台中⼩小聚 #22
  4. 我想要做⼀一個 網站/服務/應⽤用 WordPress 台中⼩小聚 #22

  5. None
  6. 網站 WordPress 台中⼩小聚 #22

  7. 應⽤用/服務/電⼦子商務 WordPress 台中⼩小聚 #22

  8. NO CODE #nocode WordPress 台中⼩小聚 #22

  9. WordPress Page Builder WordPress 台中⼩小聚 #22

  10. Why Elementor 1.視覺化的編輯器
 2.可針對不同裝置調整樣式 3.友善的操作介面 WordPress 台中⼩小聚 #22

  11. WordPress 台中⼩小聚 #22

  12. 我想替文章或頁面顯示額外的資訊 該怎麼做? WordPress 台中⼩小聚 #22

  13. 自定欄位 (Custom Field) WordPress 內建的自訂欄位:只能輸入純文字,功能陽春 WordPress 台中⼩小聚 #22

  14. 自定欄位 (Custom Field)

  15. 顯示自訂欄位 WordPress 台中⼩小聚 #22

  16. 顯示自訂欄位 不用寫程式的方式 Elementor(Pro) Dynamic Tag WordPress 台中⼩小聚 #22

  17. 如果我想做更更多的應⽤用呢? 書籍資料庫

  18. 如果我想做更更多的應⽤用呢? 食譜資料庫

  19. 如果我想做更更多的應⽤用呢? 電影資料庫

  20. CMS Content Management System WordPress 台中⼩小聚 #22

  21. Post Type ⽂文章/內容類型 內建的 Post Type: •⽂文章 ( post )

    •⾴頁⾯面 ( page ) •媒體 ( attachment ) •版本修訂 ( revision ) •選單項⽬目 (nav_menu_item) https://developer.wordpress.org/themes/basics/post-types/ WordPress 台中⼩小聚 #22
  22. 透過程式⾃自⾏行行新增 function book_setup_post_type() { $args = array( 'public' => true,

    'label' => __( 'Books', 'textdomain' ), 'menu_icon' => 'dashicons-book', ); register_post_type( 'book', $args ); } add_action( 'init', 'book_setup_post_type' ); https://developer.wordpress.org/reference/functions/register_post_type/ WordPress 台中⼩小聚 #22
  23. 使⽤用外掛 CPT UI WordPress 台中⼩小聚 #22

  24. Advanced Custom Field (ACF) WordPress 台中⼩小聚 #22

  25. Advanced Custom Field (ACF)

  26. 想了了解更更多關於 ACF 的使⽤用⽅方式 https://wp-meetups.com/%e4%bd%bf%e7%94%a8-advanced-custom-field-%e9%80%b2%e8%a1%8c%e7%b6%b2%e7%ab%99%e5%ae%a2%e8%a3%bd%e5%8c%96/ https://wp-meetups.com/%e4%bd%bf%e7%94%a8-acf-pro-%e6%89%93%e9%80%a0%e8%87%aa%e5%b7%b1%e7%9a%84-gutenberg-block/

  27. Recap 1. WordPress 是一套內容管理軟體 (CMS) 2. 使用 CPT UI 來新增自訂

    Post Type 3. 使用 ACF 來新增欄位 4. 使用 Elementor Pro 來自訂版面並顯示 ACF 內容 WordPress 台中⼩小聚 #22
  28. NO CODE 開始打造一些有趣的東西吧! WordPress 台中⼩小聚 #22