Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.
รู้จักกับเวิร์ดเพรส และ ซี้ด ธีมส์
เม่น: จักรกฤษณ์ ตาฬวัฒน์
&
สร้างเว็บไซต์?
Content Management System: CMS
ระบบผู้ใช้งาน เนื้อหา การนําเสนอ ฟีเจอร์อื่นๆ
CMS ที่ใช้ในไทย
26%
4%
21%
49%
WordPress
Joomla!
Drupal
อื่นๆ
http://trends.builtwith.com/cms/country/Thailand
ทําเว็บ = ทําธีม
ระบบผู้ใช้งาน เนื้อหา
การนําเสนอ
ฟีเจอร์อื่นๆ
Theme
Theme
‣ เป็นตลาด/ดังสุด/หลากหลายสุด
‣ เน้นถูก/สวย/เยอะ
‣ ธีมส่วนใหญ่โหลดช้า/ใช้ยาก
‣ มี Divi Page Builder ชูโรง
‣ สวยเรียบ...
Theme
‣ สร้าง Framework เอง เจ๋งมาก
‣ เลยต้องเรียนรู้ใหม่หมด T T
‣ สวยเรียบ/ประสิทธิภาพดี
‣ เป็นแค่โครง สร้างโดยทีมงานเวิร...
อยากเป็นอย่างเค้าบ้าง
สวย/หลากหลาย
มี Page Builder ที่ใช้งานง่าย
สามารถสร้าง Child Theme ได้
ประสิทธิภาพดี ตามมาตรฐานเวิร์...
ผู้ใช้เวิร์ดเพรส นักพัฒนาธีม&
WordPress User Theme Developer
แก้ไขข้อความ จัดหน้า ผ่าน Page Builder
ผู้ใช้เวิร์ดเพรส
ธีม: Seed + Page Builder
Post Loop Widget
‣ Content List/Card + Excerpt
‣ Product List/Card + Excerpt
นักพัฒนาธีม
นักพัฒนาธีม
footer.php
header.php
sidebar.php
The Loop
นักพัฒนาธีม
footer.php
header.php
sidebar.php
The Loop
นักพัฒนาธีม
footer.php
header.php
sidebar.php
archive.php
search.php
category.php
single.php
page.php
front-page.php
https://developer.wordpress.org/themes/basics/template-hierarchy/
Template Hierarchy
ธีม: Seed ‣ ตามมาตรฐานเวิร์ดเพรส รองรับ Template Hierarchy
ธีม: Seed
‣ แยก CSS ให้จัดการง่าย
‣ เพราะสุดท้ายปลั๊กอิน Caching จะรวมไฟล์ให้อยู่ดี
‣ มีให้เลือกแสดงเนื้อหาได้หลายแบบ
‣ เช...
เพิ่มลด CSS/JS ใน functions.php
Bootstrap CSS
Bootstrap JS
ธีม: Berry
‣ ไฟล์ CSS และ JS เป็นไฟล์เปล่าๆ ไว้สําหรับแก้โค้ดตามต้องการ
‣ ไฟล์ functions.php ไว้ประกาศค่า/เพิ่มโค้ดอื่นๆ
‣...
ธีม Seed
ผู้ใช้เวิร์ดเพรส
นักพัฒนาธีม
‣ ใช้เป็นธีมเอนกประสงค์
‣ ใช้ร่วมกับ Page Builder ได้ดี
‣ Starter Theme แก้เลย ไม่ต้...
รับโหลด? แคช? ทําไฟล์ให้เล็ก?
Desktop Cache
Mobile Cache
Browser Caching
GZIP
Image Optimization
ใช้ปลั๊กอินง่ายสุด!
Minif...
Caching Plugin
WP Fastest CacheW3 Total Cache WP-Rocket
ตัวฟรีที่เจ๋งสุด
ตั้งค่าได้เยอะมาก
ใช้ยาก
ตัวฟรีที่เจ๋งพอควร
ตั้งค...
ลดขนาดรูป
imagifyEWWW Image Optimizer
ฟรีไม่จํากัด
ไม่หรูหราเท่า Imagify
ฟรีเดือนละ 25 MB
มากกว่านั้นเสียตังค์
หรือใช้โปรแ...
SeedThemes.com
เม่น: จักรกฤษณ์ ตาฬวัฒน์
&
ข้อมูลเพิ่มเติมที่
รู้จักกับ WordPress และ SeedThemes
รู้จักกับ WordPress และ SeedThemes
รู้จักกับ WordPress และ SeedThemes
รู้จักกับ WordPress และ SeedThemes
รู้จักกับ WordPress และ SeedThemes
รู้จักกับ WordPress และ SeedThemes
Upcoming SlideShare
Loading in …5
×

รู้จักกับ WordPress และ SeedThemes

1,708 views

Published on

นำเสนอในงานอบรมของ DomeCloud
https://register.dome.press/

Published in: Technology
  • ขอบคุณครับ จะคอยติดตามและคอยเรียนรู้ความรู้จาก Seedthemes เสมอครับ
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here

