Variable หรือ ตัวแปร คือ ตัวแทนของข้อมูลที่เราจำเป็นต้องเรียกใช้งานภายในโปรแกรม หรือสคริปต์ การประกาศตัวแปร JavaScript จะมีการเขียนประกาศตัวแปรที่ง่าย ๆ โดยการพิมพ์คำว่า var นำหน้าชื่อตัวแปรที่ต้องการ เช่น var dw; เป็นต้น การประกาศตัวแปรเราสามารถประกาศชื่อพร้อมทั้งกำหนดค่าลงไปด้วยพร้อมกันเลยก็ได้

ใน JavaScript ก็มีรูปแบบของข้อมูลที่ใช้งานเหมือน ๆ กับภาษาโปรแกรมอื่น ๆ ทั่ว ๆ ไป คือ – Number คือ ข้อมูลชนิดตัวเลข ที่สามารถนำมาคำนวนได้ – String คือ ข้อมูลชนิดข้อความ – Logical คือ ข้อมูลทางตรรกะ มี 2 ค่า True (จริง) กับ False (เท็จ) มีค่าอย่างใดอย่างนึง – Null คือ

Statmment คือ ชุดคำสั่งที่เราสามารถสั่งงานให้โปรแกรมของเราทำการอย่างใดอย่างหนึ่ง เช่น สั่งให้โปรแกรมตรวจสอบเงื่อนไขตามที่กำหนด หรืออื่น ๆ ซึ่งชุดคำสั่งเหล่านี้เราจะสามารถแบ่งตามระบบการทำงานได้ 2 ประเภท คือ 1. ชุดคำสั่งในการตัดสินใจ 2. ชุดคำสั่งในการวนรอบ ในครั้งแรกนี้เรามาเริ่มเรียนรู้เรื่องของ

<< การวนรอบ >> 1. การวนรอบในรูปแบบ for การวนรอบในรูปแบบของ for นี้ จะเป็นการวนรอบที่เราต้องกำนดค่าเริ่งต้นในการวนรอบ เงื่อนไขในการตรวจสอบ หากเป็นจริงโปรแกรมจะทำการวนรอบต่อไป และกำนหนดการเปลี่ยนแปลงค่าของค่าเริ่มต้นเพื่อให้การวนรอบนี้มีการสิ้นสุดการวนรอบ

1. ตัวแปรที่เก็บค่าเดียว ตัวแปรประเภทนี้เราจะพบและใช้งานบ่อยที่สุดในการเขียนโปรแกรมหรือ Script ตัวแปรนี้จะสามารถเก็บค่าเฉพาะได้เพียง 1 ค่าเท่านั้น เช่น var one=1; เป็นต้น (ตัวแปร one เก็บค่าตัวเลข 1 ไว้) 2. ตัวแปรเก็บหลายค่า (Array) ตัวแปรประเภทนี้จะมีความสามารถในการเก็บข้อมูลที่ได้มากกว่าในตัวแปรที่ผ่านมา

เมื่อเราได้ทำการกำหนดค่าคุณสมบัติต่าง ๆ กับ CSS ที่เราต้องการแล้ว สำหรับวิธีการเรียกใช้ CSS กับ Obj ที่เราต้องการนั้น มีการเรียกใช้ได้หลากหลายรูปแบบที่เราต้องการ หากเป็น Dreamweaver MX2004 คุณสามารถเรียกใช้ได้จาก Properties Panel ได้เลยในทันที

เราสามารถสร้าง CSS ขึ้นมาใหม่ได้โดยไปที่หน้าต่าง CSS Styles จากนั้นให้ทำการกดไปที่ Icon ที่มีเครื่องหมายบวก (+) หรือเราเรียก icon นี้ว่า New CSS Style ดังจะเห็นได้จากภาพข้างต้น เมื่อทำการกดไปแล้ว โปรแกรมจะทำการเปิดหน้าต่างใหม่ขึ้นมาให้เราทำการตั้งชื่อหรือเลือก TAG ของ HTML มาใช้ในการกำหนดค่า

สำหรับโปรแกรม Dreamweaver เราสามารถเรียกใช้งานหน้าต่าง CSS Styles ได้จาก Main menu -> Window -> CSS Styles หรือหากเป้นเวอร์ชั่น MX2004 คุณสามารถเรียกใช้งานได้จาก Panel Group ทางขวามือของโปรแกรม (ตามค่าเริ่มต้นของโปรแกรม) หน้าตาของ CSS Styles Panel ก็จะได้ดังรูป  

