LiveReception HTML code system


There are several kinds of code scenarios in LiveRception, they are acting differently on website.Some code can make a invitation pop-up automatically on webpages, some code is just a image link stays in a fixed position.

        This page is to explain how to get these codes and make them work.


        To activate the generator: Option -- HTML Code Generator.


        The components of Code Generator interface.


        Click Preview button, there will be an effect preview of the current code design in a webpage.

        From the above image we can see that there is a check before Floating Icon.

        Click Preview we can get Floating Icon preview, as follows:



        Language option.

The Language option here is for and about the visitor's browser language.

If we choose "Auto-detect", the system will automatically detect the language of the visitor's browser. If visitor's default language of browser is English, the system will give him a English icon or invitation (the premise is you set it right); if the visitor's browser is Chinese, the system will give him a Chinese icon.

But if you do select "English" here, you give every visitor English icons, No matter what language their browser is.

Now we have Chinese, Japanese, Korean and English for choosing here. Except Chinese, Japanese and Korean, all the rest of languages in the world are classified English. If the visitor's browser is France, he will see English icon, too, so does Greek, German, Russia and so on.

So, if you believe your visitors are not Chinese, Japanese and Korean, please select English here, it will be OK. If they are from everywhere including China, Japan and Korean, you'd better select "Auto-detect".

There are other settings related with language options. Please click here to know more about language option.


Only Floating Icon

        Floating Icon is the most basic and common scenario.

If you decide to use only Floating Icon on your webpage, just check before Floating Icon, and copy the code in code area. And paste the code into your webpage HTML backend.

        If you don't like the pattern and position of floating icon, you can change and set at Floating Icon Settings.



Automatic Invitation Code

LiveReception provides a invitation system, which can pop-up in the page for inviting visitors for a chat. Some of the invitation is automatically showing up, some must be launched manually by the operator. The auto invite must be realized by code.

        1. Option - HTML Code generator. Select Default HTML Code sheet.

           The under image is the preview of the default invitation.

           The invitation words here does not fit your website. We must edit it.


        2. Check before Auto-Invite, click Edit the Auto-Invite content.


        3. And we can see the edit interface.


        4. We edit the content into what we want. The circled 1,2,3,4 in the below image are editable points.

           Don't forget to click Enter to save the editing.


        5. After editing, the code in code area will change.


           Now we can have a preview.

           If everything looks fine, you can copy the code and paste them into your webpage backend.

           It works. Visitors can see this Invitation when they open your webpage.

If you have good webpage knowlege and skills, you can change this invitation appearance to make it looks beautiful and fantastic. But your self-made invitation may sometimes cause problems of identifying and tracking visitor on your website. We are not reponsible for errors if you use self-made invitation of your special tech treatment. The only solution for good looking invitation appearance with no identifying (and tracking) visitors problems is CUSTOMIZATION.

Customization: we will make a personalized invitation for you. You provide us your design for it, and we turns it into a real and functional invitation. Customization needs extra payment. The price depends on what you need - if you want to add some links and special effects, that would be more expensive.

  Customize an Invitation.


Static icon code

        Static icon is a chat icon with its fixed position on webpage. Unlike the floating icons, static icon stays in a certain place.

        1. Check before Static Icon


        2. In Add the static icon interface.


        3. After the setting, the code will change.


           Have a preview of your edited static icon.


            If you are OK with your preview, you can copy the code and paste it into your webpage.



Text link code

        Text link is quick and plain, but it has some prolems of identifying and tracking visitor.

        Check before Text Link, and set as the image shows.


           Have a preview of your edited Text Link.


Operator List code

        This code can display an operator list on webpage. Visitor can choose one operator to chat.


          Have a preview.


           If you are OK with the preview, then you can copy the code and paste it into your webpage backend.



Advanced Operator List code

        This kind of operator list code is better in appearance, and works like a floating icon on webpage.

        Choose Advanced Operator List sheet.


           There are 4 kinds of advanced operator lists you can find here.

           You can find their features from the instruction in pink box, and have a preview.


           Have a preview


           If you are OK with the preview, then you can copy the code and paste it into your webpage backend.    

           If you don't like the appearance of this list, you can contact us to customize one.



Department List code

        Providing a Department List on webpage.

        Click Department List sheet.


        Have a preview.


           If you are OK with the preview, then you can copy the code and paste it into your webpage backend.



Advanced Department List code

        Providing a kind of floating icon department list on webpage.

        Click Advanced Department List sheet.

        There are several kinds of advanced department list patterns.

           If you are OK with the preview, then you can copy the code and paste it into your webpage backend.



Text Link Code

        Providing just a text link.

        Please read the Attention before you really use it.



Non-Java Script Code

        Please read the Attention befroe you really use it.