Add Image to Layout in Ruby on Rails

Add image to layout in ruby on rails

Anything in the public folder is accessible at the root path (/) so change your img tag to read:

<img src="/images/rss.jpg" alt="rss feed" />

If you wanted to use a rails tag, use this:

<%= image_tag("rss.jpg", :alt => "rss feed") %>

HTML to Ruby on Rails : link and image tags

Well, I believe I've come up with the solution. The image is loading properly, and is linking to the same image which has retained all of the styling from the rel="gallery" attribute.

<%= link_to (image_tag("s-1.jpg")), image_path("s-1.jpg"), rel: "gallery" %>

I'm curious to know if this is the best way to do this, and if not, what are the alternatives.

Rails - how can I display left and right layout for image and its content in every other row

You can use with_index to add classes dynamically to your odd-indexed posts.

Also, please prefer using image_tag instead of using raw HTML to create <img> tag.

<div class="container">
  <% @posts.each.with_index do |post, index| %>
    <div class="images <%= 'images-right' if index.odd? %>"><%= image_tag post.image %></div>
    <div class="images-content <%= 'images-content-right' if index.odd? %>"><%= post.content %></div>
  <% end %>
<div>

Tried it all, still can't get local images to show in HTML pages

Use the assets helpers, favicon_link_tag in this case

favicon_link_tag 'favicon.png'

and image_tag here

image_tag 'navbar-logo.png'

image/photo gallery (grid view) with rails?

This isn't dependent on Rails, as what you're dealing with is simply a matter of your HTML markup.

A table is probably the wrong solution to this problem - at least the way you've laid it out. Table rows (<tr>) cannot be styled to appear next to each other as columns. The common solution here is to use floated divs to display your content in any number of columns you desire. The following code is the same as above, except using divs:

<div id="gallery">
  <% for photo in @photos %>
    <div class="photo">
      <%= link_to image_tag(photo.image.url), photo %>
      <%= link_to photo.name, photo %>
    </div>
  <% end %>
</div>

Then, using just CSS, you can lay out your images as a grid. An example is here:
http://www.alistapart.com/articles/practicalcss/

From there, you can enhance the basic implementation with JQuery or further CSS to taste.

Putting images on the navbar in rails only displays theimage name and not the image

Based on what you have, your code should work. Make sure that you have your image in the

app/assets/images

directory. Also, check to make sure that you have the asset pipeline enabled. Go to

config/application.rb

and see if you have this line:

# Enable the asset pipeline
config.assets.enabled = true

Rails: How to display images in rows rather than one column

You have to use CSS to do what you desire, let's say this is your template:

<h1>Lessons Start Now!</h1>
<% unless @lessons.empty? %>
<ul class="lessons">
<% @lessons.each do |lesson| %>
    <li>
    <%= image_tag(lesson.image, :size => "100x50", :class => "thumbnail") %>
    <p class="subect"><%= lesson.subject %></p>
    </li>
<% end %>
</ul>
<% end %>
<%= link_to 'New Lesson', new_lesson_path %>

And this would be your CSS then:

.lessons {
  /* this is needed for the parent 
     to have height. read more 
     http://css-tricks.com/all-about-floats/
  */
  overflow:hidden;
  /* adjust width of this element
     if its width is not limited by its parent
  width: 300px;
  */
}
    .lessons li {
        /* add margins and paddings as you wish */
        float:left;
    }

---

Related Topics