### Install Toastify.js via NPM or Yarn

Source: https://github.com/apvarun/toastify-js/blob/master/README.md

Instructions for installing the Toastify.js library using package managers like NPM or Yarn.

```bash
npm install --save toastify-js
```

```bash
yarn add toastify-js -S
```

--------------------------------

### Add Toastify.js to HTML via CDN

Source: https://github.com/apvarun/toastify-js/blob/master/README.md

Includes the necessary CSS and JavaScript files for Toastify.js using CDN links for traditional HTML page integration.

```html
<link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/toastify-js/src/toastify.min.css">
<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/toastify-js"></script>
```

--------------------------------

### Basic Toast Notification

Source: https://github.com/apvarun/toastify-js/blob/master/README.md

Demonstrates the basic usage of Toastify.js to display a simple toast message with common options like duration, destination, and styling.

```javascript
Toastify({
  text: "This is a toast",
  duration: 3000,
  destination: "https://github.com/apvarun/toastify-js",
  newWindow: true,
  close: true,
  gravity: "top", // `top` or `bottom`
  position: "left", // `left`, `center` or `right`
  stopOnFocus: true, // Prevents dismissing of toast on hover
  style: {
    background: "linear-gradient(to right, #00b09b, #96c93d)",
  },
  onClick: function(){}
}).showToast();
```

--------------------------------

### Import Toastify.js and CSS

Source: https://github.com/apvarun/toastify-js/blob/master/README.md

How to import the Toastify.js library and its default CSS into your JavaScript module.

```javascript
import Toastify from 'toastify-js'
import "toastify-js/src/toastify.css"
```

--------------------------------

### Toastify-JS API Options

Source: https://github.com/apvarun/toastify-js/blob/master/README.md

This section details the available options for configuring Toastify-JS notifications. Each option allows for customization of the toast's appearance, behavior, and interaction.

```APIDOC
Toastify-JS Configuration Options:

- text (string): Message to be displayed in the toast. Defaults to "Hi there!".
- node (ELEMENT_NODE): Node to be mounted inside the toast. Takes precedence over `text`.
- duration (number): Duration in milliseconds for which the toast should be displayed. Use -1 for a permanent toast. Defaults to 3000.
- selector (string | ELEMENT_NODE): ShadowRoot, CSS Selector, or Element Node on which the toast should be added. Defaults to 'body'.
- destination (URL string): URL to which the browser should be navigated on click of the toast.
- newWindow (boolean): Determines whether the `destination` should be opened in a new window. Defaults to false.
- close (boolean): Shows or hides the close icon. Defaults to false.
- gravity ("top" or "bottom"): Specifies the toast's vertical alignment. Defaults to "top".
- position ("left" or "right"): Specifies the toast's horizontal alignment. Defaults to "right".
- backgroundColor (CSS background value): Deprecated. Use `style.background` option instead. Sets the background color of the toast.
- avatar (URL string): Image/icon to be shown before the text.
- className (string): Allows providing a custom class name for further customization.
- stopOnFocus (boolean): Stops the timer when hovered over the toast (only if duration is set). Defaults to true.
- callback (Function): Invoked when the toast is dismissed.
- onClick (Function): Invoked when the toast is clicked.
- offset (Object): Allows adding an offset to the toast's position.
- escapeMarkup (boolean): Toggles the default behavior of escaping HTML markup. Defaults to true.
- style (object): Use HTML DOM Style properties to add any style directly to the toast.
- ariaLive (string): Announces the toast to screen readers. Options include 'polite' (default) and 'assertive'. See https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/ARIA_Live_Regions for options.
- oldestFirst (boolean): Sets the order in which toasts are stacked on the page. Defaults to true.

Deprecated Properties:
- backgroundColor: Use `style.background` option instead.
```

--------------------------------

### Toast with Custom Classes

Source: https://github.com/apvarun/toastify-js/blob/master/README.md

Shows how to apply custom CSS classes to a toast notification for specific styling, such as indicating information or warnings.

```javascript
Toastify({
  text: "This is a toast",
  className: "info",
  style: {
    background: "linear-gradient(to right, #00b09b, #96c93d)",
  }
}).showToast();
```

--------------------------------

### Basic Toast Notification

Source: https://github.com/apvarun/toastify-js/blob/master/index.html

This snippet demonstrates the basic usage of Toastify JS to display a simple toast message with a specified text and duration. It initializes the Toastify library and calls the `showToast()` method.

```javascript
Toastify({
  text: "This is a toast",
  duration: 3000
}).showToast();
```

--------------------------------

### Google Analytics Integration

Source: https://github.com/apvarun/toastify-js/blob/master/index.html

This code snippet shows how to integrate Google Analytics with a web page using the provided JavaScript code. It initializes Google Analytics tracking by creating a tracker and sending a pageview event.

```javascript
(function (i, s, o, g, r, a, m) { i['GoogleAnalyticsObject'] = r; i[r] = i[r] || function () { (i[r].q = i[r].q || []).push(arguments) }, i[r].l = 1 * new Date(); a = s.createElement(o), m = s.getElementsByTagName(o)[0]; a.async = 1; a.src = g; m.parentNode.insertBefore(a, m) })(window, document, 'script', 'https://www.google-analytics.com/analytics.js', 'ga');
ga('create', 'UA-105870436-1', 'auto');
ga('send', 'pageview');
```

--------------------------------

### Toast with Offset

Source: https://github.com/apvarun/toastify-js/blob/master/README.md

Illustrates how to add an offset to the toast notification's position, allowing for adjustments on both horizontal (x) and vertical (y) axes.

```javascript
Toastify({
  text: "This is a toast with offset",
  offset: {
    x: 50, // horizontal axis - can be a number or a string indicating unity. eg: '2em'
    y: 10 // vertical axis - can be a number or a string indicating unity. eg: '2em'
  },
}).showToast();
```

=== COMPLETE CONTENT === This response contains all available snippets from this library. No additional content exists. Do not make further requests.