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

Scale website in MMM-EmbedURL

Scheduled Pinned Locked Moved Solved Troubleshooting
5 Posts 2 Posters 712 Views 2 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.
  • G Offline
    gerbenvs
    last edited by sdetweil Jun 11, 2023, 10:19 PM Jun 11, 2023, 8:52 PM

    Hello,
    I use docker version of MM and want to show a URL with the energy consumption figures of my house.
    The URL is shown, but only a small part of it. I added settings in css to change the size of the window, but I want the complete screen(site) to be shown in the window. Is that possible?

    The settings for the module in config.js are:

    {
                            module: "MMM-EmbedURL",
                            position: "bottom_left",
                            header: "P1 Monitor",
                            config: {
                                    updateInterval: 120,
                                    embedElementType: "webview",
                                    basicElementType: "div",
                                    embed: [
                                    {
                                            attributes: [
                                                    "frameborder=0",
                                                    "scrolling=no"
                                            ],
                                            embed:  [
                                                    "http://p1monitor/main-1.php"
                                            ]
                                    },
                                    ]
                            },
                    },
    

    And I made this adjust at the top of the config.js:

    let config = {
            electronOptions: {
                    webPreferences: {
                    webviewTag: true,
                    },e
            },
    

    In custom.css I have added these settings:

    .MMM-EmbedURL .embed .embeded {
        width: 600px;
    }
    

    This is showing on the mirror:
    203c9f69-3eb3-4415-b05a-dd213a5c494d-B6FBFCE0-C43E-4E21-9B97-506BEFE3360A_4_5005_c.jpeg

    So how can I show the entire site in the window of 600px?

    Thanks in advance.

    Regards,
    Gerben

    W 1 Reply Last reply Jun 12, 2023, 11:38 AM Reply Quote 0
    • W Offline
      wishmaster270 Module Developer @gerbenvs
      last edited by Jun 12, 2023, 11:38 AM

      @gerbenvs Hi, I think it might be possible if you add a width and height to the attributes of the webview:

      {
                              module: "MMM-EmbedURL",
                              position: "bottom_left",
                              header: "P1 Monitor",
                              config: {
                                      updateInterval: 120,
                                      embedElementType: "webview",
                                      basicElementType: "div",
                                      embed: [
                                      {
                                              attributes: [
                                                      "frameborder=0",
                                                      "scrolling=no", 
                                                      "width=600px",
                                                      "height=400px",
                                              ],
                                              embed:  [
                                                      "http://p1monitor/main-1.php"
                                              ]
                                      },
                                      ]
                              },
                      },
      
      

      I do not have a chance to test it at the moment but you may want to give it a try.

      G 1 Reply Last reply Jun 25, 2023, 3:03 PM Reply Quote 0
      • G Offline
        gerbenvs @wishmaster270
        last edited by Jun 25, 2023, 3:03 PM

        @wishmaster270 said in Scale website in MMM-EmbedURL:

        “height=400px”,

        Hi wishmaster270,

        Thanks for your reply.
        I did try those options, but they don’t seem to have any impact on the size that is shown.
        Also the scrolling option is not working, because I still see scrolling bars at right side and bottom.

        Adjusting the css will change the size that is shown, but the site is not scaled and only a very small piece is shown.

        W 1 Reply Last reply Jun 25, 2023, 7:24 PM Reply Quote 0
        • W Offline
          wishmaster270 Module Developer @gerbenvs
          last edited by Jun 25, 2023, 7:24 PM

          @gerbenvs Interesting…
          Maybe the page you want to display does not support properly.
          Does it scale down automatically if you display the page in a normal browser, resize the browser window and refresh the page?

          G 1 Reply Last reply Jul 3, 2023, 7:51 PM Reply Quote 0
          • G Offline
            gerbenvs @wishmaster270
            last edited by Jul 3, 2023, 7:51 PM

            @wishmaster270
            The page doesn’t scale automatically, so maybe that’s the issue.

            Now I have used a different module: MMM-WebView, set the width and height in config.js and used the “transform: scale(0.6)” in custom.css to adjust the size. Now the complete website is shown with a proper size.

            Thanks for your help!

            Regards,
            Gerben

            1 Reply Last reply Reply Quote 0
            • 1 / 1
            • 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