What you see as the home page is separated into several *.html.erb files:
and they're all put together in the avalon layout: app/views/layouts/avalon.html.erb.
Avalon uses Blacklight for its layout, so if you need to look up how to do something specific to the look, you can search the Blacklight documentation.
An *.html.erb file is just an HTML file with some embedded ruby. Whenever you see a <%= some_code %>, that is ruby code to be executed and will show up on the page. Similarly, <% some_code %> is also ruby code, but will not show anything, just execute.
Here is a snippet from the Indiana University production environment's app/views/modules/_header.html.erb, which you can see here: media.dlib.indiana.edu
The snippet sets up the featured items on the front page.
<div id="featured_content" class="row"> <div class="col-md-4"> <p><%= link_to media_object_path("avalon:6674") do %> <strong>Featured Film</strong> <% end %></p> <p><%= link_to media_object_path("avalon:6674") do %> <%= image_tag "featured/masters.png", alt: "Featured Film", class: 'thumbnail' %> <% end %></p> <p><%= link_to 'The Masters of Disaster (1985)', media_object_path("avalon:6674") %></p> </div> <div class="col-md-4"> <p><%= link_to catalog_index_path('f[collection_ssim][]' => 'IUL Moving Image Archive') do %> <strong>Featured Film Collection</strong> <% end %></p> <p><%= link_to catalog_index_path('f[collection_ssim][]' => 'IUL Moving Image Archive') do %> <%= image_tag "featured/minnieMouse.png", alt: "Featured Video Collection", class: 'thumbnail' %> <% end %></p> <p><%= link_to catalog_index_path('f[collection_ssim][]' => 'IUL Moving Image Archive') do %> Indiana University Libraries Moving Image Archive <% end %></p> </div> <div class="col-md-4 hidden-phone"> <p><%= link_to catalog_index_path('f[collection_ssim][]' => 'Birch Bayh Senatorial Papers') do %> <strong>Featured Audio Collection</strong> <% end %></p> <p><%= link_to catalog_index_path('f[collection_ssim][]' => 'Birch Bayh Senatorial Papers') do %> <%= image_tag "featured/birchBayhHearings.png", alt: "Featured Audio Collection", class: 'thumbnail' %> <% end %></p> <p><%= link_to catalog_index_path('f[collection_ssim][]' => 'Birch Bayh Senatorial Papers') do %> Birch Bayh Senate Hearings <% end %></p> </div> </div> |
The first links to a specific media object using the item's pid, the second links to a search for a collection.
The image_tag looks in app/assets/images/ for its images. We put our pictures into app/assets/images/featured/.