也想出現在這里?聯系我們

WordPress Theme wp_customize 的使用

  • 文章介紹
  • 升級版本
  • 評價&建議

在制作 Crazy uncle 的wordpress主題的時候,不想加入復雜的設置選項。。。因為這個wordpress主題實在是太過簡單了。。。于是就從wordpress的外觀自定義來著手了!需要學習的是wp_customize的使用,下面就直接貼代碼吧,方便以后使用!

  1. //自定義logo
  2. function?puma_customize_register(?$wp_customize?)?{
  3. ????$wp_customize->add_section('header_logo',array(
  4. ????????'title'?????=>?'博主頭像',
  5. ????????'priority'??=>?50
  6. ????)?);
  7. ????$wp_customize->add_setting(?'header_logo_image',?array(
  8. ????????'default'???=>?'',
  9. ????????"transport"?=>?"postMessage",
  10. ????????'type'??????=>?'option'
  11. ????)?);
  12. ????$wp_customize->add_control(?new?WP_Customize_Image_Control(?$wp_customize,?'header_logo_image',?array(
  13. ?????????'label'?????=>?'博主頭像',
  14. ?????????'section'???=>?'header_logo'
  15. ????)?)?);
  16. }
  17. add_action(?'customize_register',?'puma_customize_register'?);
  18. //自定義博主描述
  19. function?ms_customize_register(?$wp_customize?)?{
  20. ????$wp_customize->add_section('header_bzms',array(
  21. ????????'title'?????=>?'博主描述',
  22. ????????'priority'??=>?50
  23. ????)?);
  24. ????$wp_customize->add_setting(?'header_bzms',?array(
  25. ????????'default'???=>?'',
  26. ????????"transport"?=>?"postMessage",
  27. ????????'type'??????=>?'option'
  28. ????)?);
  29. ????$wp_customize->add_control(?new?WP_Customize_Control(?$wp_customize,?'header_bzms',?array(
  30. ?????????'label'?????=>?'逼格首頁的描述文字',
  31. ?????????'section'???=>?'header_bzms'
  32. ????)?)?);
  33. }
  34. add_action(?'customize_register',?'ms_customize_register'?);
  35. //自定義地址
  36. function?dz_customize_register(?$wp_customize?)?{
  37. ????$wp_customize->add_section('header_dzzb',array(
  38. ????????'title'?????=>?'地址坐標',
  39. ????????'priority'??=>?50
  40. ????)?);
  41. ????$wp_customize->add_setting(?'header_dzzb',?array(
  42. ????????'default'???=>?'',
  43. ????????"transport"?=>?"postMessage",
  44. ????????'type'??????=>?'option'
  45. ????)?);
  46. ????$wp_customize->add_control(?new?WP_Customize_Control(?$wp_customize,?'header_dzzb',?array(
  47. ?????????'label'?????=>?'逼格首頁的地址坐標',
  48. ?????????'section'???=>?'header_dzzb'
  49. ????)?)?);
  50. }
  51. add_action(?'customize_register',?'dz_customize_register'?);

調用就簡單了,直接

  1. <?php?echo?get_option('header_bzms');??>

下面對wp_customize做個延伸科普:

WordPress默認的Section

  • title_tagline – Site Title & Tagline (網站標題和描述)
  • colors – Colors(顏色)
  • header_image – Header Image (頂部圖片)
  • background_image – Background Image (背景圖片)
  • nav – Navigation (導航菜單)
  • static_front_page – Static Front Page (靜態首頁)

Controller Class

  • WP_Customize_Control() – 創建一個允許用戶輸入純文本的控制器,也是下面要介紹的class的parent class
  • WP_Customize_Color_Control() – 創建一個允許用戶從色輪中選擇顏色的顏色選擇器
  • WP_Customize_Upload_Control() – 創建允許用戶上傳媒體文件的控制器
  • WP_Customize_Image_Control() – 創建上傳圖片或從媒體庫中選擇圖片的控制器
  • WP_Customize_Background_Image_Control() – 創建背景圖片選擇器
  • WP_Customize_Header_Image_Control() – 創建頂部背景圖片選擇器
有用4
  • 2017.02.17初次和大家見面了!

已擁有1人對該主題的建議

  1. 0樓
    不科學:

    add_setting里添加 ‘type’ => ‘option’ 這種寫法并不科學。這樣的寫法會在數據庫里直接插入很多字段,而非儲存在主題的獨有分表下方,長期下去數據庫里亂七八糟的字段一大堆 還是要多看看官方介紹的用法

    2017-07-29 上午 2:38 [回復]

發表評論

還能輸入240個字

Hi, 歡迎加入Wordpress技術交流群,帶你裝逼帶你飛!

我要入群
也想出現在這里?聯系我們
wordpress加速

我來推薦一個更牛逼的給你看看?

  • 猛戳我吧
夫妇野外交换HD高清版,免费A片在线观看,亚洲精品国产自在现线,中国老妇人60OLDMANTV