How can I Access to variable in public in laravel

Question

I have a project in Laravel and I want to show a article form my database in index.blade

so in Controller I get the article and keep it in a variable problem is this : the image of that article is not in index.blade and it is in css in public directory so How Can I change it with that image that I've gotten form database? in my css file you can see that image as a url

Contorller

 public function home(Request $request)
{
    $headerIntroduction=Category::where('name','معرفی کسب و کار')->get()->first()->articles()->get()->values()[1];


    return view('app.index',compact('headerIntroduction'));

css

#slider-section, #home-section{
background-image:url(../../images/app/slider/1.jpg);
background-repeat:no-repeat;
background-size:cover;
background-color:#282f1f;
position:relative;
color:#fff;
padding: 130px 0;

}

Answer 1

You can use variables in Laravel's blade templates only if you talk about the view part. So using this variable in css file is not possible.

If you still want to use it. Then you have to use your styles which need your variables in style tag( <style>css</style> , commonly known as inline css) in your index.blade.php file (or any blade file).

I am assuming the image 1.jpg file comes from your article then why won't you use the code below.

<style>
 .backgroundclass
 {
  background-image:url(../../images/app/slider/{{your-article-variable}});
  background-repeat:no-repeat;
  background-size:cover;
  background-color:#282f1f;
  position:relative;
  color:#fff;
  padding: 130px 0;
  }
</style>

Answer 2

You should have your css for beackground-image in the balde file.

<style>
#slider-section, #home-section{
background-image:url({{$headerIntroduction->image}});
background-repeat:no-repeat;
background-size:cover;
background-color:#282f1f;
position:relative;
color:#fff;
padding: 130px 0;
}
</style>

Here image is the name of column in your DB table.