BOTOSUB PLUGIN QUICK START


    This plugin includes Popup, Bar and Inline options for your page. It is very simple to use. Just copy & paste the code below and configure botosubPlugin according to your needs. (You can also install Botosub Wordpress Plugin.)

    Set Facebook Page ID, embed the code to your website and configure other relevant options in botosubPlugin object. You can find Facebook Page ID at the bottom of About Section in your Facebook Page.


    <link type="text/css" href="https://www.botosub.com/css/botosubPlugin.css" rel="stylesheet" media="screen" />
    <script type="text/javascript" src="https://www.botosub.com/js/botosubPluginAsync.min.js" ></script>
    <script>
        window.botosubVars = {};
             // You can find Facebook Page ID at the bottom of About Section in your Facebook Page.
        window.botosubVars.page_id = 1234567890;

             // All supported languages available at https://www.botosub.com/facebookLocales.json
        window.botosubVars.lang = "en_US";


        /*
        * MODAL CONFIGURATION
        */
             // MODAL ENABLED
        window.botosubVars.botosub_mod_enabled = true;
             // TITLE
        window.botosubVars.botosub_mod_title = "Subscribe to our Newsletters from Messenger Chatbot!";
             // DESCRIPTION
        window.botosubVars.botosub_mod_desc = "You can follow our newsletters easily from Messenger and search for previous content from our chatbot.";
             /*
             MODAL TYPE
             0 PAGE LOAD
             1 EXIT INTENT
             2 SCROLL PERCENTAGE
             3 OPEN INTERVAL */
        window.botosubVars.botosub_mod_img_when = "0";
             /*
             TYPE VALUE
             Page Percent & Interval Seconds */
        window.botosubVars.botosub_mod_img_when_val = 30;
             /* Repeat Type
             0 ALWAYS OPEN
             1 NO REPEAT
             2 OPEN AFTER (repeatValue * MIN)
             3 OPEN AFTER (repeatValue * HOURS)
             4 OPEN AFTER (repeatValue * DAYS) */
        window.botosubVars.botosub_mod_img_again = "0";
             // REPEAT VALUE
        window.botosubVars.botosub_mod_img_again_val = "10";
             // TITLE COLOR - #666
        window.botosubVars.botosub_mod_title_color = "#666";
             // DESCRIPTION COLOR - #666
        window.botosubVars.botosub_mod_desc_color = "";
             // IMAGE URL
        window.botosubVars.botosub_mod_img = "https://image.freepik.com/free-vector/magic-wand-and-rabbit-in-a-hat_23-2147493063.jpg";
             /* IMAGE VERTICAL ALIGNMENT
             0 IMAGE AT TOP
             1 IMAGE AT MIDDLE
             2 IMAGE AT BOTTOM */
        window.botosubVars.botosub_mod_img_pos = "0";


        /*
        * BAR CONFIGURATION
        */
             // BAR ENABLED
        window.botosubVars.botosub_bar_enabled = true;
             // BAR POSITION - "top" OR "bottom"
        window.botosubVars.botosub_bar_position = "top";
             // TITLE
        window.botosubVars.botosub_bar_text = "Subscribe to our Newsletters from Messenger Chatbot!";
             // TITLE STYLE
        window.botosubVars.botosub_bar_text_style = "font-weight:bold; padding-right: 10px;";
             // TITLE COLOR
        window.botosubVars.botosub_bar_text_color = "";
             // SWITCH COLOR
        window.botosubVars.botosub_bar_sw_color = "#666";
             // BACKGROUND COLOR
        window.botosubVars.botosub_bar_bg_color = "#fed136";


        /*
        * INLINE CONFIGURATION
        */
             // INLINE ENABLED
        window.botosubVars.botosub_scode_enabled = true;
             // TITLE
        window.botosubVars.botosub_sc_title = "GET FREE UPDATES";
             // DESCRIPTION
        window.botosubVars.sc_desc = "JOIN OVER 200,000 SUBSCRIBERS";
             // IMAGE URL
        window.botosubVars.sc_img = "https://image.freepik.com/free-vector/magic-wand-and-rabbit-in-a-hat_23-2147493063.jpg";
             // TITLE COLOR
        window.botosubVars.sc_title_color = "";
             // DESCRIPTION COLOR
        window.botosubVars.sc_desc_color = "";
             // BACKGROUND COLOR
        window.botosubVars.sc_bg_color = "";
    </script>


    To localize the "Send to Messenger" button change "botosubPlugin.lang" in code. All supported languages available at Facebook Locales.


  • botosubPlugin.ConfModal : modal
    1. enabled: Enable / disable modal (true/false).
    2. type: Change modal type. Default type is "PAGE LOAD".
      1. -type:"0", PAGE LOAD
        -type:"1", EXIT INTENT
        -type:"2", SCROLL PERCENTAGE
        -type:"3", OPEN INTERVAL
    3. typeValue: Percentage for "SCROLL PERCENTAGE" or seconds for "OPEN INTERVAL" ( 50% of page , after 30 sec ).
    4. repeatType: It decides when to open the next Popup.
      1. -repeatType:”0”, ALWAYS OPEN
        -repeatType:”1”, NO REPEAT
        -repeatType:”2”, OPEN AFTER (repeatValue * MIN)
        -repeatType:”3”, OPEN AFTER (repeatValue * HOURS)
        -repeatType:”4”, OPEN AFTER (repeatValue * DAYS)
    5. repeatValue: This option uses MINUTES / HOURS / DAYS interval for repeatType 2, 3 and 4.
    6. title: Set Popup title.
    7. titleColor: Set title color.
    8. description: Text about your title.
    9. descriptionColor: Set description color.
    10. imageURL: If you want to add any image in your Popup you can set image with this variable.
    11. imagePosition: If you add image in your Popup you can set image position (top, middle or bottom).

  • botosubPlugin.ConfBar : modal
    1. enabled: Enable / disable Bar (true/false).
    2. type: Change bar type. Default type is "top" ("top" or "bottom").
    3. hidden: It allows the bar to load hidden (true/false).
    4. bgColor: Set background color.
    5. switchColor: Set the switch button color.
    6. text: Set the text in Bar.
    7. textStyle: Set text style.
    8. textColor: Set text color.

  • botosubPlugin.ConfInline : modal

    If you want to add this option, just add the code below to your website.

    <div class="botosubInline"></div>
    1. enabled: Enable / disable Inline (true/false).
    2. imageURL: If you want to add any image in your Inline you can set image with this variable.
    3. title: Set Inline title.
    4. titleColor: Set title color.
    5. bgColor: Set the background color for Inline.
    6. description: Text about your title.
    7. descriptionColor: Set description color.