This question already has answers here:
Laravel Displaying image from database
(7 answers)
Closed 3 years ago.
I want to retrieve images from database an display them in webpage directly, how can I make a path?
Here's my view
#foreach($dw as $ad)
<!-- single product -->
<div class="col-lg-4 col-md-6">
<div class="single-product">
{{-- {{$ad->image}} --}}
<img class="img-fluid" src="{{($ad->image)}}" alt="">
<div class="product-details">
<h5>{{$ad->jobC}}</h5>
<div class="price">
<h6>{{$ad->jobtype}}</h6>
<p>{{$ad->details}}</p>
</div>
<div class="prd-bottom">Send Your CV</div>
</div>
</div>
</div>
#endforeach
Controller Method
public function jaa(Request $request)
{
$de = diligent::all();
$de->image = $request->image;
return view('jobs')->with('dw', $de);
}
How can I display the image? I tried this and it only shows the file name
asset() - Generate a URL to an application asset.
<img class="img-fluid" src="{{ asset('images/' . $ad->image) }}" />
Try this
{{-- {{$ad->image}} --}}
<img class="img-fluid" src="{{ asset('storage/' . $ad->image) }}" alt="">
Make sure to symlink your storage folder as well
php artisan storage:link
Related
I am trying to display the single image in the slider, but whenever the user will click on this then it's open a popup in data-src="multiple-images-here" where I am running the slider. But the main issue is with the single image display in for loop. It displays all the available images in the loop. Please suggest me the best solution for this.
Here is my index.blade.php file where I am trying to display the slider using this code.
<div class="container-fluid margin-gallery d-lg-block d-block position-relative">
<div class="row">
<div class="col-lg-12 p-0">
<div class="demo-gallery">
#php
if($propertys->propertyImage!=null){
$images = json_decode($propertys->propertyImage->image_path, true);
}
else{
$images=null;
}
#endphp
<?php
$images_prop = collect($images['property_images']);
?>
<ul id="lightgallery">
#if($images['property_images']!=null)
#forelse($images_prop as $img)
<li class="sizing-li position-relative" data-src="{{ asset($img) }}">
<a href="javascript:void()">
<img class="img-responsive" src="{{ asset($img) }}" style="width:929px; height:495px;">
</a>
</li>
#empty
#endforelse
#endif
</ul>
</div>
</div>
</div>
</div>
I want to display the first image from for loop here
<img class="img-responsive" src="{{ asset($img) }}" style="width:929px; height:495px;">
You can pass ->first() function to get only 1 images, It will show you only the first item from your data in database.
i am trying to display an image which is located in storage/app/uploads. I already run the "php artisan storage:link" command and it was a success but its still not showing. When i also inspect the code in the browser the image is there together with the path. 'Upload' is linked to the image path.
#foreach($user->posts as $post)
<div class="col-4">
<img class="w-100" src="/storage/{{ $post->image }}">
</div>
#endforeach
Try this solution:
use asset(), its get files from public folder
#foreach($user->posts as $post)
<div class="col-4">
<img class="w-100" src="{{ asset('images/' . $post->image) }}">
</div>
#endforeach
you have 2 options either use the direct url or asset method--
#foreach($user->posts as $post)
<div class="col-4">
<img class="w-100" src="{{ asset(yourpath) }}">
</div>
#endforeach
OR
#foreach($user->posts as $post)
<div class="col-4">
<img class="w-100" src="{{ url(yourpath) }}">
</div>
#endforeach
your path would be after the storage directory in public directory.
I'm trying to show all images on my storage/app/livros folder on a view with this code below, but I get this . How can I show these images?
#extends('layouts.app_cad_livros')
#section('content')
<div class="textocs">
<br>
<h3>LIVROS</h3>
</div>
<div class="card_livro">
#foreach($livro as $mostra)
{{$mostra->users_id}}
<img src="{{ url("storage/app/livros{$mostra->image}") }}"
style="max-width=100px;">
TÍTULO {{$mostra->namel}}<br>
AUTOR {{$mostra->autor}}<br>
EDITORA {{$mostra->editora}}<br>
CATEGORIA {{$mostra->categoria}}<br>
CLASSIFICAÇÃO {{$mostra->classificação}}<br>
DESCRIÇÃO {{$mostra->descricao}}<br>
CAPA {{$mostra->image}}<br>
#endforeach
</div>
<a href="{{ url('/alugar', $mostra->users_id)}}">
<button class="btn btn-primary">quero alugar</button>
</a>
#endsection
this is the
<img src="{{ url("storage/{$mostra->image}") }}" style="max-width=100px;">
You need to run the command:
php artisan storage:link
and to access the image:
asset('storage/app/path/to/image')
try this
asset('storage/app/livros/'.$mostra->image.')
or
asset('storage/app/livros/{$mostra->image}')
You can get more info From Here
I want to make a slider dynamic in the Php Laravel framework. there is 4 image that is sliding, title and description are fixed on each sliding...
View:-
<div id="slider" class="nivoSlider">
#foreach($sliders as $slider)
<div class="aaa">
<img src="{{ asset('/uploads/')}}/{{$slider->background_image }}" data-thumb="{{ asset('/uploads/')}}/{{$slider->background_image }}" alt="" height="615px" width="1263px">
<div class="pra">
<h1>{{$slider->title}}</h1>
<p>{{$slider->description}}
</p>
<div class="btn-1">
Contact US
</div>
</div>
</div>
#endforeach
`
Controller:-
public function index(){
$sliders=home1::all();
return view('User.userdashboard',compact('sliders'));
}`
Route:-
Route::get('/',['as'=>'construction','uses'=>'User\UserController#index']);
Actual Design of slider:-
<div id="slider" class="nivoSlider">
<div class="aaa">
<img src="images/banner-1.jpg" data-thumb="images/toystory.jpg" alt="" />
</div>
<div class="aaa">
<img src="images/banner-2.jpg" data-thumb="images/up.jpg" alt=""/>
<div class="pra">
<h1> The Best Business Support</h1>
<p>
Preparing your money is a daunting challenge for today's investors.</p>
<div class="btn-1">
Contact US
</div>
</div>
</div>
<div class="aaa">
<img src="images/banner-3.jpg" data-thumb="images/walle.jpg" alt="" data-transition="slideInLeft" />
</div>
<div class="aaa">
<img src="images/banner-4.jpg" data-thumb="images/nemo.jpg" alt="" />
</div>
</div>
`
I don't understand where to start the foreach loop so that only images are slide
when I add another data from admin panel with column 'image','title', 'description'
the images are showing perfectly but title and description are overwrite
please help me in sorting out this problem
actually in your controller you get a collection under $sliders variable. $sliders=home1::all();.
You said that your home1 Model have some columns like 'image', 'title', 'description'.
So in your blade file you are getting $sliders because the compact('slides') instruction.
In that way your should be able to loop through $slidersjust like as you are referencing in your question:
#foreach ($sliders as $slider)
<div class="aaa">
<img src="{{ asset('/uploads/')}}/{{$slider->background_image }}"
data-thumb="{{ asset('/uploads/')}}/{{$slider->background_image }}"
alt="" height="615px" width="1263px">
<div class="pra">
<h1>{{$slider->title}}</h1>
<p>{{$slider->description}}</p>
<div class="btn-1">
Contact US
</div>
</div>
</div>
#endforeach
Here $slider contains each object from $sliders collection so you should see its own title and description alongside the image field.
You could test what $sliderscontains by dumping the collection in your blade file, using {{ dd($sliders) }}.
Regards.
This question already has answers here:
How to concatenate strings in twig
(11 answers)
Closed 5 years ago.
I've got a project written in PHP in which I am using Symfony framework. This piece of code from Twig template doesn't work.
{% for restaurant in restaurants %}
<div class="col-md-3 col-sm-6 hero-feature">
<div class="thumbnail restaurant-thumbnail">
<img src="{{ asset('build/images/'.'image1.8e9b4ad0.jpg') }}" alt="cannot load image" class="restaurant-image">
<div class="caption">
<h3>{{ restaurant.getName() }}</h3>
<p>{{ restaurant.getShortDescription() }}</p>
<p>
Buy Now! Więcej informacji
</p>
</div>
</div>
</div>
{% endfor %}
When I change this
<img src="{{ asset('build/images/'.'image1.8e9b4ad0.jpg') }}"
to that:
<img src="{{ asset('build/images/image1.8e9b4ad0.jpg') }}"
code works. I don't know why.
plz try it
<img src="{{ asset('build/images/') }}{{'image1.8e9b4ad0.jpg'}}" alt="cannot load image" class="restaurant-image">
if you want to use Variable
<img src="{{ asset('build/images/') }}{{variable}}" alt="cannot load image" class="restaurant-image">