ปัญหา qTranslate แสดงผลชื่อเดือนของไทยเพี้ยน

สำหรับวันเดือนปีในภาษาอังกฤษ ไม่มีผิดเพี้ยนอยู่แล้ว แต่พอกดเลือกเปลี่ยนภาษาเป็นภาษาไทย

อ้าว เวรแล้วไง ทำไมภาษามันเพี้ยนแบบนี้ นั่งงมอยู่พักใหญ่ แก้นั่นแก้นี่ จนหาทางออกได้ว่า ที่ qTranslate ในส่วนของ Advanced Settings

มองหาหัวข้อ Date / Time Conversion แล้วเลือกที่ Use emulated date function and replace formats with the predefined formats for each language.

แต่บางทีอาจจะได้ผลลัพธ์เป็นแบบนี้

อย่าเพิ่งตกใจ ให้ไปแก้ไขในส่วนของ Date Format และ Time Format ในของแต่ละภาษา ให้เป็นช่องว่าง

เราก็จะได้วันเดือนปีในแบบภาษาไทย ที่ไม่เพี้ยนเป็นภาษาอะไรก็ไม่รู้

แก้ปัญหาข้อมูลเพี้ยนจากการ query

ถ้าเขียน theme แล้วเกิดต้องเรียก query หลาย ๆ ครั้ง แบบทีอาจจะเกิดการผิดพลาดในการเรียกใช้ข้อมูล

ปัญหานี้ได้ลองถามพี่จ๋ง (@warong) ได้คำตอบมาว่า ให้ใส่

[php]
<?php $temp_query = clone $wp_query; ?>
[/php]

ก่อนหน้าที่เราจะ query ข้อมูล และใส่

[php]
<?php $wp_query = clone $temp_query; ?>
[/php]

หลังจากที่ใช้งานข้อมูลที่ query มาเสร็จแล้ว

วิธีแก้ไม่ให้ WordPress ใส่ tag p ให้เราอัตโนมัติ

วิธีแก้ไม่ให้ wordpress มันใส่ tag p ให้อัตโนมัติ ให้เพิ่ม

[php]
remove_filter( ‘the_content’, ‘wpautop’ );
remove_filter( ‘the_excerpt’, ‘wpautop’ );
[/php]

ใน function.php

WordPress 3.2 มีอะไรใหม่ ๆ กันบ้าง

เมื่อวันที่ 4 กรกฎาคมที่ผ่านมา WordPress.org ได้ปล่อย WordPress 3.2 ออกมา จากที่สังเกตมีอะไรหลายที่เปลี่ยนแปลงแบบเห็นทันทีอยู่


เปลี่ยน Design ของ Dashboard

New Dashboard

น่าจะเป็นอย่างแรกที่หลังจากอัพเดตแล้ว เราจะเห็นการเปลี่ยนแปลงชัดเจนที่สุด และที่สำคัญเมื่อเราอยู่ในหัวข้อใด จะมีแถบบอกให้เราทราบตำแหน่งชัดเจนกว่าเดิม


WordPress ลดสนับสนุนการใช้งานกับ IE6 PHP4 และ MySQL4 ลง

จำนวนคนใช้ IE6 ที่ลดลงก็ไม่แปลกใจที่ WordPress จะลดการสนับสนุน IE6 ลง และใครที่ยังใช้ PHP4 และ MySQL4 แต่การใช้งาน WordPress 3.2 ก็คงต้องเปลี่ยนมาใช้ PHP5 และ MySQL5


มี Full Screen Mode สำหรับตัว Editor

Full Screen Mode

ที่ตัว Editor จะมีปุ่มเพิ่มมา คือปุ่ม fullscreen ใช้เปลี่ยนตัว Editor มาเป็น Full Screen Mode และเมื่อเปลี่ยนมาเป็น Mode นี้แล้วประมาณ 2 วินาที ทุกอย่างจะจางหายไป เหลือเพียงข้อความที่เราพิมพ์ไว้ หากอยากให้มันกลับมา ให้เอา Mouse ไปวางไว้ข้างบน แถบต่าง ๆ จะกลับมาเหมือนเดิม


Admin Bar เปลี่ยนไป

จากที่ลองใช้งานดู Admin Bar ที่เปลี่ยนมาใหม่ใช้งานได้ดีกว่าตัวก่อน มีการแบ่งหัวข้อเมนูที่เข้าใจง่ายกว่าเดิม


Theme Default ตัวใหม่ : Twenty Eleven


รายละเอียดเพิ่มเติม

รายละเอียดเพิ่มเติมต่าง ๆ ก็ไปดูต่อได้ที่ wordpress.org

CSS : มารู้จัก Float กัน

float จะมี property 4 ตัว คือ

