How to help website users update their browsers
Some of your website users might be using a browser that is outdated or not compatible with your website. To help these users update or install a compatible browser, you can use a Yandex script to set up notifications on your site.
There are two types of notification messages: "outdated browser" and "unsupported browser".
Outdated browser
Users with outdated browsers see the update message every time a page loads. The message is shown on a bar at the top of the page. Clicking this bar opens a popup window with links to the latest versions of popular browsers.
You can choose the minimum browser versions yourself, or rely on the default list maintained by Yandex (more information in the instructions below). If you use your own list, don't forget to keep it updated as new browser versions are released.
A user who closes the notification without updating won't see the reminder again for 30 days by default. You can change this logic by manually configuring the remember
and rememberFor
(Additional parameters table) parameters.
Unsupported browser
If a user's browser isn't supported by your website, the user only sees a message with a link to the latest version of the supported browser. This notification message completely covers the page contents, so the site becomes unusable in a non-compatible browser.
There are two ways to get the notification code:
Generate it using the constructor
Write it yourself
Using the constructor to configure the notification
In the constructor, you can choose:
-
The notification type and language (the
exclusive
andlang
parameters (Main parameters table)). -
The color of the notification bar (the
theme
parameter (Main parameters table)). If only one browser can be used for accessing the site, this parameter is omitted. -
A list of browser versions that you consider outdated (controlled by the
browsers
parameter (Main parameters table)). The list provided by Yandex is used in the constructor by default.The default list is updated from time to time. If you don't have specific requirements for browser versions, you can automatically get the most recent list of outdated versions. To do this, delete the
browsers
parameter from the generated code.
Insert the resulting code on every page of your site, after the opening <body>
tag. For any additional parameters not specified in this code, the script uses the default values.
Configuring the notification yourself
The code for connecting and invoking the script must be inserted after the opening <body>
tag on every page of your site.
Connect the script from the Yandex server:
<script type="text/javascript" src="https://static.yandex.net/browser-updater/v1/script.js" charset="utf-8"></script>
Create a notification object using the ya.browserUpdater.init()
method and pass the notification parameters in the arguments:
<script>var browserUpdater = new ya.browserUpdater.init(notification parameters);</script>
Code sample for outdated browser notification
<script type="text/javascript" src="https://static.yandex.net/browser-updater/v1/script.js" charset="utf-8"></script> <script>var browserUpdater = new ya.browserUpdater.init( { theme: "yellow", lang: "ru", exclusive: false, browsers: { chromium: 35, amigo: "Infinity", iron: 35, flock: "Infinity", palemoon: 25, camino: "Infinity", safari: 5.2, yandexinternet: "Infinity", fx: 31, ie: 9, opera: 16, chrome: 35, maxthon: 4.4, seamonkey: 2.4 }, remember: true, rememberFor: 30, cookiePrefix: "yaBrowserUpdater", classNamePrefix: "ya-browser-updater", jsonpCallback: "yaBrowserUpdaterJSONPCallback", onStripeShow: null, onStripeHide: null }); </script>
Notification parameters
Main parameters
Parameter |
Description |
Acceptable values |
Format |
|
Indicates that only one browser can be used for accessing the site. |
The default value is |
boolean |
|
Color of the notification bar. Ignored if you are using the notification that only one browser can be used for accessing the site. |
The following colors are available: The default value is |
string |
|
Notification language. |
The following languages are available: The default value is |
string |
|
Restrictions for browser versions. If you want to always use the default list that is maintained by Yandex, omit the For some browsers, all versions are considered outdated if you don't specify one of the older versions as the minimum allowed version. Versions can be specified for the following browsers:
|
The supported key values depend on the value of the exclusive=trueThe site is available only for a single browser. You can choose the following browsers: exclusive=falseA list of browser IDs with the minimum versions supported. The version can be defined with a number or the word |
string or object |
Additional parameters
Only used for the outdated browser notification.
Parameter |
Description |
Acceptable values |
Format |
|
Indicates that the The pause lasts for the period specified in the |
The default value is |
boolean |
|
The length of the pause before showing notifications, in days. Applies if the |
The default value is |
number |
|
The name of the cookie installed by the script. If you already set cookies with the name |
Your cookie name. |
string |
|
The prefix in the name of CSS classes generated by the script. If you already use a CSS class with the prefix |
Your prefix for CSS class names. |
string |
|
The name of the JSONP global callback function that will be called after receiving the processed data about the browser. If you already use a callback function with the name |
Your callback function name. |
string |
|
The function that is triggered when the notification bar is displayed. You can use it to transmit information about conversions to Yandex.Metrica or to define the upper page margin so the bar doesn't cover any of the page content. |
The name of the function or the function itself. For example:
The default value is |
string or function |
|
The function that is triggered when the notification bar disappears. You can use it to transmit information about conversions to Yandex.Metrica or to remove the upper page margin. |
The name of the function or the function itself. For example:
The default value is |
string or function |
Color of the notification bar.
Ignored if you are using the notification that only one browser can be used for accessing the site.
Notification language.
Indicates that only one browser can be used for accessing the site.
Restrictions for browser versions. If you want to always use the default list that is maintained by Yandex, omit the browsers
parameter.
Indicates that the yaBrowserUpdateHide
cookie should be created, which records that the site user closed the notification bar and there should be a pause before displaying the notification bar again.
The length of the pause before showing notifications, in days.
The name of the cookie installed by the script.
The prefix in the name of CSS classes generated by the script.
The name of the JSONP global callback function that will be called after receiving the processed data about the browser.
The function that is triggered when the notification bar is displayed.
The function that is triggered when the notification bar disappears.