0
0
Ruby on Railsframework~10 mins

Layouts and content_for in Ruby on Rails - Step-by-Step Execution

Choose your learning style9 modes available
LearnWhyDeepVisualTryChallengeProjectRecallPerf
Concept Flow - Layouts and content_for
Request comes in
↓
Controller action runs
↓
Render view template
↓
View calls content_for :section
↓
Layout calls yield or yield(:section)
↓
Final HTML sent to browser
Rails processes a request by running a controller, rendering a view that defines content blocks with content_for, then the layout inserts those blocks using yield or yield(:section).
Execution Sample
Ruby on Rails
<!-- layout.html.erb -->
<html>
  <body>
    <header><%= yield :header %></header>
    <main><%= yield %></main>
  </body>
</html>
This layout inserts a header section from content_for :header and the main content from the view.
Execution Table
StepActionTemplate/MethodContent Stored or RenderedOutput Location
1Controller renders viewshow.html.erbStarts rendering viewN/A
2View calls content_for :headershow.html.erbStores '<h1>Page Title</h1>' in :headerStored for layout
3View renders main contentshow.html.erbRenders '<p>Welcome to the page.</p>'Main yield content
4Layout calls yield :headerlayout.html.erbInserts stored header contentInside <header> tag
5Layout calls yieldlayout.html.erbInserts main contentInside <main> tag
6Final HTML sentlayout.html.erb<html><body><header><h1>Page Title</h1></header><main><p>Welcome to the page.</p></main></body></html>Browser receives full page
💡 All content_for blocks inserted by layout yields; rendering completes.
Variable Tracker
VariableStartAfter Step 2After Step 3After Step 5Final
content_for :headerempty'<h1>Page Title</h1>' stored'<h1>Page Title</h1>' stored'<h1>Page Title</h1>' inserted'<h1>Page Title</h1>' in final HTML
main contentemptyempty'<p>Welcome to the page.</p>' rendered'<p>Welcome to the page.</p>' inserted'<p>Welcome to the page.</p>' in final HTML
Key Moments - 3 Insights
Why does content_for not immediately display content where it is called?
content_for stores content in a buffer for later use by the layout's yield. See Step 2 in execution_table where content is stored, not output.
What happens if the layout does not call yield(:header)?
The stored content_for :header block is never inserted into the final HTML, so it won't appear on the page. See Step 4 where yield :header inserts content.
Can the main content be accessed with yield(:main)?
No, the main content is accessed with yield without arguments. yield(:section) only works for named content_for blocks. See Step 5 where yield inserts main content.
Visual Quiz - 3 Questions
Test your understanding
Look at the execution_table, what content is stored after Step 2?
AEmpty content
B'<p>Welcome to the page.</p>' in main content
C'<h1>Page Title</h1>' in content_for :header
D'<footer>Footer text</footer>' in content_for :footer
💡 Hint
Check the 'Content Stored or Rendered' column at Step 2.
At which step does the layout insert the main content into the page?
AStep 4
BStep 5
CStep 2
DStep 6
💡 Hint
Look for 'Layout calls yield' in the 'Action' column.
If the layout did not call yield :header, what would happen to the header content?
AIt would be lost and not appear in the final HTML
BIt would still appear in the main content area
CIt would cause an error
DIt would appear twice in the page
💡 Hint
Refer to the key moment about missing yield(:header) and Step 4.
Concept Snapshot
Rails layouts wrap views to create full pages.
Use content_for to define named content blocks in views.
Layouts insert these blocks with yield(:name).
Main view content is inserted with yield without arguments.
If layout omits yield(:name), that content is not shown.
This separates page structure from page content.
Full Transcript
In Rails, when a request comes in, the controller runs and renders a view template. The view can define content blocks using content_for, which stores content for later use. The layout template then calls yield or yield with a symbol to insert these stored blocks into the final HTML. For example, content_for :header stores header content, and the layout inserts it with yield :header. The main content of the view is inserted with yield without arguments. If the layout does not call yield for a content_for block, that content will not appear in the final page. This system helps separate the page's structure (layout) from its content (views).