adding link_to with image_tag and image path both

I am trying to replace the tag with link_to in my rails application view. for replacing I have svg icon, text and link all in one tag. Here is below

<a class="navbar-brand" href="index.html"><%= image_tag 'logo.svg', "data-svg-fallback" => image_path('logo.svg'), :align=> "left" ,:style => "padding-right: 5px;" %> My Project </a>

but I failed to convert the above link to rails link_to

Any suggestion would be great This is what I am trying but it is not working

1. <%= link_to '#' do %> My Project<%= image_tag ('logo.svg', "data-svg-fallback" => image_path('logo.svg'), :align=> "left" ,:style => "padding-right: 5px;") %> <% end %> 2. <%= link_to "My Project", home_index_path, :class=> "navbar-brand" do %> <%= image_tag('logo.svg'), "data-svg-fallback" => image_path('logo.svg'), :align=> "left" ,:style => "padding-right: 5px"; %> <% end %>

-------------Problems Reply------------

Remove the space after image_tag.

<%= link_to '#' do %>
My Project <%= image_tag('logo.svg', "data-svg-fallback" => image_path('logo.svg'), :align=> "left" ,:style => "padding-right: 5px;") %>
<% end %>

You need to use asset_path do set the path of your svg inside the data attribute like so

<%= link_to "index.html", class: "navbar-brand" do %>
<%= image_tag "logo.svg", data: { svg_fallback => asset_path("logo.svg") }, align: "left", style: "padding-right: 5px;" %> My Project
<% end %>

Instead of image_path you have to use asseth_path.

Try this:

<%= link_to '#' do %>
My Project <%= image_tag('logo.svg', "data-svg-fallback" => asset_path('logo.svg'), :align=> "left" ,:style => "padding-right: 5px;") %>
<% end %>

Category:html Views:1 Time:2019-02-10

