In this video we are going to learn about how to Make On Sale Carousel Dynamic.
You can see on home there is a on Sale Carousel.
Now let see how can we make this On Sale Carousel Dynamic.
So switch to the project and open HomeComponent.php Class File.
Now inside the render method lets fetch products which are on sale.

$sproducts = Product::where('sale_price','>',0)->inRandomOrder()->get()->take(8);

Now lets return this sproducts to the view.

return view('livewire.home-component',['sproducts'=>$sproducts])->layout('layouts.base');

Now open home-component.blade.php view file.
Inside this file lets find the On Sale Carousel and the following code.

@if($sproducts->count() > 0)
<div class=\"wrap-show-advance-info-box style-1 has-countdown\">
	<h3 class=\"title-box\">On Sale</h3>
	<div class=\"wrap-countdown mercado-countdown\" data-expire=\"2021/02/27 12:34:56\"></div>
	<div class=\"wrap-products slide-carousel owl-carousel style-nav-1 equal-container \" data-items=\"5\" data-loop=\"false\" data-nav=\"true\" data-dots=\"false\" data-responsive='{\"0\":{\"items\":\"1\"},\"480\":{\"items\":\"2\"},\"768\":{\"items\":\"3\"},\"992\":{\"items\":\"4\"},\"1200\":{\"items\":\"5\"}}'>
		@foreach ($sproducts as $sproduct)
		<div class=\"product product-style-2 equal-elem \">
			<div class=\"product-thumnail\">
				<a href=\"{{route('product.details',['slug'=>$sproduct->slug])}}\" title=\"{{$sproduct->name}}\">
					<figure><img src=\"{{ asset('assets/images/products') }}/{{$sproduct->image}}\" width=\"800\" height=\"800\" alt=\"\"></figure>
				</a>
				<div class=\"group-flash\">
					<span class=\"flash-item sale-label\">sale</span>
				</div>                        
			</div>
			<div class=\"product-info\">
				<a href=\"{{route('product.details',['slug'=>$sproduct->slug])}}\" class=\"product-name\"><span>{{$sproduct->name}}</span></a>
				<div class=\"wrap-price\"><ins><p class=\"product-price\">${{$sproduct->sale_price}}</p></ins> <del><p class=\"product-price\">${{$sproduct->regular_price}}</p></del></div>
			</div>
		</div>
		@endforeach
	</div>
</div>
@endif

Now its done, so lets check it.
So switch to the browser and refresh the page.
Now you can see here on sale carousel there is no any product.
So lets edit the product and add sale price.
So first of all login with admin credentials.
Now click on all products.
Now lets edit first product and add here the sale price.
Lets add the sale price 120 now click on update.
Now lets show the Sale Price on All Products page.
So lets open the admin-product-component.blade.php view file and inside the table add header.

<th>SalePrice</th>

Now inside the table body add the following code.

<td>{{$product->sale_price}}

Ok now save it and switch the browser and refresh the page
And now you can see the sale price inside the table.
Now edit more produts and add sale price in some products.
After adding the sale price on some products lets check the carousel on home page.
So click on home link.
And here you can see products are now showing on sale carousel.
Alright, Now click on any product inside the on sale carousel.
And inside the product details page here sale price is not showing its showing only the regular price.
So lets make some change inside the product details component view file.
Open details-component.blade.php file add the following code.

@if($product->sale_price > 0)
<div class=\"wrap-price\"><span class=\"product-price\">${{$product->sale_price}}</span>
<del><span class=\"product-price salep\">${{$product->regular_price}}</span></del></div>
@else
<div class=\"wrap-price\"><span class=\"product-price\">${{$product->regular_price}}</span></div>
@endif

For Sale price add some css.
    
<style>
.salep {
    font-family: 'Lato', san-serif;
    font-weight: 300;
    font-size: 13px !important;
    color: #aaaaaa !important;
    text-decoration: line-through;
    padding-left:10px; 
}
</style>

Now its done so lets check it.
So switch to the browser and refresh the page.
And here you can see the sale price.
Now lets try another product.
Ok all working good.
In next tutorial we will make on sale timer dynamic.
So in this way you can Make On Sale Carousel Dynamic so that's all about Making On Sale Carousel Dynamic.