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


    Cloudron Forum

    • Register
    • Login
    • Search
    • Categories
    • Recent
    • Tags
    • Popular

    Solved Element custom background

    Matrix (Synapse/Element)
    5
    10
    618
    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.
    • Clipper
      Clipper last edited by

      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 Reply Quote 0
      • nebulon
        nebulon Staff last edited by

        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/

        Clipper 1 Reply Last reply Reply Quote 0
        • Clipper
          Clipper @nebulon last edited by

          @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.

          ruihildt murgero 2 Replies Last reply Reply Quote 0
          • ruihildt
            ruihildt @Clipper last edited by

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

            Clipper 1 Reply Last reply Reply Quote 0
            • murgero
              murgero App Dev @Clipper last edited by

              @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. ~
              Matrix: @murgero:urgero.org

              1 Reply Last reply Reply Quote 1
              • Clipper
                Clipper @ruihildt last edited by

                @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

                murgero 1 Reply Last reply Reply Quote 0
                • murgero
                  murgero App Dev @Clipper last edited by murgero

                  @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. ~
                  Matrix: @murgero:urgero.org

                  1 Reply Last reply Reply Quote 1
                  • girish
                    girish Staff last edited by

                    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 Reply Quote 1
                    • girish
                      girish Staff last edited by

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

                      Clipper 1 Reply Last reply Reply Quote 2
                      • Clipper
                        Clipper @girish last edited by

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

                        1 Reply Last reply Reply Quote 1
                        • First post
                          Last post
                        Powered by NodeBB