Cloudron makes it easy to run web apps like WordPress, Nextcloud, GitLab on your server. Find out more or install now.


Skip to content
  • Categories
  • Recent
  • Tags
  • Popular
  • Bookmarks
  • Search
Skins
  • Light
  • Cerulean
  • Cosmo
  • Flatly
  • Journal
  • Litera
  • Lumen
  • Lux
  • Materia
  • Minty
  • Morph
  • Pulse
  • Sandstone
  • Simplex
  • Sketchy
  • Spacelab
  • United
  • Yeti
  • Zephyr
  • Dark
  • Cyborg
  • Darkly
  • Quartz
  • Slate
  • Solar
  • Superhero
  • Vapor

  • Default (No Skin)
  • No Skin
Collapse
Brand Logo

Cloudron Forum

Apps | Demo | Docs | Install
  1. Cloudron Forum
  2. Matrix (Synapse/Element)
  3. Element custom background

Element custom background

Scheduled Pinned Locked Moved Solved Matrix (Synapse/Element)
10 Posts 5 Posters 2.9k Views 6 Watching
  • 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.
  • ClipperC Offline
    ClipperC Offline
    Clipper
    wrote on last edited by
    #1

    Hi,

    I'm running a Cloudron on AWS E2 (from marketplace) with a Matrix App and an Element App.

    I'd like to make use of the Element custom branding such as WelcomeBackgroundUrl as per
    Configure auth footer links through Riot config #9297

    But apparently the entire filesystem except /app/data is read-only. Where could I store a background image which would be served (accessible) and not deleted upon package updates ?

    Thanks

    1 Reply Last reply
    0
    • nebulonN Away
      nebulonN Away
      nebulon
      Staff
      wrote on last edited by
      #2

      On Cloudron apps run in a read-only filesystem for the most part. Potential customization files will reside in /app/data
      In your case the config.json can be edited as mentioned in https://docs.cloudron.io/apps/element/

      ClipperC 1 Reply Last reply
      0
      • nebulonN nebulon

        On Cloudron apps run in a read-only filesystem for the most part. Potential customization files will reside in /app/data
        In your case the config.json can be edited as mentioned in https://docs.cloudron.io/apps/element/

        ClipperC Offline
        ClipperC Offline
        Clipper
        wrote on last edited by
        #3

        @nebulon Yes, I know that, and I did 🙂 However what URL could I use for a setting like WelcomeBackgroundUrl that could actually be served by the web server ?

        currently the background image is url("themes/element/img/backgrounds/lake.jpg"), relative to /app/code/. I can upload another background image in /app/data but it will be unreachable. Would it be possible to symlink a new /app/code/themes/custom/ directory to /app/data/themes/ ?

        So that we could set e.g. "welcomeBackgroundUrl": "themes/custom/mynicebg.jpg"
        and upload the file into /app/data/themes/mynicebg.jpg

        Hope it's more clear like that.

        ruihildtR murgeroM 2 Replies Last reply
        0
        • ClipperC Clipper

          @nebulon Yes, I know that, and I did 🙂 However what URL could I use for a setting like WelcomeBackgroundUrl that could actually be served by the web server ?

          currently the background image is url("themes/element/img/backgrounds/lake.jpg"), relative to /app/code/. I can upload another background image in /app/data but it will be unreachable. Would it be possible to symlink a new /app/code/themes/custom/ directory to /app/data/themes/ ?

          So that we could set e.g. "welcomeBackgroundUrl": "themes/custom/mynicebg.jpg"
          and upload the file into /app/data/themes/mynicebg.jpg

          Hope it's more clear like that.

          ruihildtR Offline
          ruihildtR Offline
          ruihildt
          wrote on last edited by
          #4

          @Clipper If it's relative to /app/code, you could try doing ../data/folder/image.jpg.

          ClipperC 1 Reply Last reply
          0
          • ClipperC Clipper

            @nebulon Yes, I know that, and I did 🙂 However what URL could I use for a setting like WelcomeBackgroundUrl that could actually be served by the web server ?

            currently the background image is url("themes/element/img/backgrounds/lake.jpg"), relative to /app/code/. I can upload another background image in /app/data but it will be unreachable. Would it be possible to symlink a new /app/code/themes/custom/ directory to /app/data/themes/ ?

            So that we could set e.g. "welcomeBackgroundUrl": "themes/custom/mynicebg.jpg"
            and upload the file into /app/data/themes/mynicebg.jpg

            Hope it's more clear like that.

            murgeroM Offline
            murgeroM Offline
            murgero
            App Dev
            wrote on last edited by
            #5

            @Clipper You can use an external image, in the following config example, I used minio on my server to change the backround and logo images, I recommend surfer though for the easier upload and sharing of the images.

            (I used the cloudron logo as an example without permissions, copyrights to the cloudron team.)
            (Background from google images)

            config.json:

            
              "disable_custom_urls": true,
              "disable_guests": true,
              "disable_login_language_selector": false,
              "disable_3pid_login": true,
              "brand": "Riot",
              "branding": {
                "welcomeBackgroundUrl":"<external_URL>",
                "authHeaderLogoUrl":"<external_URL>"
              },
              "integrations_ui_url": "https://scalar.vector.im/",
              "integrations_rest_url": "https://scalar.vector.im/api",
            
            

            4d79e6fc-2ff9-4479-9a94-a404fac4c243-image.png

            --
            https://urgero.org
            ~ Professional Nerd. Freelance Programmer. ~

            1 Reply Last reply
            1
            • ruihildtR ruihildt

              @Clipper If it's relative to /app/code, you could try doing ../data/folder/image.jpg.

              ClipperC Offline
              ClipperC Offline
              Clipper
              wrote on last edited by
              #6

              @ruihildt said in Element custom background:

              @Clipper If it's relative to /app/code, you could try doing ../data/folder/image.jpg.

              Yeah... nice try but that would be pretty silly if it worked, as you could access ../data/config.json or even ../../etc/shadow straight from any browser 😉 . There is a good reason why web roots exist.

              I'll go for the external URL as @murgero proposed. However I think it's a horrible idea to rely on external sources. I still like my idea of a /app/code/themes/custom -> /app/data/themes symlink 🙂

              This is by the way exactly how config.json is pulled up:
              /app/code/config.json -> /app/data/config.json

              Thanks

              murgeroM 1 Reply Last reply
              0
              • ClipperC Clipper

                @ruihildt said in Element custom background:

                @Clipper If it's relative to /app/code, you could try doing ../data/folder/image.jpg.

                Yeah... nice try but that would be pretty silly if it worked, as you could access ../data/config.json or even ../../etc/shadow straight from any browser 😉 . There is a good reason why web roots exist.

                I'll go for the external URL as @murgero proposed. However I think it's a horrible idea to rely on external sources. I still like my idea of a /app/code/themes/custom -> /app/data/themes symlink 🙂

                This is by the way exactly how config.json is pulled up:
                /app/code/config.json -> /app/data/config.json

                Thanks

                murgeroM Offline
                murgeroM Offline
                murgero
                App Dev
                wrote on last edited by murgero
                #7

                @Clipper said in Element custom background:

                However I think it's a horrible idea to rely on external sources. I still like my idea of a /app/code/themes/custom -> /app/data/themes symlink

                Yeah - This would be a good bit to have in the next update @girish / @nebulon

                --
                https://urgero.org
                ~ Professional Nerd. Freelance Programmer. ~

                1 Reply Last reply
                1
                • girishG Offline
                  girishG Offline
                  girish
                  Staff
                  wrote on last edited by
                  #8

                  Makes sense, seems easy to fix. There's a new element version available now, so I will fix it up as part of that.

                  1 Reply Last reply
                  1
                  • girishG Offline
                    girishG Offline
                    girish
                    Staff
                    wrote on last edited by
                    #9

                    This is should be fixed now. There is a custom directory /app/data/custom in the latest package.

                    ClipperC 1 Reply Last reply
                    2
                    • girishG girish

                      This is should be fixed now. There is a custom directory /app/data/custom in the latest package.

                      ClipperC Offline
                      ClipperC Offline
                      Clipper
                      wrote on last edited by
                      #10

                      @girish Awesome thank you it works like a charm. Marking as solved.

                      1 Reply Last reply
                      1
                      Reply
                      • Reply as topic
                      Log in to reply
                      • Oldest to Newest
                      • Newest to Oldest
                      • Most Votes


                      • Login

                      • Don't have an account? Register

                      • Login or register to search.
                      • First post
                        Last post
                      0
                      • Categories
                      • Recent
                      • Tags
                      • Popular
                      • Bookmarks
                      • Search