Scan widget on your own website

[arnoud]

To include the scan widget on your own website, please log in to your partner dashboard and select the "Scan widget" tab. Here you can select the desired options and copy the generated HTML code or shortcode (in combination with our WordPress or Joomla plugin) to your own web page.

The scan widget ensures that initially:

1. The required Cascading Style Sheet is added to the <header>
   
2. All text appears in the selected language;
   
3. Optionally, an input field for a reference code is shown with the specified label;
   
4. Optionally, the specified URL parameter or specified fixed value is taken as a reference code;
   
5. The correct text will be shown on the scan button (depending on the scan mode);
   
6. The available other scan options will be shown on mouse-over;
   
7. The "More information" link is added next to the scan button;
   
8. The disclaimer line is shown beneath the scan button;
   
9. A hidden link is added to the word "scan" in the disclaimer so that partners simply perform a scan in the partner mode;
   
10. Optionally, the ScanCircle speedometer is shown.
    

And after pressing the scan button, another scan option or the hidden link:

1. The content of any input fields are combined to form a reference code, optionally preceded by the indicated category;
   
2. It checks whether the reference code is required and meets the specified format;
   
3. The reference code is exchanged with the scan program (if possible) or via the database;
   
4. In MSIE/Edge1, it examines whether the correct .NET version is already available and if not offers a download option;
   
5. It examines which action is to be taken:
   
   1. Install the app from the Microsoft Store (change the label to "Opening Store ..." during 10 sec);
      
   2. Launch the app with the selected parameters (change label text to "Staring app ..." during 10 sec);
      
   3. The executable for .NET4 / Windows 8+ (change the label to "Downloading scanner ..." with 3 dots during 10 sec);
      
   4. The executable for .NET2 (change the label to "Downloading scanner .." with 2 dots during 10 sec);
      
6. Then the text of the "More Information" link will change to "Did it not work?".
   

A few notes:

1. Enter the address of your own scan page as "Own scan page" so that the links in the e-mail to registered users and social media posts refer to it;
   
2. The best option is to include a ScanCircle logo on your homepage (http://www.scancircle.com/scancircle.png) and link this to the scan page on your website, explaining what the scan do, why you use it and that you can help solve problems;
   
3. If you want to give the elements a different color, font, size or place, you can use the following CSS elements (use !Important to override the default value):
   • #scancircle_button the scan button;
     
   • #scancircle_dropdown the other scan options on mouse-over on the scan button;
     
   • #scancircle_info: the more information link;
     
   • #scancircle_terms: disclaimer (make sure it is always visible);
     
   • #scancircle_hidden: the hidden "scan" link in the disclaimer (make sure the link and pointer is always hidden);
     
   • #scancircle_prompt: the label for the input field;
     
   • #scancircle_refcode: the contents of the input field;
     
   • #speedometer: the speedometer div;
     
4. If JavaScript is disabled on your computer or HTTPS does not work, then you will only see the link "ScanCircle" which links to the scan page in your partner environment (without HTTPS);
   
5. On scancircle.com nearly the same code is used, but it also works if JavaScript is disabled.