This is working fine to show all the images inside the public folder of my home.blade view at www.mygallery.com
#foreach($items as $item)
<div class="box">
<div class="boxInner">
<img src="{{$item->image}}" alt="{{$item->title}}">
</div>
</div>
#endforeach
By the way this is how my routes file looks like.
Route::get('', array('as'=>'itemshome', 'uses'=>'ItemsController#show_items'));
Route::resource('upload', 'ItemsController');
Route::get('tags/{category?}', array('as'=>'itemstag', 'uses'=>'ItemsController#show_items'));
But when I try to filter results by category (www.mygallery.com/tags/cats) $item->image is trying to reach every image at tags/images/myimage.jpg which of course doesn't exist.
The thing is that I don't want to create a public/tags/images folder, so I wonder how can I explicitly point to the correct folder (public/images) no matter what view/route is making the call.
The problem here is that $item->image is a relative path. So depending on your current URL you will link to different paths.
To generate an absolute URL, use the asset() function:
<img src="{{ asset($item->image) }}" alt="{{$item->title}}">
Related
I am trying to add images so I can see it on my views. I put the folder img inside the public folder and this is the code I am trying to see.
<?php $image = public_path() . './img/logo.png'; // destination path ?>
<h1>Royal <img src="{{$image}}"> Dice</h1>
All I get is this error in the console: Not allowed to load local resource.
I am learning Laravel but I think that this should be easy to solve. Thank you everyone!
Following should work:
<h1>Royal <img src="{{ asset('img/logo.png' }}"> Dice</h1>
You can find more about the asset helper in the laravel documentation: https://laravel.com/docs/8.x/helpers#method-asset
wite like this <h1>Royal <img src="{{ URL::to($image) }}"> Dice</h1>
or
<h1>Royal <img src="{{ asset($image) }}"> Dice</h1>
I am having trouble figuring out a way to reach and display the contents of a folder located in 'public/images'. The goal is to have a blade file that acts as a gallery and displays all the images added to that specific folder.
I know how to access specific files using asset('images/imagename.png') but I need to get all of them at once.
Can I simply create a loop inside of the blade file or do I need to make a controller/route for it?
Try this:
#foreach(File::glob(public_path('images').'/*') as $path)
<img src="{{ str_replace(public_path(), '', $path) }}">
#endforeach
You could do use glob method of the File facade if you know the directory. The following code assumes every file in the public/images/ folder is an image.
<div class="container">
#forelse (File::glob('public/images/*') as $file)
<img src="{{ $file }}">
#else
<p id="no-images">No images in folder</p>
#endforelse
</div>
As the documentation implies, you can get all files in a specific directory with:
Storage::files($directory);
So, you can iterate like this:
#foreach(Storage::files($directory) as $file)
<img src="{{ $file }}">
#endforeach
I am using Laravel to build a Events management system. Users can upload images to be displayed with their event. I have the img tag working on my index.blade.php and assumed I could use the same code on my show.blade.php page, it seems not.
I have the image stored in public/images and I am aware I should use storage for this but I am still learning basics so found this easier for now.
<img style="width:100%" src="images/{{$event->image}}">
As #Frank Ayyaz said you can use a backslash to solve this another Laravel-way is using public_path method which returns the fully qualified path to the public directory.
so you can do something like:
<img style="width:100%" src="{{ public_path('images/'.$event->image) }}">
Please use asset() method. The asset() method is used to include CSS/JavaScript/images files, you can use it as:
{{ URL::asset('images/'.$event->image) }}
<img style="width:100%" src="{{ URL::asset('images/'.$event->image) }}">
You can also use this function for CSS and js.
<link href="{{ asset('css/style.css') }}" rel="stylesheet">
<script src="{{ asset('js/custom.js') }}"></script>
For detail please see this article:
https://medium.com/#zwacky/laravels-url-to-vs-url-asset-fd427ed6f7ef
I suggest Not to use URL::asset but only asset method because sometime URL may cause Problem while showing the image...and use dd() function and check whether u are getting the path i.e Public_path , storage_path() or the custom like the image are stored in public directory..
You may use asset() method of Laravel and use any Prefix whatever you like..
Example:
For static
<img src="{!! asset('assets/images/cams/cam-01.png') !!}" class="img-fluid"
alt="Card image cap">
For Dynamic
<img src="{!! $settings->aws_url.$performer->coverimage !!}" class="img-fluid" alt="Card image cap">
when u use js or css or images u should use {{asset('path')}} to get the resource, it has noting to do with the blade u use, but the resources path.
I want to display avatar in my page but I do not know how to do it. Look, here's my script. It doesn't work. Can you help me?
#foreach($user->user_data as $data)
<img alt="" src="{{ asset('/storage/uploads/avatars/ {{ $data->avatar }} ') }}">
#endforeach
There is a storage_path helper in laravel. Try using this:
#foreach($user->user_data as $data)
<img alt="" src="{{ storage_path('uploads/avatars/' . $data->avatar) }}">
#endforeach
Link to the doc: https://laravel.com/docs/5.5/helpers#method-storage-path
If you have installed Laravel the normal way you can't link to the storage folder directly because it's located outside of the public folder.
Only the contents of the public folder are accessible to the outside world.
There are two ways to work around this limitation, depending on how sensitive the stored data is.
If anyone may access the file, the easiest solution is to create a symlink from inside your public folder to the avatar storage folder.
If the file needs to be protected, create a Controller class that authorises the user and then returns the desired data from the storage_path.
In your case it sounds like solution 1 would suffice, and fortunately for you Laravel has built-in support for this.
By executing the following command in your command line Laravel will create a symbolic link from public/storage to storage/public:
php artisan storage:link
You can then create a link to anything that is stored in storage/public by using the asset function
asset('storage/path_relative_to_storage_public')
For a more detailed explanation, see: https://laravel.com/docs/5.5/filesystem#the-public-disk
In Laravel, code inside {{ }} will be interpreted as php code, You can Try this One :
#foreach($user->user_data as $data)
<img alt="" src="{{ asset('/storage/uploads/avatars/'. $data->avatar) }}">
#endforeach
It's like you do:
<img alt="" src="<?php echo asset('/storage/uploads/avatars/'. $data->avatar); ?>">
I am making a web page on laravel 5, I haven't used laravel since it was at 3 but I really like the new features that it has.
Everything its working fine on an app that it's almost finished, but I have a problem with images.
I am trying to display an image to a view and it's just not showing, I get the little image icon that we all know.
I have used all the methods that I have found on larval docks and in the forums.
including:
assets
URL
HTML (It didn0t work at all)
Direct Url in the view
I am actually using just Artsian serve so the URL would be something like:
http://localhost:8000/uploads/images/posts/1456814127.jpg
The folder its un public folder so in my opinion its the correct url.
With diffrent methos i aslo called the image from the pc path and its the same result. I am using intervention to upload the image by the way.
Any idea?
EDIT:
Ok i tried on localhost of wamp server and the image output worked. I dont know why but it did.
EDIT 2:
I am on laravel Homestead now, and it's still not working. I am angry by this point. Please help me!!
Here it's my Controller:
public function posts()
{
$posts = DB::table('posts')->paginate(3);
//page heading
$title = 'Latest Posts';
return view('frontend.posts.index')->with(compact('posts', 'title'));
}
This it's my view:
<a href="#" class="image">
<img src="{{ asset('uploads/images/posts/'.$post->post_image) }}" class="img-rounded">
<span class="hover-zoom"></span>
</a>
At laravel homestead the output link it's:
http://krubbit.dev/uploads/images/posts/1457074877.jpg
The dir structure of the image location:
-Laravel-dir
-Public
-Uploads
-images
-posts
-1457074877.jpg
Something like this
<img src="{{ asset('uploads/images/posts/1456814127.jpg') }}" />
Please use url funcion of Laravel as shown below
<a href="#" class="image">
<img src="{{url('asset/uploads/images/posts/'.$post->post_image)}}" class="img-rounded">
<span class="hover-zoom"></span>
</a>
Hope this will help..!!