Related post

  • HTML + Button with text and image on it 2010-05-19

    I have a problem in creating a Button with text and image on it. <td> <button type="submit" name="report" value="Report" <?php if($tab == 'Excel') echo "id=\"tab_inactive\""; else echo "id=\"tab_active\"" ; ?>> <img src="images/r

  • Generate PDF in Ruby with tables and images 2011-06-15

    I want do generate a PDF with a huge table, in which are images on certain cells. I've tried Prawn, but the lib doesn't support images in Tables. Then I've tried PDF::Writer but I don't find any solution to place images in tables either. Is there a g

  • Free OCR SDK for .net which can extract text,tables with format and images into Office word document 2011-08-12

    I want to have a free OCR SDK which can extract text, tables with data and images from scanned document files (.tiff,.png etc) and store into Office Word document file. Please help me to short out this issue. I have already done extracting text only

  • ios 5 switch with jQuery and images? 2012-01-19

    I'm looking to build a iOS 5 style ON/OFF switch with jQuery and image(s): Example: I have tried the following tutorial: Problem with that tutorial is while it work it doesn't have the po

  • How to add cell's detailText with left and right alignment (both) in iPhone? 2012-03-01

    I want to take a table the following cells: The_main_cell_text_1 Detail_1 Detail_2 The_main_cell_text_2 Detail_3 Another_Detail_4 How to add cell's detailText with left and right alignment (both)? cell.detailTextLabel.text = [NSString stringWithForma

  • Android How to use Simple Cursor Adapter / Custom Cursor Adapter to load data from database and put in a row with text and image 2014-01-23

    I am trying to customize a list in Android with rows with textviews and image view. There are: Three textviews (TextViewPurpose, TextViewStart, TextViewInfo) I can directly get from the database (purpose, start, info) Two more textviews (TextViewCO2,

  • Copying and pasting objects with text and images from one Publisher document to a second one does not really copy the contents. 2015-02-20

    Original Title: Copy and Paste Hi Copying and pasting objects with text and images from one Publisher document to a second one does not really copy the contents, but rather inserts the elements with random adapted formatting information. Line height

  • Adding UIImage with the same image multiple times and removing it all in one code 2009-11-09

    Im having a bit of trouble right now adding the same image multiple times and removing it all at one time after the gamelooop. I manage to add the image by creating 1 UIImageview for every image but i know thats its not the practical way memory wise

  • Problems with jQuery (datepicker) integration and images path 2011-11-24

    I would like to integrate jQuery-DatePicker in my web application. I downloaded the scrips, the css and the images and put them in the corresponding directories: scripts, css and images. I then defined them in scripts.xhtml: <ui:composition xmlns=

  • Script and image path errors broken on Default.aspx page 2011-05-09

    Simple aspx page, called Default.aspx. Images are broken and script files are not being found. I know these paths are correct because I can copy them to another aspx page that's not called Default.aspx and they work. I'm at a total loss, only thing I

  • How to create .CSV file with string and image in iphone programatically? 2011-06-08

    I want to create a csv file which contains both string and image. I am able to give the input as a strings separated by commas. Ex NSArray *paths = NSSearchPathForDirectoriesInDomains(NSDocumentDirectory , NSUserDomainMask, YES); NSString *documentsD

  • Rails 3 - link_to with image_tag + text 2011-09-14

    <%= link_to ((image_tag 'image.png'), url_for({:controller => 'controller_name', :action => 'action_name'}), :class => 'quick', :remote => true) %> This part of code will generate me image.png as a link. I would need to this image a

  • Check if files with absolute and relative path exists 2009-11-13

    Is there a way to check whether files (with either an absolute or relative path) exists? Im using PHP. I found a couple of method but either they only accept absolute or relative but not both. Thanks. --------------Solutions------------- file_exists(

  • GWT push button with text and image combination 2010-08-25

    Does anybody know of a way to make a push button with text on top of an image? --------------Solutions------------- Well as far as I understand after some investigation, the only way is to implement own CustomButton. Regular HTML <button>s don'

  • XMLHttpRequest: Multipart/Related POST with XML and image as payload 2011-11-24

    I'm trying to POST an image (with Metadata) to Picasa Webalbums from within a Chrome-Extension. Note that a regular post with Content-Type image/xyz works, as I described here. However, I wish to include a description/keywords and the protocol specif

  • Rails: link_to with block and GET params? 2010-04-26

    How can I achieve query string and URL parameters in a link_to block declaration? Right now, I have this, which works: <%= link_to 'Edit', :edit, :type => 'book', :id => book %> The above works, and outputs: http://localhost:3000/books/ed

  • ListView With checkbox and images in android 2010-05-20

    please someone help me about this. i need to implement a list view with checkbox and each item should be assosiated with images. ex: [image1] list_item_1 [checkbox] [image2] list_item_2 [checkbox] ' . . please help me --------------Solutions---------

  • upload file with php and save path to sql 2010-05-21

    Does anyone know any good tutorial on how to upload a file with php and save the files path to a sql server? --------------Solutions------------- To upload a file you need at least a HTML POST form with multipart/form-data encoding. Therein you put a

  • table background image with jQuery and Image Splitting 2010-08-16

    I am trying to show a graph image which is horizontally long. The problem is, by the time user reaches the right end of the image, the y axis scale is not visible to him. I need to split the image somehow so that I can make the y-axis part of the ima

  • selector not working with layout and image view 2011-06-02

    I want to use selector for a layout and image view..But it is not working for me. When I changed image view to imagebutton or button, it works fine. Any help will be greatly appreciated.. Thanks in advance.. here is the xmls I used.. <?xml version

  • Media player in c# with text and images overlay 2011-09-04

    I have just read some discussions about this topic but I didn't find the definitive answer. Is possibile in C# do this: 1) media player that read playlist and could run common video format (mp4) 2) text and images overlay (I'd like to write and put i

  • Google Maps v3 marker with icon and image 2011-11-27

    I'm trying to add markers on my Google Maps V3. I want to have similar markers as on Foursquare, where they join an icon and image (with JS) and create one big marker. Does anybody know how to accomplish this? --------------Solutions------------- Ric

  • Tab control header with text and image wpf 2012-01-06

    Hy I have a tab control and I want to put a Text and above it an image. I tried to put them in a StackPanel, but this is too big and when I resize it the image diseapears. When I click on the xaml code on the image I see only an empty box, but the im

  • IPhone: create view with text and images 2012-01-20

    I want create some view, and add dynamically to it text and images Somebody knows how I can to do it? Thanks --------------Solutions------------- Broad question, but this should get you on the right path: (Pop this into a viewcontroller) -(void)addSt

  • How to make ListView with CheckBox and Image? 2012-02-17

    I use this code for my simple ListView now: final ListView lv = (ListView)findViewById(; lv.setAdapter(new ArrayAdapter<String>(this,android.R.layout.simple_list_item_1, myString.split("\n"))); lv.setOnItemClickListener(new OnIte

Copyright (C), All Rights Reserved.

processed in 0.194 (s). 11 q(s)