จะใช้งาน Media Queries ได้อย่างไร การใช้งาน Media Queries เหมือนกับการใช้งาน CSS ทั่วไป แต่เนื่องจากปัจจุบันมี Device มากมายและมีคุณสมบัติแตกต่างกันออกไปอย่างที่เรารู้กัน จึงจะต้องมีข้อกำหนดต่างๆ ขึ้นมาเพื่อที่จะได้แสดงผล ถูกต้อง และเหมาะสมกับ

Element ของ HTML ที่มีค่าพื้นฐานนี้ก็เหมือนกันเกือบ หรือ ทุกๆ Elements ของ HTML สามารถสั่งงานด้วย Box model module ได้ อยู่ที่ว่าเราจะสั่งงานให้มันเป็นอะไรและมีความหมายในเชิง “Semantics” และการสื่อสารของข้อมูลในโลก WWW ยังไง ในเมื่อทุกอย่างต้องผ่านการตีความ

เมื่อได้ Font ฟรีมาแล้ว ย้ำ ฟ้อนท์ ฟรี (อย่าไปขโมยใครมาให้เขาจับได้ เดี๋ยวเสียหมา) เอาฟ้อนท์ที่ได้ ไปแปลงเพศก่อนTTF to EOT Font Converter เมื่อได้มาแล้ว ให้เพิ่มตัวหนังสือเข้าเว็บ แบบข้างล่างนี้ @font-face { font-family: PSPimpdeedIINew; src: url("PSPimpdeedIINew.eot"); /* EOT file for IE */ } @font-face

ในตัวอย่างนี้การเขียน CSS หลักๆ ประกอบไปด้วย CSS Transitions มี CSS 2D Transformations รวมไปถึง CSS Backgrounds and Borders แถมด้วย CSS Selectors นิดหน่อย ดู ตัวอย่างการทำแผนที่แบบง่ายๆ ด้วย CSS3 Transitions บทความที่เกี่ยวข้องกัน แนะนำให้อ่านก่อนเพื่อเพิ่มความเข้าใจ CSS3 Background nth-child()

เมื่อวันที่ 29 กันยายน 2554 ทาง W3C ได้ประกาศ Working Draft สำหรับ CSS4 ออกมาอีก 1 หมวด ซึ่งนั่นก็คือ CSS4 ที่เป็น Selectors นั่นเอง อะไรนะ CSS4 อีกแล้วเหรอเนี่ย!!! หลายคนคงอยากอุทานออกมาเป็นภาษามนุษย์ต่างดาว เพราะทุกวันนี้ CSS3 เรายังไม่ได้ใช้กันจนหมดทุกหมวดหมู่เลย

CSS3 มี Values and Units Module แยกย่อยออกมาเพื่อกำหนด “หน่วย” ของค่าต่างๆ มากมาย “หน่วย” ในที่นี้ก็เช่น px, em, %, cm, gr, fr, deg, rem, vh และอื่นๆ อีกมากมาย โดยที่ความเก๋าและเฉพาะทางของ CSS3 ที่ Module นี้แถมมาด้วยก็คือ การนำเอา “หน่วย” ที่ต่างๆ กันนั้นมา “ทำการคำนวณ”

หลังจากที่ผมเขียนเรื่อง “แนวทางการเรียนรู้ CSS3 และ HTML5 ให้เกิดประโยชน์สูงสุด” เอาไว้เมื่อ 2 ปีที่ผ่านมา (2010) ถึงตอนนี้ผมยังคิดว่าแม้กระทั่งผู้เขียนอย่างผมเองยังต้องตั้งคำถามกับตัวเอง ว่าเรานั้นไปตามเส้นทางแบบนั้นอย่างจริงจังหรือไม่ บทความที่ว่าก่อนหน้านั่นอาจจะดูคร่าวๆ

Timing Functions ของ CSS3 นั่นก็คือ Function ที่เอาไว้คอยกำหนดรูปแบบการ “เปลี่ยนผ่าน” จากจุดหนึ่งไปยังจุดหนึ่ง นั่นเอง ซึ่งมีทั้งหมด 9 แบบ สำหรับคนที่ยังไม่เคยผ่านตาเรื่อง CSS Transitions ให้กลับไปอ่านเรื่อง ทำความเข้าใจ CSS3 Transitions กันก่อนนะครับ

Layering Multiple Background Images นั้นเป็นความสามารถที่ถูกเพิ่มเข้ามาใน CSS3 โดยความสามารถนี้จะทำให้เว็บดีไซน์เนอร์ทำงานกับ Background ได้ยืดหยุ่นมากขึ้น สำหรับการใช้งานนั้นเพียงใช้เครื่องหมาย comma-separated(,) หรือเครื่องหมายจุลภาค คั่นระหว่างแต่ละ

