Laravel Home Services Project - Show Appliance Services on Homepage

In this video, we will learn about displaying appliance services on the homepage of our Laravel project.

Let's see how we can show appliance services on the homepage.

To do this, switch to the project and open the HomeComponent.php class file.

Inside the render method, we will fetch services that are related to appliances.

First, we need to get all category IDs that are related to appliance categories.

Write the following code:


$sId = ServiceCategory::whereIn('slug',['ac','tv','refrigerator','geyser','water-purifier'])->get()->pluck('id');

Next, we will fetch all services according to these category IDs.

Write the following code:


$aservices = Service::whereIn('service_category_id',$sId)->inRandomOrder()->take(8)->get();

Now, return the $aservices variable to the component view file.

Go to the home-component.blade.php view file and inside the carousel, add the following code:


<div>
	<div class="container">
		<div class="row">
			<div class="titles">
				<h2><span>Appliance</span>Services</h2>
				<i class="fa fa-plane"></i>
				<hr class="tall">
			</div>
		</div>
	</div>
	<div id="boxes-carousel">  
		@foreach($aservices as $aservice)
		<div>
			<a class="g-list" href="{{route('home.service_details',['service_slug'=>$aservice->slug])}}">
				<div class="img-hover">
					<img src="{{ asset('images/services/thumbnails') }}/{{$aservice->thumbnail}}" alt="{{$aservice->name}}" class="img-responsive">
				</div>

				<div class="info-gallery">
					<h3>{{$aservice->name}}</h3>
					<hr class="separator">
					<p>{{$aservice->tagline}}</p>
					<div class="content-btn"><a href="{{route('home.service_details',['service_slug'=>$aservice->slug])}}"
							class="btn btn-primary">Book Now</a></div>
					<div class="price"><span>$</span><b>From</b>${{$aservice->price}}</div>
				</div>
			</a>
		</div>
		@endforeach                 
	</div>
</div>