35

I have installed Laravel and began trying to write an app. I made some directories for my assets in the same directory as /app. But when I try to visit an image in my localhost for example: http://localhost/assets/images/image.png

I've also tried it on: http://localhost/app/assets/images/image.png

I ran into the problem when I was trying to set a background image in a view, and it kept going to 404.

This is what my app looks like under app/

->app
->assets
->commands
->config
->controllers
->database
->lang
->models
->start
->storage
->tests
->views
app.txt
routes.php
filters.php

But I get errors about requests. I have double checked that the url is correct.

Symfony \ Component \ HttpKernel \ Exception \ NotFoundHttpException
vikingcode
  • 613
  • 1
  • 8
  • 15
  • 6
    Your assets (and anything else that needs to be hit by a browser directly) need to go in the public/ directory as this should be the document root. The app/ folder is shouldn't be accessible to a browser. – judereid Jul 17 '14 at 03:53

4 Answers4

76

You have to put all your assets in app/public folder, and to access them from your views you can use asset() helper method.

Ex. you can retrieve assets/images/image.png in your view as following:

<img src="{{asset('assets/images/image.png')}}">

Walid Ammar
  • 4,038
  • 3
  • 25
  • 48
  • The syntax {{asset()}} does not work in my case at all. I am using background: url('{{asset('assets/images/image.png')}}') This does not work at all lol. Php syntax errors. Not sure why I keep seeing that syntax when it always returns errors in every context – vikingcode Jul 19 '14 at 23:27
  • 2
    It's not `url('{{asset('assets/images/image.png')}})` !!, curly brackets `{{ 'some string'}}` means `` in blade template engine, and you don't have to call `url` function, `asset` function will return a valid url to your image, please try the exact code in my post above without adding anything. – Walid Ammar Jul 20 '14 at 00:20
  • and don't forget to put all assets in `app/public/assets` folder. – Walid Ammar Jul 20 '14 at 00:20
  • @MohammadWalid It's an old comment, I know, but I thought I'd point out that @vikingcode was reffering to the CSS function `url()`. As in, he is echoing this into a `style="{{}}"` attribute. – User Aug 04 '17 at 15:40
  • Thanks for your answer, but if I need this in innerHTML? – Muddasir23 May 21 '20 at 19:20
6

You have to do two steps:

  1. Put all your files (css,js,html code, etc.) into the public folder.
  2. Use url({{ URL::asset('images/slides/2.jpg') }}) where images/slides/2.jpg is path of your content.

Similarly you can call js, css etc.

clemens
  • 16,716
  • 11
  • 50
  • 65
Navendu Kumar
  • 91
  • 1
  • 1
4

Besides put all your assets in the public folder, you can use the HTML::image() Method, and only needs an argument which is the path to the image, relative on the public folder, as well:

{{ HTML::image('imgs/picture.jpg') }}

Which generates the follow HTML code:

<img src="http://localhost:8000/imgs/picture.jpg">

The link to other elements of HTML::image() Method: http://laravel-recipes.com/recipes/185/generating-an-html-image-element

Javier Albadan
  • 41
  • 1
  • 1
0

{{ asset('js/jquery.min.js') }} //Full Path http://127.0.0.1:8000/images/slides/2.jpg Do Not Add Public folder name

Abdul Bari
  • 1
  • 1
  • Your answer could be improved with additional supporting information. Please [edit] to add further details, such as citations or documentation, so that others can confirm that your answer is correct. You can find more information on how to write good answers [in the help center](/help/how-to-answer). – Community Jul 25 '22 at 08:51