Multi Monitor Wallpaper - One click installs

MMW allows wallpaper sites to offer a one-click install which launches MMW and downloads the wallpaper

If the user doesn't have MMW installed, then it prompts them to install. Once they have installed, the wallpaper will automagically download

The user can set a preference as to whether they would like the wallpaper to be instantly applied, or whether they want to edit the layout before applying it

Adding support to your site is incredibly simple. You simply add a script, then provide a single div with the necessary details

On MacOS computers, the users will see a one-click install button

On Windows, they won't see anything at all

Thank you for considering integrating with Multi Monitor Wallpaper. I'd love to see as many integrations as possible, so please let me know if I can help

rob@hobbyistsoftware.com

Instructions

1) Include the required script in your <head> section

<script src="https://hobbyistsoftware.com/js/mmw/mmw_one_click.js" async>

The script loads asynchronously, so it won't slow your website load speed at all 

2) Include the special <div> wherever the button should show

<div class="mmw"
data-mmw-url="URL to download the image"
data-mmw-source="Your Source ID"
data-mmw-title="Image Title"
data-mmw-author="Author Name"
data-mmw-page="URL Where user can view the image">
</div>

Data Attribute Mandatory Value
data-mmw-url Yes

the url to download the image

data-mmw-source No If you have a source id, put it here. Otherwise just skip this
data-mmw-title No The title of your Wallpaper
data-mmw-author No The author of the wallpaper
data-mmw-page No the URL where users can view the image on your site (perhaps with comments, info, etc)

If the data attribute is not mandatory, then you can skip it entirely. Make sure to remove it completely rather than leaving it blank

Examples

Let's try some examples with the Image Below

Photo by Dominik Schröder on Unsplash

Simplest Possible

<div class="mmw"
data-mmw-url="https://hobbyistsoftware.com/images/MultiMonitorWallpaper/dominik-schroder-FIKD9t5_5zQ-unsplash.jpg"
</div>

With all info

<div class="mmw"
data-mmw-url="https://hobbyistsoftware.com/images/MultiMonitorWallpaper/dominik-schroder-FIKD9t5_5zQ-unsplash.jpg"
data-mmw-source="Tutorial"
data-mmw-title="Clouds"
data-mmw-author="Dominik Schröder"
data-mmw-page="https://unsplash.com/s/photos/clouds?utm_source=unsplash&utm_medium=referral&utm_content=creditCopyText">
</div>

Styling

There are two versions, the light and the dark button

To get the light button, just use class="mmw light" in your div

Light   Dark

Windows - Debug mode

On Windows, the buttons don't show at all

If you're developing, then just type

mmw.addButtons(true)
in the console

Click Here to show the buttons on Windows

Or just add the debug class to any of the buttons (this will show all buttons on your page)

<div class="mmw debug"
data-mmw-url="https://hobbyistsoftware.com/images/MultiMonitorWallpaper/dominik-schroder-FIKD9t5_5zQ-unsplash.jpg"
</div>

Thank You - Let me know if I can help

Thank you for considering integrating with Multi Monitor Wallpaper. Please let me know if I can help

rob@hobbyistsoftware.com