บทนี้ผมจะนำเรื่อง Substring Maching Attribute Selectors แบบ Subfix เข้ามาใช้ในการกำหนดให้ Class อะไรก็ตามที่มีค่าลงท้ายเท่ากับ icon แสดงผลออกมาเป็นรูป icon ตามที่ต้องการ โดยใช้ background-position แยกตำแหน่งการแสดงผล ( ถ้าใครยังไม่เข้าใจเรื่องนี้ให้กลับไปดูวิดีโอสอน

CSS มีกฎการลำดับความสำคัญของการใช้ Selectors ควบคุมอยู่ ความสำคัญมาก สำคัญน้อย ขึ้นอยู่กับผลรวมคะแนนของ Selectors ในแต่ละชุด โดยใช้กฎการนับเลขเข้ามาช่วย มี 3 หลัก คือ หลักร้อย หลักสิบ หลักหน่วย แทนสมการทั้งสามด้วย a, b และ c ซึ่งจะได้ค่า

Slider are very useful and increasingly popular web page elements used for highlighting important content. By using a jQuery slider plugin, one can create amazing HTML slider effects with fancy animations of content elements like text and images.  jQuery takes care of the difficult aspects like browser support and typically when using jQuery plugins it can be done with very little coding effort. This is the reason why jQuery sliders and jQuery banner slideshow scripts have become very popular on most types of websites. They are are typically used to feature multiple products, news, video etc.

<? $objConnect = mysql_connect(“localhost”,”root”,”root”) or die(“Error Connect to Database”); //ยูเซอร์เข้า Databse $objDB = mysql_select_db(“yasub”);  //ระบบชื่อฐานข้อมูล mysql_query(“SET NAMES UTF8”); //แปลภาษาในฐานข้อมูลเป็น UTF 8 $strSQL = “SELECT * FROM content a LEFT join accountdetail b on a.accId=b.accId LEFT join account c on a.accId=c.accId LIMIT 6″; $objQuery = mysql_query($strSQL) or die (“Error

คำสั่งในการจับคู่ตาราง จะใช้ร่วมกันกับคำสั่ง SELECT มีด้วยกัน 4 วิธีดังนี้ INNER JOIN จะรวมข้อมูลที่เลือกเชื่อมต่อ OUTER JOIN จะรวมข้อมูลที่เลือกเชื่อมต่อ LEFT JOIN จะรวมข้อมูลที่ตรงกัน โดยจะเน้นตารางฝั่งซ้ายเป็นหลัก RIGHT JOIN จะรวมข้อมูลที่ตรงกัน

เผื่อจะมีประโยชน์กับ admin มือใหม่ บ้างครับ ไม่ได้เก่งอะไร แค่อยากเผื่อแผ่ให้ท่านที่ยังไม่รู้ได้ทำเป็นบ้าง เพราะที่ผมทำ รายงานเองได้(บางส่วน) ก็มาจากนั่งดู แกะๆ แล้วก็แก้เอา บางอย่างก็ไม่รู้ว่าทำไมต้องเขียนแบบนี้ บางอย่างอาจจะไม่ถูกต้องนัก

การเชื่อมตาราง ในการปฏิบัติงานจริงข้อมูลที่เก็บในฐานข้อมูลจะประกอบด้วยข้อมูลในหลายตารางซึ่งมีความสัมพันธ์กัน ดังนั้นจึงมีหลายคำถามซึ่งไม่สามารถตอบคำถามได้ ด้วยการดึงหรืออ่านข้อมูลจากตารางเพียงตารางเดียว

ตัวอย่าง การใช้คำสั่ง DISTINCTสำหรับ teble ที่ join กัน (SQL Server Management Studio) SELECT DISTINCT “TB_SR_01″.”TYPE_CODE”, “TB_SR_01″.”SERVICE_AREA”, “CODE_BOOK”.”CODE_NAME”, “TB_SR_01″.”OPEN_DATE”, “TB_SR_01″.”SUB_TYPE_CODE”, “CODE_BOOK_1″.”CODE_NAME”, “TB_SR_01”.”B_SUB_TYPE_CODE_1″, “CODE_BOOK_2″.”CODE_NAME” FROM ((“DB”.”dbo”.”TB_SR_01″

หน้าส่วนแสดงผล wp_nav_menu( array( ‘theme_location’ => ‘primary’, ‘walker’ => new Walker_Nav_Menu_Dropdown(), ‘items_wrap’ => ‘<div class=”mobile-menu”><form><select onchange=”if (this.value) window.location.href=this.value”>%3$s</select></form></div>’, ) );   หน้า Fuction.php class Walker_Nav_Menu_Dropdown extends Walker_Nav_Menu { function start_lvl(&$output, $depth){ $indent = str_repeat(“\t”, $depth);

จากโจทย์ที่ผมได้รับคือ มีข้อมูลอยู่กลุ่มหนึ่ง ซึ่งเป็นข้อมูลที่ซ้ำกันอยู่ ต้องการนำมาจัดใหม่โดยไม่ต้องแสดงข้อมูลที่ซ้ำกัน แล้วเอาไปใส่ใน List Box ซึ่งจากภาพ จะเห็นได้ว่า ฟิล์ Car_No มีข้อมูลซ้ำกันจำนวนหนึ่ง เราต้องทำการกรองข้อมูลก่อน ซึ่งคำสั่งในการดึงข้อมูลโดยไม่ซ้ำกัน

ป้องกันการค้นหาจาก Google ในเว็บด้วย Robots.txt Robots.txt การกำหนดวิธีที่ป้องกันไม่ให้ spider หรือ bot เข้ามาเก็บหน้าเว็บเพจต้องห้ามของเรา Spider หรือ Bot เป็นโปรแกรมของ Search Engine ที่ทำตัวเป็นนักค้นหาและท่องเว็บจากนั้นจะทำการบอกให้ ระบบ Search Engine Database

ถ้าพูดถึง breadcrumb หลายๆคน  คงยังงงอยู่ว่ามันคืออะไร  แต่สำหรับหลายคนที่ทำ SEO ก็อาจจะรู้จักกันดี แต่ผมว่าก็อาจไม่ทุกคน เดียววันนี้ผมจะมาทำให้มันกระจ่างถ่องแท้ว่ามันคืออะไร เกี่ยวข้องกับ wordpress และ SEO อย่างไร breadcrumb คืออะไร

อ่านหัวข้อแล้วอาจยังงงๆ แต่รับรองว่าเป็นเทคนิคง่ายๆที่ทุกคนต้องร้องว่าอ้อ.. กันเลยที่เดียว เทคนิคที่นี้ก็คือการแก้ไข เวลาที่เราเขียนบทความหรือว่าสร้าง post ขึ้นมาใหม่ เมื่อเราใส่  URL ของเว็บไซต์ ก็คงจะไม่พบปัญหาอะไร

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

nofollow  link ถือว่าเป็นอีกเทคนิคหนึ่งสำหรับคนที่ทำ SEO  ต้องรู้จักกันดี โดยส่วนใหญ่แล้วประโยชน์ที่ได้รับจากการทำ nofollow  link ก็คือค่า PR ที่พี่ google เขาเอามาคำนวนเพื่อจัดอันดับเวบของเรา โดยดูจากลิงค์เพื่อนบ้าน ว่ามี PR มากน้อยแค่ไหน

google analytics ถือว่าเป็นมือในการเก็บสถิติบล็อกที่ดีมาก มันถูกพัฒนาขึ้นโดย google การเข้าถึงเวบ google analytics ก็แค่เรามีบัญชีอีเมล์ของ google หรือ gmail เท่านั้นแหละครับ แค่นี้เราก็สามารถใช้งานมันได้ฟรีแล้ว เราสามารถเปิดเวบได้ ที่ http://www.google.com/analytics/ หลังจากที่เข้าไปใช้งานแล้วก็ทำการสร้าง

gravatar คือเวบที่เอาไว้ให้เรา เอารูปของเราใส่เอาไว้ในโลกออนไลน์ โดยจะใช่อีเมล์ของเราเป็น คีย์หลักในการยืนยันตัวตน เมื่อเราต้องการเรียกใช้รูปของเราที่อัพโหลดไว้ ก็แค่เพียงกรอกอีเมล์ของเราลงไป แล้วรูปของเราก็จะปรากฎขึ้นมา เราจะสมัครการใช้งาน

การกำหนดขนาดของรูปภาพที่ใช้ใน  wordpress theme  เช่น ขนาดรูป post-thumbnail หรือขนาดของรูปที่แทรกในโพส์ต ของเรา  ถ้ามองดูแล้วสำหรับคนที่เขียนบทความไม่เยอะมากอาจจะไม่พบปัญหามากเท่าไร เพราะ wordpress เอง ก็มีส่วนให้เราเข้าไปแก้ไข หรือกำหนดหนดขนาด

รูปภาพ วีดิโอ เพลง หรือสื่อต่าง เช่น รูป flash ที่เราต้องการใส่ลงเข้าไปในบทความของ wordpress นั้นไม่ใช่เรื่องยากแต่อย่างไร เพราะ wordpress ได้เตรียมเครื่องต่าง ๆเอาไว้ให้เราอย่างครบครัน นอกจากเครื่องมือที่สามารถใส่รูปภาพได้แล้ว