เนื้อหาตอนต่อไปนี้ จะขอถือเป็นตอนสุดท้ายของโปรเจ็คการเรียนรู้ และใช้งาน codeigniter
อย่างไรก็ตาม เนื้อหาเกี่ยวกับ codeigniter ก็จะยังมีเพิ่มเติม รวมถึงบางส่วนของ
library หรือส่วนประกอบอื่นๆ ที่ยังไม่ได้กล่าวถึง โดยจะนำมาอธิบาย หรือแนะนำ
แยกออกจากโปรเจ็คที่เราศึกษามาแต่ต้น
การจบส่วนของโปรเจ็คนี้ หากใครกดติดตามบทความ ตั้งแต่ต้น จนถึงตอนนี้ จะสามารถดาวน์
โหลดโปรเจ็ค ที่ใช้งาน codeigniter 3.0.1 ไปต่อยอดหรือปรับแต่งใช้งานเพิ่มเติมได้
ส่วนของเนื้อหาที่เราเหลืออยู่ก็คือ หน้า home , aboutus และ service
โดยหน้า home เราจะปล่อยเป็นหน้าว่าง นั่นก็คือ เราจะใส่ข้อมูลอะไรก็ได้ ประยุกต์เพิ่มเติมเอา
ส่วนหน้า aboutus อันนี้จะเป็นแค่การดึงข้อมูลมาแสดง อ้างอิงจากบทความ
การใช้งาน CKEditor CDN ร่วมกับ codeigniter อย่างง่าย
https://www.ninenik.com/content.php?arti_id=676 via @ninenik
และหน้า service ก็จะเป็นการดึงข้อมูลมาแสดงเช่นกัน แต่หน้านี้จะพิเศษขึ้นมาหน่อย คือ
เราจะมาดูในเรื่องของการกำหนด url ให้รองรับ seo เช่น url เป็นภาษาไทย
การแสดงข้อมูลหน้า Aboutus
ให้เปิดไฟล์ aboutus.php ในโฟลเดอร์ apps > views > pages
แล้วกำหนดโค้ดประมาณนี้
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 | <div class = "container" > <div class = "container-fluid" > <?php $query = $this ->db->get_where( "tbl_aboutus" , array ( "aboutus_id" =>1)); $row = $query ->row_array(); //คิวรี่ข้อมูลมาแสดงแค่รายการเดียว if (isset( $row )) // ถ้ามีข้อมูล { ?> <h1><?= $row [ 'aboutus_title' ]?></h1> <p> <?= $row [ 'aboutus_detail' ]?> </p> <?php } ?> </div> </div> |
การแสดงข้อมูลหน้า Service และการกำหนด URL ให้รองรับ SEO
สำหรับรายละเอียดการดึงข้อมูลในหน้า Service มาแสดงและแบ่งหน้า นั้นจะคล้ายๆ กับในส่วน
ของตอนที่เกี่ยวกับการจัดการ Service ของ admin ดึงนั้นจะไม่ลงรายละเอียดอธิบายซ้ำ
ก่อนอื่นเรามาดูรูปแบบ URL ของหน้า service ของเว็บไซต์โปรเจ็คของเราก่อน
รูปแบบ URL จะเป็น
1 2 3 4 5 6 7 8 | // หน้าปกติ // มีการแบ่งหน้า // แสดงข้อมูล อ้างอิง id ข้อมูลเท่ากับ 1 http://localhost/learnci/service/view/หัวข้อของบริการ_ที่_1 // แสดงแบบรองรับ SEO |
เริ่มต้นให้เราสร้างไฟล์ชื่อ Service_model.php ไว้ในโฟลเดอร์ apps > models
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 | <?php class Service_model extends CI_Model { public function __construct() { parent::__construct(); $this ->load->library( 'user_agent' ); $this ->load->library( 'pagination' ); } public function getlist( $id , $query_str =null){ $config [ 'base_url' ] = base_url( 'service/page/' ); // url เพจข้อมูลของเรา $config [ 'per_page' ] = 5; // จำนวนแสดงต่อหน้า $config [ 'num_links' ] = 2; // จำนวนเลขซ้ายขวา เช่น 1 2 3 4 5 คือหน้า 2 หลัง 2 $config [ 'use_page_numbers' ] = TRUE; // แสดงเลขหน้าตามจริง เช่นหน้า 1 ก็เป็นเลข 1 // ส่วนของการกำหนดหน้าตาของ การแบ่งหน้า เนื่องจากเราใช้ bootstrap css จึงสามารถนำมาใช้ได้เลย $config [ 'full_tag_open' ] = '<nav><ul class="pagination">' ; // เปิดแท็กทั้งหมด $config [ 'full_tag_close' ] = '</ul><nav>' ; // ปิดแท็กทั้งหมดด้วย $config [ 'first_link' ] = 'First' ; // ข้อความแสดงหน้าแรก $config [ 'first_tag_open' ] = '<li>' ; // แท็กเปิดข้อความหน้าแรก $config [ 'first_tag_close' ] = '</li>' ; // แท็กปิดข้อความหน้าแรก $config [ 'first_url' ] = '' ; //url หน้าแรก $config [ 'last_link' ] = 'Last' ; // ข้อความสแดงหน้าสุดท้าย $config [ 'last_tag_open' ] = '<li>' ; // แท็กเปิดข้อความหน้าสุดท้าย $config [ 'last_tag_close' ] = '</li>' ; // แท็กปิดข้อความหน้าสุดท้าย $config [ 'next_link' ] = '>' ; // ข้อความหน้าก่อนหน้า ในที่นี้ใช้สัญลักษณ์ < $config [ 'next_tag_open' ] = '<li>' ; // แท็กเปิดข้อความแสดงหน้าก่อนหน้า $config [ 'next_tag_close' ] = '</li>' ; // แท็กปิดข้อความแสดงหน้าก่อนหน้า $config [ 'prev_link' ] = '<' ; // ข้อความหน้าถัดไป ในที่นี้ใช้สัญลักษณ์ > $config [ 'prev_tag_open' ] = '<li>' ; // แท็กเปิดข้อความหน้าถัดไป $config [ 'prev_tag_close' ] = '</li>' ; // แท็กปิดข้อความหน้าถัดไป $config [ 'cur_tag_open' ] = '<li class="active"><a href="javascript:void();">' ; // แท็กหน้าเลขเพจปัจจุบัน $config [ 'cur_tag_close' ] = '</a></li>' ; // แท้กปิดหน้าเพจปัจจุบัน $config [ 'num_tag_open' ] = '<li>' ; // แท็กเปิดหน้าเพจเลขต่างๆ $config [ 'num_tag_close' ] = '</li>' ; // แท็ปิดหน้าเพจเลขต่างๆ $config [ 'reuse_query_string' ] = TRUE; $config [ 'total_rows' ] = $this ->db->count_all_results( 'tbl_service' ,FALSE); $this ->pagination->initialize( $config ); // ตั้งค่าการกำหนด การแบ่งหน้า $begin =(isset( $id ) && $id >1)?( $id -1)* $config [ 'per_page' ]:0; $this ->db->limit( $config [ 'per_page' ], $begin ); $query = $this ->db->get(); return $query ->result_array(); } public function view( $id ){ // มี $id เป็น parameter ไว้กำหนดเงื่อนไข if ( intval ( $id )>0){ $query = $this ->db->get_where( 'tbl_service' , array ( 'service_id' => $id )); } else { $arr_where = array ( 'service_title' =>preg_replace( '/_/' , ' ' , $id ) ); $query = $this ->db->get_where( 'tbl_service' , $arr_where ); } return $query ->row_array(); // ส่งข้อมูลผลัพธ์กลับเป็น array แถวข้อมูล } } |
จากโค้ดด้านบน เราจะขอพูดเฉพาะในส่วนของ ฟังก์ชั่น view($id)
จะเห็นว่า เราจะมีการกำหนดเงื่อนไข โดยการตรวจสอบค่าจากตัวแปร $id
if(intval($id)>0){ // ถ้าแปลค่าตัวแปร $id แล้วมีค่ามาก 0 แสดง่ว่าข้อมูลที่ส่งมา
เป็นลักษณะของตัวเลข เช่นเราเรียก URL
ถ้าเรากำหนด URL ในลักษณะข้างต้น เลข 1 ก็คือค่าในฟิลด์ service_id ของตาราง tbl_service
การคิวรี่ข้อมูลจึงเป็นการเทียบกับค่าของ service_id
1 | $query = $this ->db->get_where( 'tbl_service' , array ( 'service_id' => $id )); |
หากเป็นกรณีอื่น เช่น เมื่อแปลงค่าเป็นตัวเลขแล้วมีค่าน้อยกว่าหรือท่ากับ 0
แสดงว่าค่าของตัวเปร $id เป็นในลักษณะของข้อความตัวอักษร โดยรูปแบบนี้
เราจะใช้ประโยชน์สำหรับ SEO สำหรับใช้กับ URL ตัวอย่าง
1 | http://localhost/learnci/service/view/หัวข้อของบริการ_ที่_1 |
จากตัวอย่าง ค่า $id ก็คือ หัวข้อของบริการ_ที่_1 ซึ่งได้มาจากข้อความ
ของฟิลด์ service_tile มีค่าเป็น "หัวข้อของบริการ ที่ 1"
เราจะเห็นว่า หัวข้อจริงๆ แล้วจะมีช่องว่าง แต่สำหรับกำหนดให้ URL รองรับ SEO
จึงได้ทำการแปลงจากช่องว่างให้เป็นเครื่องหมาย _ (underscore) แทนด้วยฟังก์ชั่น
1 2 | $service_title_url =preg_replace( '/[[:space:]]+/' , '_' , trim( $row [ 'service_title' ])); // อยู่ในไฟล์ service.php |
ดังนั้นเมื่อค่าที่ส่งมามีเครื่องหมาย _ เวลาเอาไปใช้ จึงต้องแปลงกลับ
ด้วยคำสั่ง
1 | preg_replace( '/_/' , ' ' , $id ) |
การเปรียบเทียบค่า WHERE ก็จะได้เป็น service_title='หัวข้อของบริการ ที่ 1'
1 2 3 4 | $arr_where = array ( 'service_title' =>preg_replace( '/_/' , ' ' , $id ) ); $query = $this ->db->get_where( 'tbl_service' , $arr_where ); |
การกำหนดในลักษณะนี้ จะทำให้สามารถรองรับการใช้งานทั้งแบบค่า id และค่าที่เป็นข้อความ
เพื่อรองรับ SEO
ต่อไปเรามาดูที่ไฟล์ service.php ในโฟลเดอร์ apps > views > pages
โค้ดสำเร็จจะได้เป็นดังนี้
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 | <div class = "container" > <?php if ( $action ==null || $action == 'page' ){?> <h1><?= $title_h1 ?></h1> <?php $query_str = $this ->input->get(); $keyword = $this ->input->get( 'keyword' ); $result = $this ->service_model->getlist( $id , $query_str ); ?> <?php $i_num =0; if (!isset( $id )){ $id =1; } if ( count ( $result )>0){ foreach ( $result as $row ){ $i_num ++; $service_title_url =preg_replace( '/[[:space:]]+/' , '_' , trim( $row [ 'service_title' ])); ?> <div class = "container-fluid" > <img src= "<?=base_url('upload/'.$row['service_img'])?>" class = "img-responsive" style= "width:150px;" alt= "" > <br> <!-- <a href= "<?=base_url('service/view/'.$row['service_id'])?>" ><?= $row [ 'service_title' ]?></a>--> <a href= "<?=base_url('service/view/'.$service_title_url)?>" ><?= $row [ 'service_title' ]?></a> <p> <?=mb_substr( strip_tags ( $row [ 'service_detail' ]),0,30)?> <!-- <a href= "<?=base_url('service/view/'.$row['service_id'])?>" >อ่านเพิ่ม..</a>--> <a href= "<?=base_url('service/view/'.$service_title_url)?>" >อ่านเพิ่ม..</a> </p> <br> </div> <?php } ?> <?php } ?> <?php echo $this ->pagination->create_links(); ?> <?php } ?> <?php if ( $action == 'view' ){?> <?php $previous_url = $this ->agent->referrer(); // เรียกใช้ฟังก์ชั่น view() ดึงข้อมูลมาแสดงก่อนแก้ไข $row = $this ->service_model->view( $id ); ?> <div class = "container-fluid" > <h1><?= $row [ 'service_title' ]?></h1> <p> <img src= "<?=base_url('upload/'.$row['service_img'])?>" class = "img-responsive" alt= "" > <br><br> <?= $row [ 'service_detail' ]?> </p> <br> <a href= "<?=$previous_url?>" class = "btn btn-warning btn-sm" >< Back</a> <br><br> </div> <?php } ?> </div> |
ดูในส่วนแรกกัน คือส่วนของ $action เท่ากับ null หรือ $action เท่ากับ page
ซึ่งก็คือหน้าที่เราเปิดเข้ามา และก็หน้าที่การแบ่งหน้า หรือเลือกหน้าของข้อมูล
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 | <?php if ( $action ==null || $action == 'page' ){?> <h1><?= $title_h1 ?></h1> <?php $query_str = $this ->input->get(); $keyword = $this ->input->get( 'keyword' ); $result = $this ->service_model->getlist( $id , $query_str ); ?> <?php $i_num =0; if (!isset( $id )){ $id =1; } if ( count ( $result )>0){ foreach ( $result as $row ){ $i_num ++; // แปลงหัวข้อให้รองรับ URL สำหรับ SEO คือเปลี่ยนช่องว่างเป็น _ $service_title_url =preg_replace( '/[[:space:]]+/' , '_' , trim( $row [ 'service_title' ])); ?> <div class = "container-fluid" > <img src= "<?=base_url('upload/'.$row['service_img'])?>" class = "img-responsive" style= "width:150px;" alt= "" > <br> <!-- <a href= "<?=base_url('service/view/'.$row['service_id'])?>" ><?= $row [ 'service_title' ]?></a>--> <a href= "<?=base_url('service/view/'.$service_title_url)?>" ><?= $row [ 'service_title' ]?></a> <p> <?=mb_substr( strip_tags ( $row [ 'service_detail' ]),0,30)?> <!-- <a href= "<?=base_url('service/view/'.$row['service_id'])?>" >อ่านเพิ่ม..</a>--> <a href= "<?=base_url('service/view/'.$service_title_url)?>" >อ่านเพิ่ม..</a> </p> <br> </div> <?php } ?> <?php } ?> <?php /// ส่วนของการแบ่งหน้า echo $this ->pagination->create_links(); ?> <?php } ?> |
โค้ดในส่วนนี้ไม่มีอะไร คล้ายเนื้อหาที่เราเคยศึกษามาแล้ว แต่ให้สังเกตตรงฟังก์ชั่น
1 2 | // แปลงหัวข้อให้รองรับ URL สำหรับ SEO คือเปลี่ยนช่องว่างเป็น _ $service_title_url =preg_replace( '/[[:space:]]+/' , '_' , trim( $row [ 'service_title' ])); |
ส่วนนี้ จะเป็นส่วนที่เราจะแปลงหัวข้อมูลให้รอบรับ URL สำหรับ SEO คือเปลี่ยนช่องว่างเป็น _
เพื่อส่งเข้าไปในหน้าลิ้งค์แสดงข้อมูล คือจากหัวข้อ "หัวข้อของบริการ ที่ 1" ก็แปลงเป็น
"หัวข้อของบริการ_ที่_1" ส่งไปกับ URL ให้รองรับ SEO
ในโค้ดเรายังมีลิ้งค์ที่เรากำหนดการส่งแบบค่า service_id เข้าไป แต่เราไม่ได้ใช้ คอมเม้นท์ปิดไว้
ให้ดูเป็นแนวทาง เลือกว่าจะใช้แบบไหน ซึ่งฟังก์ชั่นที่เราเขียนไว้รองรับทั้งสองแบบอยู่แล้ว
ต่อมาเรามาดูในส่วนของการแสดงข้อมูล เมื่อคลิกลิ้งค์หัวข้อของบริการ
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 | <?php if ( $action == 'view' ){?> <?php $previous_url = $this ->agent->referrer(); // เรียกใช้ฟังก์ชั่น view() ดึงข้อมูลมาแสดงก่อนแก้ไข $row = $this ->service_model->view( $id ); ?> <div class = "container-fluid" > <h1><?= $row [ 'service_title' ]?></h1> <p> <img src= "<?=base_url('upload/'.$row['service_img'])?>" class = "img-responsive" alt= "" > <br><br> <?= $row [ 'service_detail' ]?> </p> <br> <a href= "<?=$previous_url?>" class = "btn btn-warning btn-sm" >< Back</a> <br><br> </div> <?php } ?> |
ในหน้านี้จะเห็นว่าเรามีการส่ง $id ในที่นี้ก็คือหัวข้อที่จัดรูปแบบให้รองรับ SEO แล้ว
เข้าไปทำการคิวรี่ข้อมูลผ่านฟังก์ชั่น view() ใน model ถ้าหัวข้อที่ส่งไปกับ URL
ตรงกับหัวข้อในฐานข้อมูลฟิลด์ service_title ก็จะทำการดึงข้อมูลรายละเอียด
และข้อมูลอื่นๆ ของ service มาแสดง
สำหรับโปรเจ็ค การเรียนรู้การใช้งาน codeigniter ของเราก็ขอจบเพียงเท่านี้
ใครที่กดติดตาม เนื้อหาหมวด codeigniter ตั้งแต่ต้นจนถึงตอนนี้ ก็รอโหลด
ไฟล์โปรเจ็คจากเมนูสมาชิกด้านขวา เร็วๆ นี้ ได้เลย
ส่วนใครที่อยากได้โค้ดส่วนนี้ ก็ไล่กดติดตามเนื้อหาให้ครบตามเงื่อนไข ก็จะสามารถ
ดาวน์โหลดได้
ปล. เนื้อหาเกี่ยวกับ codeigniter จะยังมีเพิ่มเติมตามความเหมาะสม