รู้จักกับ WordPress และ SeedThemes

  1. 1. รู้จักกับเวิร์ดเพรส และ ซี้ด ธีมส์ เม่น: จักรกฤษณ์ ตาฬวัฒน์ &
  2. 2. สร้างเว็บไซต์? Content Management System: CMS ระบบผู้ใช้งาน เนื้อหา การนําเสนอ ฟีเจอร์อื่นๆ
  3. 3. CMS ที่ใช้ในไทย 26% 4% 21% 49% WordPress Joomla! Drupal อื่นๆ http://trends.builtwith.com/cms/country/Thailand
  4. 4. ทําเว็บ = ทําธีม ระบบผู้ใช้งาน เนื้อหา การนําเสนอ ฟีเจอร์อื่นๆ Theme
  5. 5. Theme ‣ เป็นตลาด/ดังสุด/หลากหลายสุด ‣ เน้นถูก/สวย/เยอะ ‣ ธีมส่วนใหญ่โหลดช้า/ใช้ยาก ‣ มี Divi Page Builder ชูโรง ‣ สวยเรียบ/ประสิทธิภาพดี ‣ ธีมไม่เยอะนัก
  6. 6. Theme ‣ สร้าง Framework เอง เจ๋งมาก ‣ เลยต้องเรียนรู้ใหม่หมด T T ‣ สวยเรียบ/ประสิทธิภาพดี ‣ เป็นแค่โครง สร้างโดยทีมงานเวิร์ดเพรส ‣ ไม่สวย แต่ประสิทธิภาพดีที่สุด ‣ มาตรฐานสุด รองรับทุกฟีเจอร์
  7. 7. อยากเป็นอย่างเค้าบ้าง สวย/หลากหลาย มี Page Builder ที่ใช้งานง่าย สามารถสร้าง Child Theme ได้ ประสิทธิภาพดี ตามมาตรฐานเวิร์ดเพรสทุกอย่าง + รองรับภาษาไทยได้ดี
  8. 8. ผู้ใช้เวิร์ดเพรส นักพัฒนาธีม& WordPress User Theme Developer
  9. 9. แก้ไขข้อความ จัดหน้า ผ่าน Page Builder ผู้ใช้เวิร์ดเพรส
  10. 10. ธีม: Seed + Page Builder
  11. 11. Post Loop Widget ‣ Content List/Card + Excerpt ‣ Product List/Card + Excerpt
  12. 12. นักพัฒนาธีม
  13. 13. นักพัฒนาธีม footer.php header.php sidebar.php The Loop
  14. 14. นักพัฒนาธีม footer.php header.php sidebar.php The Loop
  15. 15. นักพัฒนาธีม footer.php header.php sidebar.php archive.php search.php category.php single.php page.php front-page.php
  16. 16. https://developer.wordpress.org/themes/basics/template-hierarchy/ Template Hierarchy
  17. 17. ธีม: Seed ‣ ตามมาตรฐานเวิร์ดเพรส รองรับ Template Hierarchy
  18. 18. ธีม: Seed ‣ แยก CSS ให้จัดการง่าย ‣ เพราะสุดท้ายปลั๊กอิน Caching จะรวมไฟล์ให้อยู่ดี ‣ มีให้เลือกแสดงเนื้อหาได้หลายแบบ ‣ เช่น Card / List ทั้งส่วนเนื้อหาและสินค้า ‣ มี Bootstrap มาให้ (เลือกปิดได้) ‣ โค้ดจากแหล่งอื่น สามารถอัพเดทได้อิสระ
  19. 19. เพิ่มลด CSS/JS ใน functions.php Bootstrap CSS Bootstrap JS
  20. 20. ธีม: Berry ‣ ไฟล์ CSS และ JS เป็นไฟล์เปล่าๆ ไว้สําหรับแก้โค้ดตามต้องการ ‣ ไฟล์ functions.php ไว้ประกาศค่า/เพิ่มโค้ดอื่นๆ ‣ ธีมลูก (Child Theme) ของ Seed CSS JS
  21. 21. ธีม Seed ผู้ใช้เวิร์ดเพรส นักพัฒนาธีม ‣ ใช้เป็นธีมเอนกประสงค์ ‣ ใช้ร่วมกับ Page Builder ได้ดี ‣ Starter Theme แก้เลย ไม่ต้อง update อีก ‣ Parent Theme สร้าง Berry ของตัวเอง อยู่ในมาตรฐาน WordPress & มีประสิทธิภาพดี
  22. 22. รับโหลด? แคช? ทําไฟล์ให้เล็ก? Desktop Cache Mobile Cache Browser Caching GZIP Image Optimization ใช้ปลั๊กอินง่ายสุด! Minify HTML Minify CSS Combine CSS Combine JS
  23. 23. Caching Plugin WP Fastest CacheW3 Total Cache WP-Rocket ตัวฟรีที่เจ๋งสุด ตั้งค่าได้เยอะมาก ใช้ยาก ตัวฟรีที่เจ๋งพอควร ตั้งค่าได้ไม่เยอะมาก ใช้ง่ายมาก ตัวเสียตังค์ที่ (น่าจะ) เจ๋งสุด ตั้งค่าได้พอสมควร ใช้ร่วมกับ Cloudflare ได้ดี
  24. 24. ลดขนาดรูป imagifyEWWW Image Optimizer ฟรีไม่จํากัด ไม่หรูหราเท่า Imagify ฟรีเดือนละ 25 MB มากกว่านั้นเสียตังค์ หรือใช้โปรแกรมในเครื่อง เตรียมรูปให้ดีก่อน
  25. 25. SeedThemes.com เม่น: จักรกฤษณ์ ตาฬวัฒน์ & ข้อมูลเพิ่มเติมที่

×