<button id="basic-snackbar" class="btn btn-primary">Basic</button>

    <script type="text/javascript">
        $('#basic-snackbar').on('click', function () {
            new PNotify({
                text    : 'Connection timed out. Showing limited messages.',
                confirm : {
                    confirm: true,
                    buttons: [
                        {
                            text    : 'Dismiss',
                            addClass: 'btn btn-link',
                            click   : function (notice) {
                                notice.remove();
                            }
                        },
                        null
                    ]
                },
                buttons : {
                    closer : false,
                    sticker: false
                },
                animate : {
                    animate  : true,
                    in_class : 'slideInDown',
                    out_class: 'slideOutUp'
                },
                addclass: 'md'
            });
        });
    </script>
    

    <button id="multiline-snackbar" class="btn btn-primary">Multiline</button>

    <script type="text/javascript">
        $('#multiline-snackbar').on('click', function () {
            new PNotify({
                text    : 'Connection timed out. Showing limited messages.',
                confirm : {
                    confirm: true,
                    buttons: [
                        {
                            text    : 'Dismiss',
                            addClass: 'btn btn-link',
                            click   : function (notice) {
                                notice.remove();
                            }
                        },
                        null
                    ]
                },
                buttons : {
                    closer : false,
                    sticker: false
                },
                animate : {
                    animate  : true,
                    in_class : 'slideInDown',
                    out_class: 'slideOutUp'
                },
                addclass: 'md multiline'
            });
        });
    </script>
    

    <button id="action-on-bottom-snackbar" class="btn btn-primary">Action on Bottom</button>

    <script type="text/javascript">
        $('#action-on-bottom-snackbar').on('click', function () {
            new PNotify({
                text    : 'Connection timed out. Showing limited messages. Pull down to attempt reconnecting.',
                confirm : {
                    confirm: true,
                    buttons: [
                        {
                            text    : 'Dismiss',
                            addClass: 'btn btn-link',
                            click   : function (notice) {
                                notice.remove();
                            }
                        },
                        null
                    ]
                },
                buttons : {
                    closer : false,
                    sticker: false
                },
                animate : {
                    animate  : true,
                    in_class : 'slideInDown',
                    out_class: 'slideOutUp'
                },
                addclass: 'md multiline action-on-bottom'
            });
        });
    </script>