January 24, 2018

Page และ Widget สำหรับตรวจสอบราคาทองคำ

ทั้งหมดนี้เป็นบันทึกเก่าของผมตั้งแต่ Blog ที่แล้ว บังเอิญไปเจอว่า Webmaster ของห้างทองน่ำเชียงเก็บไว้ เลยเอากลับมาบันทึกไว้ที่นี่อีกครั้ง ถึงแม้จะไม่ได้ Monitor ราคาทองแล้ว เพราะไม่รู้ว่าจะลงไปถึงไหน ตอนนี้หันไป Monitor อย่างอื่นๆแทน แต่ก็เป็นองค์ความรู้ที่เคยบันทึกไว้นานแล้ว ถ้าปล่อยให้หายไปคงเสียดายมากๆ ถ้ามีเวลาจะลองทำ Pages และ Widget ชุดนี้อีกสักครั้ง เพื่อตรวจสอบความถูกต้องครับ

หมายเหตุ ตอนนี้ code ชุดนี้ยังไม่ได้รับการตรวจสอบนะครับ ว่าใช้ได้หรือเปล่า

บันทึกของผม

ผมมีความจำเป็นที่ต้องคอยดูราคาทองคำบ่อยๆครับด้วยเหตุผลบางประการ 😉 😉 หลังจากเปลี่ยนมาใช้ linux สักระยะนึงก็คือผมไม่สามารถใช้ active desktop ในการดูราคาทองคำได้ เพราะบน Linux ไม่มี active desktop ครับ อยากทราบว่าใช้อย่างไรอ่านได้จากที่นี่ครับ อยากได้ราคาทองแบบใหม่ใน active desktop ครับ ผมไปถามไว้เองล่ะครับ หลังจากที่เขาเปลี่ยนเป็นแบบแฟลชครับ ผมเลยมีความคิดว่าในเมื่อ linux ไม่มี active desktop ก็เอามาใส่ blog ของผมไว้เลยดีใหม แต่ก็อีกล่ะครับผมเองยังใหม่กับ blog และ word press มากๆสิ่งแรกที่แว๊บมาในหัวคือ การสร้าง pages ใหม่เพราะตัว word press นั้นรองรับการสร้าง pages ใหม่อยู่แล้ว
วิธีการสร้าง pages
1.Log in เข้าสู่ Word press ไปที่ menu Write เลือก write page
2.ใส่ page title ลงไปตามต้องการ เช่น Gold Price หรือ ราคาทองคำ
3.ใส่ code ราคาทองคำจาก ห้างทองน่ำเชียงลงไปใน page content

code ราคาทองแบบเดิม

[php htmlscript=””true”” smarttabs=””true””]
<p align=”center”><iframe name=”I1″ src=”http://namchiang.com/goldprice.php?usefontstyle=styleFontLarge” width=”200″ height=”140″ marginwidth=0 marginheight=0 scrolling=no frameborder=0></iframe></p>
[/php]

code ราคาทองแบบใหม่

[php htmlscript=””true”” smarttabs=””true””]
<p align=”center”><iframe src=”http://namchiang.com/ncgp2-1.swf” width=”172″ height=”152″ frameborder=”0″ marginheight=0 marginwidth=0 scrolling=”no”></iframe></p>
[/php]

ปรับแต่งค่าต่างๆตามต้องการครับ เช่น Discussion, Page Password, Page Parent สั่งบันทึก page ไปเลย ได้แล้วครับ จะดูก็ไปที่หน้าแรกของ blog เลือกหัวข้อที่เรารใส่เลยครับโดยจะอยู่ที่ side bar กลุ่ม page ครับ

ความต้องการไม่มีที่สิ้นสุด
แต่ไม่ได้หมดแค่นั้นครับ ผมไม่อยากต้องมาคลิ๊กเลือกแบบนี้ทุกครับ เปิด blog ตัวเองมาแล้วเห็นเลย ทำได้ใหมครับ คิดต่อ สิ่งที่ผมต้องทำคือ สร้าง กล่อง ใน side bar ขึ้นมาแล้วก็ เอา code ราคาทองมาใส่ในกล่อง โอแค่สองขั้นตอนเองสบายๆ แต่มันไม่ง่ายแบบนั้นสิครับเพราะผมใช้ word press มาได้ระยะนึงแล้วก็จริงแต่ก็ไม่มีเวลาเข้าไปศึกษา coding ของเขาเลยเอาล่ะวันนี้ต้องลองกันหน่อย โดยมาดูกันก่อนว่า กล่อง page นั้นเกิดขึ้นได้อย่างไร ก็เลียนแบบเพราะฉนั้นเราก็จะได้กล่องออกมาแล้วโดยในกล่องก็ใส่ code ราคาทองคำลงไป จากนั้นก็หาวิธีเอากล่องดังกล่าวไปใส่ side bar น่าจะจบแล้ว นี่ล่ะครับเป็นที่มาของหัวข้อ ผมใช้นิสัยเดิมครับ คือ หากเป็น open source ผมจะเข้าไปดูว่ามีรูปแบบการทำงานอย่างไรและก็เลียนแบบเพื่อให้ได้มายัง module หรือสิ่งที่ต้องการครับ เอาล่ะครับมาลองลงมือทำกัน

