Ruby on Rails :: Decorate Sidebar

Posted by PunNeng, Sat Aug 12 00:08:00 UTC 2006

มาต่อกันด้วยการตกแต่ง sidebar โดยผมจะไปสร้างตัวช่วยไว้ที่ helpers โดย file แต่ละตัวจะมีความสัมพันธ์กับฝั่ง views เช่น post_helper.rb จะสามารถถูกเรียกใช้งานจากฝั่ง views ของ post_controller ลองดูใน app/helpers ดูนะครับ จะมีตัว application_helper.rb อยู่ ตัวนี้จะเป็น help สำหรับทุกๆ views ถ้าเรามี method ที่มีความจำเป็นสำหรับทุกๆ views ก็ควรจะเอามาไว้ใน application_helper.rb นี้ ซึ่งใน helper พวกนี้ Rails จะใช้กลไกของ Ruby ที่เรียกว่า Module สำหรับ Module ไม่จัดว่าเป็น class ดูกันง่ายๆ คือเป็นที่รวม code มากกว่า ในฝั่ง controller ถ้าทำการ import เข้าไป ก็ใช้ได้เหมือนๆ กัน แต่ Module พวกนี้ มีลักษณะพิเศษต่างกันไปอีก คือ สามารถสร้าง instance หรือ ตัวแปรต่างๆ ได้ ซึ่งเราจะเรียก Module นี้ว่า Mixin ไว้จะเล่าให้ละเอียดกว่านี้อีก ในครั้งถัดๆ ไป

กลับมางานของเรากันต่อ ที่ผมจะตกแต่ง sidebar นี้คือ ผมจะสร้างตัวที่ไปเอาค่าในแต่ละ post มาแสดงเป็นหัวข้อๆ ไป เช่น เอา post ล่าสุด 10 อันมาแสดง เป็นต้น หรือเราอาจจะเอาอย่างอื่นมาแสดงอีก ตามสมควร

มาเริ่มกันเลย ไปที่ app/helpers/post_helper.rb ก่อนเลย แล้วแก้ไขตามนี้

  1
  2
  3
  4
  5
module PostHelper
  def get_latest_past_for(num)
    Post.find :all, :order => "created_at desc" , :limit => num
  end
end

จากนั้นไปแก้ที่ app/views/layouts/post.rhtml ในส่วนของ sidebar ดังนี้

  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
<div id="mainNav">
  <ul>
    <li><%= link_to "List", :action => 'index' %></li>
  </ul>
  <p><strong>Previous</strong></p>
  <ul>
  <% for previous in get_previous_post_for(8) %>
    <li><%= link_to previous.title, :action => 'show', :id => previous %>
  <% end %>
  </ul>
</div><filter:jzfilter>

แล้วก็แก้ที่ home.css อีกเล็กน้อย

<filter:jzfilter lang="css">#mainNav {
  float: right;
  padding-top: 1em;
  padding-bottom: 1em;
  width: 8em;
  background: #D1DAD3;
  color: #186F2B;
}

#mainNav p{
  margin-left: 30px;
}

#mainNav ul li{
  font-size: 12px;
}

จะได้ดังรูป

ตามนี้แล

แก้ไขล่าสุด วันที่ 13 กรกฏาคม 2550 เวลา 1.50 น.

Filed Under: Ruby on Rails | Tags: howto ruby on rails

Comments

Have your say

A name is required. You may use HTML in your comments.




codegent: we're hiring