I'm new to Laravel, but why the hell is this not working?
<img src='../img/netflix_logo.png' />
I've tried using php artisan storage:link and it said The [C:\xampp\htdocs\laravel-crud\public\storage] link has been connected to [C:\xampp\htdocs\laravel-crud\storage\app/public]. The links have been created. but the image is still not displaying in my .blade page..
If you image is in storage/img then
<img src="{{ url('storage/img/netflix_logo.png') }}" alt="" title="" />
If you image is in public/img folder then
<img src="{{ URL::to('/') }}/img/netflix_logo.png" alt="" title="" />
You probably need to use the "asset" helper from laravel/blade:
asset('/path/of/your/image')
It's the common way to call a static file from public folder (including storage if you already linked it)
Related
I am trying to display a row from my database by id, the data displayed successfully but the image doesn't show (showing a broken link icon).
Here is the index.blade.php where the href to the row:
<a href="singlepost/{{$products->id}}">
<img src="storage/{{$templates->image_path2}}">
The route:
Route::get('/singlepost/{id}', 'App\http\controllers\TemplatesController#getPostById')->name('single.post');
The function getPostById
public function getPostById($id){
$products = DB::table('templates')->where('id', $id)->first();
return view('singlepost', compact('products'));
}
The singlepage.blade.php
<div class="row">
<div class="col-lg-4">
<img src="storage/{{$products->image_path}}">
</div>
<div class="col-lg-7">
<h2>{{$products->name}}</h2>
<p>{{$products->description}}</p>
</div>
</div>
When referencing publically accessible files, you want to do so from the /public/storage directory. Files from the /storage/app/public directory should be mapped from this directory to /public/storage using a symbloic link,
You create the symlink using:
php artisan storage:link
With that done, assets in /storage/app/public can now be accessed as if they existed in /public/storage. Use the asset helper to get your image.
<img src="{{ asset($templates->image_path2) }}" alt="Some alt tag ..." />
The above assumes a relative path of the asset from the /public/storage root, if you had the image in a subdirectory you would need to include that too.
For example, if you had your images in an img subdirectoy:
<img src="{{ asset('/img/' . $templates->image_path2) }}" alt="Some alt tag ..." />
I have also used \ or
/ but not effective.
Blade
<img src="{{ public_path('images\about.jpg') }}">
PATH
-public
-images
-about.jpg
Using inspect element the link looks fine:
<img src="C:\xampp\htdocs\acc\public\images\about.jpg">
The asset() function is usually used to access the files in public directory of Laravel Application:
<img src="{{ asset('images/about.jpg') }}" alt="some description here">
The public_path() function returns the absolute path for a file which doesn't apply in this case.
I am trying to show stored images in img element. I have saved an image by using a Laravel built-in function.
$path = $request->file('image')->store('avatars');
According to the above script, the images are saving to:
Storage > app > avatars
I also tried saving them here:
Storage > app > public > avatars
Afterward, I used the Artisan command: php artisan storage:link
And then in the front end:
<img src="{{ url('storage/'.$Product->image) }}" width="30" height="30"/>
<img src="{{ asset('storage/'.$Product->image) }}" width="30" height="30"/>
<img src="{{ asset($Product->image) }}" width="30" height="30"/>
<img src="{{ asset('public/storage/'.$Product->image) }}" width="30" height="30"/>
However, the image is still not displayed. Can someone kindly let me know where I'm wrong so that I can fix it? I would appreciate that.
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 have been seriously been looking at this forever! I'm going out of my mind And can't figure out why my images are not displaying in my custom made footer.
I have firefox with firebug and it is simply saying that the url is failing to load. so I copy and pasted a url to an image that is currently working and is being shown via the background property in CSS just fine. (thats the top one that says dakota jones). copy and pasting the exact img src proves it still not to work.
my folder is images. My functions.php is right outside. the hierarchy is correct. what the heck?? The testing text in the p tags work just fine. uhuhuhu
Somebody help me! I'm using wp and genesis theme.
add_action('genesis_before_footer', 'include_sponsors');
function include_sponsors() { ?>
<div class="sponsors">
<p>This is testing text</p>
<img src="images/dakotajonesheader3.jpg" alt="Smiley face" height="42" width="42" />
<img src="images/tfobw.png" />
<img src="images/basskingbw.png" />
<img src="images/bighawgbw.png" />
<img src="images/kbw.png" />
<img src="images/mccoybw.png" />
<img src="images/nfcbwpng" />
<img src="images/rayjusbw.png" />
<img src="images/rrbw.png" />
</div>
<?php }
Use WordPress' inbuilt function:
<?php
bloginfo('template_directory'); ?>/images/dakotajonesheader3.jpg
?>
.. which will reference /wp-content/themes/your-theme/images/dakotajonesheader3.jpg
Wordpress dynamically rewrites URLs, so the URL you use to access a page is not the same as the path to the scripts that are running on the server. So you might request your page with example.com/Home. But your images are not stored in example.com/Home/images, which is where you're telling your browser to look. They're stored in example.com/wordpress/wp-content/themes/your_theme/images. So you have to give the absolute path to the images to the browser in your <img> tags.
Carson is correct, and you can use absolute paths to your images. Alternatively, if you want to avoid using absolute paths, you can call your images using bloginfo('template_directory');
For example:
<img src="<?php bloginfo('template_directory'); ?>/images/dakotajonesheader3.jpg" alt="Smiley face" height="42" width="42" />