กล่องเกิดได้อย่างไร
กล่องเกิดจาก บ.ผู้ผลิต เอ้ย ไม่ใช่ครับ กล่องเกิดจาก ไฟล์ 1 ไฟล์ ครับ เรามาลองแกะจากไฟล์ page.php ในโฟลเดอร์ ของ word press คือ /wp-content/themes/ชื่อtheme ไฟล์ page.php คือ file ที่ทำหน้าที่เปิดหัวข้อ page ครับ
มีข้อกำหนดเบื้องต้นแบบนี้

[php htmlscript=””true”” smarttabs=””true””]
<?php get_header(); ?> //หัวกล่อง ไม่ต้องแก้
//////////////
ส่วน body ของกล่องครับ ส่วนนี้แหละที่จะเอา code ราคาทองมาใส่ เป็น html หรือ php
///////////////

<?php get_sidebar(); ?> // Side bar ของกล่อง ไม่ต้องแก้

<?php get_footer(); //ส่วนท้ายของกล่อง ไม่ต้องแก้
[/php]

โมแล้วก็จะได้แบบนี้ครับ

[php htmlscript=””true”” smarttabs=””true””]
<?php get_header(); ?>

<p align=”center”><iframe src=”http://namchiang.com/ncgp2-1.swf” width=”172″ height=”152″ frameborder=”0″ marginheight=0 marginwidth=0 scrolling=”no”>
</iframe></p>

<?php get_sidebar(); ?>

<?php get_footer(); ?>
[/php]

หลังจากนั้นบันทึกเป็น goldprice.php เสร็จแล้วหนึ่งขั้นครับ ขั้นถัดไปคือหาวิธีเอากล่องที่เราสร้างไปอวดโฉมใน side bar ครับ นิสัยเดิมที่ผมจั่วหัวมาอีกรอบครับ ไปดูที่ไฟล์ sidebar.php กันครับ สิ่งที่สังเกตุเห็นได้คือ จะมีรูปแบบข้อความแบบนี้ซ้ำๆกันอยู่ครับ ลองตีความหมายกันดู

[php htmlscript=””true”” smarttabs=””true””]
<li id=”archives”> //id ของกล่อง
<h2><?php _e(’Archives’); ?></h2> //ชื่อกล่องที่จะแสดงบนมุมบนกล่อง
<ul>
<?php wp_get_archives(’type=monthly’); ?> //ส่วน function หรือเอาท์พุทที่ต้องการ
</ul>
</li>
[/php]

ก็จัดการเลยสิครับ ได้มาแบบนี้ครับ

[php htmlscript=””true”” smarttabs=””true””]
<li id=”Gold Price”>
<h2><?php _e(’Gold Price’); ?></h2>
<ul>
<?php echo “<center> <p align=\”center\”><iframe src=\”http://namchiang.com/ncgp2-1.swf\” width=\”162\” height=\”142\” frameborder=\”0\” marginheight=\”0\” marginwidth=\”0\” scrolling=\”no\”>
</iframe></p> <center>”;?>
</ul>
</li>
[/php]

ปรับลดความกว้าง ความสูงของแฟลชสักหน่อยเพราะท่าทางจะเกินขนาดกล่องเดี๋ยวไม่สวย หลังจากนั้น save เลยครับ ลองไปชมกันเลยที่หน้าแรกครับ ออกมาแล้ว เย้เย้ นี่ล่ะครับเป็นที่มาของ เป็นนิสัยไปแล้วครับ เอา Open source มาใช้ อยากได้อะไร พัฒนาเพิ่มเอา นิสัยนี้ผมคงจะใช้เรื่อยๆไปล่ะครับ และจะเอามาใช้ในการทำงานด้วยเพื่อลดต้นทุน เวลา แรงงาน ในการ พัฒนาระบบครับ

ปล. Page นี่ล่ะครับเป็นแนวคิดให้ผมเอาไปใช้พัฒนา CMS ของทีมต่อไปเพราะมันกำลังจะก้าวข้ามข้อจำกัดที่ว่า CMS ของทีมผมไม่สามารถสร้างเอกสารเพิ่มได้ตามที่ต้องการ

ขอขอบคุณ
– ห้างทองน่ำเชียงสำหรับ code ราคาทองคำดีๆ
– Word Press สำหรับ Blog ดีๆ
– และโลกของ Open Source ที่ทำให้ผมมีเรื่องทำได้เรื่อยๆครับ

http://www.rmuti.ac.th/user/suthep/?cat=4

www.namchiang.com

Print Friendly, PDF & Email

Leave a Reply

This site uses Akismet to reduce spam. Learn how your comment data is processed.