• Recent
  • Tags
  • Unsolved
  • Solved
  • MagicMirror² Repository
  • Documentation
  • 3rd-Party-Modules
  • Donate
  • Discord
  • Register
  • Login
MagicMirror Forum
  • Recent
  • Tags
  • Unsolved
  • Solved
  • MagicMirror² Repository
  • Documentation
  • 3rd-Party-Modules
  • Donate
  • Discord
  • Register
  • Login
A New Chapter for MagicMirror: The Community Takes the Lead
Read the statement by Michael Teeuw here.

Add a background image

Scheduled Pinned Locked Moved Solved Development
18 Posts 9 Posters 30.4k Views 13 Watching
Loading More Posts
  • Oldest to Newest
  • Newest to Oldest
  • Most Votes
Reply
  • Reply as topic
Log in to reply
This topic has been deleted. Only users with topic management privileges can see it.
  • A Offline
    Anachor
    last edited by Jul 13, 2016, 4:53 PM

    Works perfect! Thank you so much! Is it possible to add a video as background later or a webcam ?

    1 Reply Last reply Reply Quote 0
    • P Offline
      paviro Admin @Wilco89
      last edited by Jul 13, 2016, 7:22 PM

      @Wilco89 Check out https://github.com/adam-p/markdown-here/wiki/Markdown-Cheatsheet#code! :)

      We're all stories in the end. Just make it a good one, eh?

      – The Doctor

      1 Reply Last reply Reply Quote 0
      • A Offline
        Anachor
        last edited by Jul 13, 2016, 7:27 PM

        Thanks for everything! :blush:

        1 Reply Last reply Reply Quote 0
        • O Offline
          ostfilinchen
          last edited by Oct 11, 2016, 8:38 AM

          Hi all,

          i’ve made an Folder in /home/pi/MagicMirror calld Images and copy in this a file logo.jpeg.

          Next i changed the custom.css like this:
          body {
          background-Image: url(“/Images/logo.jpeg”);
          background-Color: #cccccc;
          }

          But nothing happens. No Error and no Backgroundimage. What’s wrong in the custom.css? Pls help me

          Regards
          Daniel

          S 1 Reply Last reply Oct 11, 2016, 9:23 AM Reply Quote 0
          • S Offline
            strawberry 3.141 Project Sponsor Module Developer @ostfilinchen
            last edited by Oct 11, 2016, 9:23 AM

            @ostfilinchen background-Image: url("../Images/logo.jpeg");

            Please create a github issue if you need help, so I can keep track

            1 Reply Last reply Reply Quote 0
            • O Offline
              ostfilinchen
              last edited by Oct 11, 2016, 9:39 AM

              @strawberry-3-141: that also doesn’t work :-(

              B 1 Reply Last reply Oct 11, 2016, 10:24 AM Reply Quote 0
              • B Offline
                bhepler Module Developer @ostfilinchen
                last edited by Oct 11, 2016, 10:24 AM

                @ostfilinchen Try this one: background-Image: url("Images/logo.jpeg");

                Double-check your capitalization on your path and your file name. That’s burned me more than a couple of times.

                1 Reply Last reply Reply Quote 0
                • O Offline
                  ostfilinchen
                  last edited by Oct 11, 2016, 10:36 AM

                  i have moved the jpeg from Images to css. now it works. The Mirror doesn’t have access to the Folder Images…

                  S 1 Reply Last reply Dec 17, 2016, 5:44 PM Reply Quote 0
                  • J Offline
                    JoeSpencer
                    last edited by Oct 13, 2016, 7:44 PM

                    @Anachor Did you ever find out how to add a webcam as the background?

                    1 Reply Last reply Reply Quote 0
                    • S Offline
                      schwarzbaer @ostfilinchen
                      last edited by Dec 17, 2016, 5:44 PM

                      @ostfilinchen Hi there,
                      I also wanted to add background images to my MM and came across your post. Although it is not very recent, I think it might be a good idea to add the following information:

                      if you want to have additional folders to be available within the Mirror, you need to specify those in the /js/server.js just after the other app.use commands, e.g. :

                      app.use("/Images",express.static(path.resolve(__dirname + "/../Images")));

                      1 Reply Last reply Reply Quote 1
                      • 1
                      • 2
                      • 1 / 2
                      • First post
                        Last post
                      Enjoying MagicMirror? Please consider a donation!
                      MagicMirror created by Michael Teeuw.
                      Forum managed by Sam, technical setup by Karsten.
                      This forum is using NodeBB as its core | Contributors
                      Contact | Privacy Policy