Creating Image link with HTML Helper

Question

I'm trying to create an image link with the HTML helper of Laravel 4. But it seems that isn't really working. I have this line of code

{{ HTML::link("#", HTML::image("img/logo.png", "Logo") ) }}

But that just outputs a strin like this:

<img src="http://localhost/worker/public/img/logo" alt="Logo">

How come.??

In laravel {{ $string }} outputs a "safe" string where html symbols like < and > are encoded. Try using {!! $string !!} instead to avoid encoding when needed. See more here: http://stackoverflow.com/questions/29253979/laravel-5-display-html-with-blade — Hop hop, Oct 15 '16 at 05:47

score 35 · Answer 1 · answered Sep 25 '13 at 16:11

I think it's overkill for no reason. I would do:

<a href="#"><img src={{asset('img/logo.png')}} alt="Logo"></a>

If I then need a dynamic link in place of the #, I would do:

<a href="{{URL::to('/')}}"><img src={{asset('img/logo.png')}} alt="Logo"></a>

Try to use html as much as you can.

score 14 · Accepted Answer · answered Sep 25 '13 at 15:50

You probably will have to:

<a href="#">{{ HTML::image("img/logo.png", "Logo") }}</a>

Because, link() uses entities to escape the title:

public function link($url, $title = null, $attributes = array(), $secure = null)
{
    $url = $this->url->to($url, array(), $secure);

    if (is_null($title) or $title === false) $title = $url;

    return '<a href="'.$url.'"'.$this->attributes($attributes).'>'.$this->entities($title).'</a>';
}

Producing this source code:

"<a href="#">&lt;img src=&quot;http://localhost/img/logo.png&quot; alt=&quot;Logo&quot;&gt;</a>"

score 7 · Answer 3 · answered Aug 04 '14 at 16:00

7

You could also use html_entity_decode to get your code working

{{ html_entity_decode( HTML::link("#", HTML::image("img/logo.png", "Logo") ) ) }}

answered Aug 04 '14 at 16:00

Greg

365
1
3
12

1

Excellent! That did the trick for me when trying to use bootstrap's glyphicon such as in `{{ html_entity_decode(Menu::item('home',' Home')) }}` – Pathros Apr 25 '15 at 20:54
1

This seems to be the most "Laravelish" approach? You could also wrap the above code in a custom helper function to clean it up. – PeterG May 06 '15 at 19:33

score 3 · Answer 4 · answered Mar 02 '17 at 06:42

3

HTML helper has been removed from Laravel 5

now you could simple use this

<img src="{{ asset('logo.png') }}" alt="logo">

This asset by default point to public folder of your larval application

answered Mar 02 '17 at 06:42

Shubham Bansal

586
6
7

score 0 · Answer 5 · answered Mar 22 '15 at 09:36

0

Additional to correct answer also you can add some attribute like height and width

<a href="#">{{ HTML::image("img/logo.png", "Logo",array('height'=>'100','width'=>'100')) }}</a>

answered Mar 22 '15 at 09:36

ErcanE

1,571
3
19
28

score 0 · Answer 6 · answered Aug 12 '16 at 11:19

0

\Html::tag('a', \Html::image('image path')->toHtml(), ['href' => 'link']);

answered Aug 12 '16 at 11:19

Anton

1

1

Thanks Anton and welcome to StackOverflow. Can you explain your answer or add a bit more details? This way your answer will be more usefull for people (and get upvotes) – goto Aug 12 '16 at 11:24

Creating Image link with HTML Helper

6 Answers6

Linked