Unsplash Images as Background option #69

Activity

1. GammaPi commented on Mar 27, 2020

   

   GammaPi

   on Mar 27, 2020

   Last edited by GammaPi

   More actions

   @KodeStar @anoma @Futos

   There's a quick and dirty solution:

   1. Find this file /var/www/localhost/heimdall/app/Providers/AppServiceProvider.php
   2. Find the following code

   $alt_bg = '';
               if($bg_image = Setting::fetch('background_image')) {
                   $alt_bg = ' style="background-image: url(/storage/'.$bg_image.')"';
               } 
   

   3. Modift alt_bg to an image api such as unsplash/bing whatever...

    $alt_bg = '';
               if($bg_image = Setting::fetch('background_image')) {
                   // $alt_bg = ' style="background-image: url(/storage/'.$bg_image.')"';
                   $alt_bg = ' style="background-image: url(https://source.unsplash.com/collection/962362/daily)"';
               }  
   

   4.Refresh the page

   👍React with 👍6Reacted by Raf, ThinkPadNL, Tom Collis, Adam Piontek, MikeYEG and CircuitGuy
2. apiontek commented on May 28, 2020

   

   apiontek

   on May 28, 2020

   More actions

   Just as an additional trick, to make sure the background properly fills/fits when the random image is too big or too small, add the css background-size: cover; so it looks like:

   $alt_bg = '';
       if($bg_image = Setting::fetch('background_image')) {
           // $alt_bg = ' style="background-image: url(/storage/'.$bg_image.')"';
           $alt_bg = ' style="background-image: url(https://source.unsplash.com/daily); background-size: cover;"';
       }
3. linuxserver

   locked and limited conversation to collaborators on Mar 13, 2022
4. KodeStar

   converted this issue into a discussion #726 on Mar 13, 2022