float

  • left ก็คือ สั่งให้ลอยชิดซ้าย
  • right คือ สั่งให้ลอยชิดขวา
  • inherit คือ ค่าที่สืบทอดมา
  • none คือ ไม่ต้องลอย [ซึ่งปรกติ element ทั่วไปจะเป็น none]

ลองมาดูตัวอย่างของคำสั่ง float แล้วกัน ว่ามันใช้งานแล้วได้ผลลัพธ์เป็นแบบไหน

ตัวอย่าง

จะเห็นว่า รูปของยูริ จะลอยอยู่ทางด้านขวาของหน้าเว็บตามที่เราสั่งไว้

ลองมาดูตัวอย่างต่อไปนะครับ ถ้าเรามี div สามตัว เหมือนใน ตัวอย่าง

ถ้าเราต้องการให้มันมาลอยชิดกัน เราก็ไปสั่งมันแบบนี้ [div ทั้งสามตัวมี class ชื่อ block นะครับ]

ซึ่งผลลัพธ์ที่ได้จะเป็นแบบนี้ ตัวอย่าง

div ทั้งสามตัวก็มาลอยเรียงติดกันอย่างสวยงาม

แล้วถ้า float มันใช้งานง่ายแบบนี้ มันจะมีปัญหาอะไรละ เราลองไปดูบ้าง ว่าปัญหาที่เจอมันจะเป็นแบบไหน

จาก code แล้ว เราจะต้องมีสี่เหลี่ยมให้เห็นทั้งหมดสี่อัน แต่ถ้าดูจาก ตัวอย่าง แล้ว

เราจะพบว่า มีสี่เหลี่ยมให้เราเห็นเพียงสามอันเท่านั้น เนื่องจาก item-1 และ item-2 ลอยชิดซ้ายกันอยู่ ส่วน item-3 นั้นอยู่ใต้ item-1 ที่ลอยอยู่ ทำให้เราไม่เห็น item-3

ดังนั้นจึงมีอีกคำสั่ง clear มาเพื่อแก้ปัญหานี้ โดย clear นั้นจะมี property 5 ตัว คือ

clear

  • left คือ ไม่ให้มีอะไรลอยอยู่ด้านซ้าย
  • right คือ ไม่ให้มีอะไรลอยอยู่ด้านขวา
  • both คือ ไม่ให้มีอะไรลอยอยู่ทั้งสองด้าน
  • none คือ อยากจะลอยก็ลอย ตูไม่ยุ่ง
  • inherit คือ ค่าที่สืบทอดมา

ดังนั้นเราลองมาเพิ่มคำสั่ง clear ไปให้ item-3 กันดีกว่า โดยเราจะใส่ดังนี้

เราจะได้ผลลัพธ์ดังนี้ ตัวอย่าง

ที่เราสั่ง clear:left; เพราะว่า เรามองว่ามี item-1 และ item-2 ลอยอยู่ด้านซ้ายของ item-3 เราจึงสั่งไม่ให้มีอะไรมาลอยอยู่ด้านซ้ายของ item-3

คราวนี้เรามาลองประยุกต์ใช้งานจริง โดยเราแบ่งเว็บออกเป็น 4 ส่วนดังนี้

  • header อยู่ด้านบน
  • content อยู่ตรงกลางด้านซ้าย
  • sidebar อยู่ตรงกลางด้านขวา
  • footer อยู่ด้านล่าง

เราก็จะได้เว็บตามที่เราวางโครงไว้ ตัวอย่าง

แต่ถ้าเกิดเราลืมใส่ clear:both; ให้ footer ละ จะเกิดอะไรขึ้น ตามไปดู ตัวอย่าง กันเลยครับ

จะเห็นว่าตัว footer จะไปอยู่ทางด้านขวาแทนที่จะอยู่ด้านล่างอย่างที่เราต้องการ โดยตัว content และ sidebar จะลอยบังส่วนของ footer ไว้ และเหลือให้เราเห็นในส่วนที่ content และ sidebar ไม่ได้บัง

เรามาลองดูอีกปัญหานึงที่น่าจะได้เคยพบเจอกัน ลองดูจาก ตัวอย่าง นะครับ

ถ้าเราดูจาก code แล้ว ต้องจะมีพื้นหลังสีดำให้เราเห็น แต่จากที่เราดูในตัวอย่าง จะไม่เห็นพื้นหลังสีดำเลย วิธีแก้ไขก็มีอยู่หลายวิธี แต่จะขอนำเสนออยู่สองแบบ คือ

  • ใช้ overflow:hidden
  • ใช้ clearfix

overflow:hidden

ให้เราใส่ overflow:hidden ใน #wrapper ตัวอย่าง

clearfix

ให้เราใส่ class=”clearfix” ใน div id=”wrapper” และเพิ่ม CSS ของ class=”clearfix” เข้าไป ตัวอย่าง