ก่อนอื่นก็ enqueue style(โหลด css) ที่เราจะใช้ในธีมหลักที่ไฟล์ functions.php ก่อนเลยครับ ปกติผมชอบโหลดหลังจากสคริปหลักๆพวก Bootstrap และไฟล์ style.css ของธีมหลัก หรือเราจะใช้ style.css ของธีมหลักเลยก็ได้ ถ้าเราเลือกจะใช้ไฟล์หลักของธีม แต่ส่วนตัวผมชอบแยกเป็นอีกไฟล์นึงต่างหาก
wp_enqueue_style( 'custom-style', get_template_directory_uri() . '/assets/css/custom-style.css' );
หลังจากนั้นก็ติดตั้ง Sass ด้วยคำสั่งด้านล่างนี้ครับ แต่ก่อนอื่นในเครื่องต้องลง node js ก่อนนะ
npm install -g sass
แค่นี้เราก็ได้ตัว compile Sass มาไว้ในเครื่องแล้วครับ จากนั้นก็ใช้ Command prompt(ผมใช้ Windows) หรือ Linux ก็น่าจะเป็น Terminal cd เข้าไปในโฟลเดอร์ที่เก็บไฟล์ css ไว้ ซึ่งในกรณีของผมผมเก็บไว้ที่ assets ใน โฟลเดอร์ assets ผมจะมีไฟล์ custom-style.scss อยู่
หลังจากนั้นก็สั่งให้มัน compile ไฟล์ .scss เป็น .css อัตโนมัตด้วยคำสั่งด้านล่างนี้ครับ
sass --watch sass/custom-style.scss:css/custom-style.css
แล้วก็ลงมือเขียนโค้ดในไฟล์ .scss ได้เลยครับ มันก็จะ compile อัตโนมัตทุกครั้งที่เราพิมพ์ๆไปแล้วกด save เลย ซึ่งปกติผมกด Ctrl+s นั่นแหละครับ
Hi, this is a comment.
To get started with moderating, editing, and deleting comments, please visit the Comments screen in the dashboard.
Commenter avatars come from Gravatar.