Índice Adicionando a tag HTML em seu site Pág. 1 Customização da aparência da tag HTML Pág. 2 Passando valores para os campos do formulário do cliente no P-Atendimento Pág. 2 Passando valores dinâmicos para os parâmetros Pág. 3 0
Manual de Implantação do P-Atendimento Adicionando a tag HTML em seu site Para implantar o patendimento no seu site basta adicionar a seguinte tag HTML em seu site. <!--START TAG P-ATENDIMENTO--> <div id="patendimento" style="border-bottom: #cdc 1px solid; border-left: #cdc 1px solid; width: 300px; height: 60px; border-top: #cdc 1px solid; border-right: #cdc 1px solid"> <div id="patendimento_loading" style="display: none;"> <img alt="carregando" align="left" style="border-bottom: 0px; border-left: 0px; border-top: 0px; border-right: 0px" src="http://plannersistemas.com.br/imgs/ajax-loader.gif" /> <br /> <font style="font-family: Arial; color: #777; font-size: 16px; textdecoration: none">carregando...</font> <div id="patendimento_online" style="display: none;"> <a onclick="patendimentoopenwindow(); return false;" style="textdecoration: none" href="#"> <img alt="atendimento On-line" align="left" width="62" height="60" style="border-bottom: 0px; border-left: 0px; border-top: 0px; border-right: 0px" src="http://plannersistemas.com.br/imgs/attendent.png" /> <br> <b><font style="font-style: italic; font-family: Arial; color: #2e9eff; font-size: 16px; text-decoration: none">atendimento Online</font></b><br> <font style="font-family: Arial; color: #666; font-size: 12px; text-decoration: none">clique aqui para iniciar o chat</font> </a> <div id="patendimento_offline" style="display: inline;"> <a onclick="patendimentoopenwindow(); return false;" style="textdecoration: none" href="#"> <img alt="atendimento Off-Line" align="left" width="62" height="60" style="border-bottom: 0px; border-left: 0px; border-top: 0px; border-right: 0px" src="http://plannersistemas.com.br/imgs/attendent.png" /> <br> <b><font style="font-style: italic; font-family: Arial; color: #fc1800; font-size: 16px">Atendimento Off-line</font></b><br /> <font style="font-family: Arial; color: #666; font-size: 12px">Clique aqui para deixar sua mensagem</font> </a> src="http://plannersistemas.com.br/patendimento/patendimentojs2.jsp?c={license}" <!--END TAG P-ATENDIMENTO--> 1
Para que essa tag funcione com o seu P-Atendimento, deve ser modificado o parâmetro c, passando o código da sua licença, na seguinte linha: src="http://plannersistemas.com.br/patendimento/patendimentojs2.jsp?c=licencavai-aqui" Obs: Caso o P-Atendimento for versão Enterprise é preciso modificar o endereço do script para que aponte para o servidor de P-Atendimento, por exemplo: src="http://meuservidor.com.br:8080/patendimento/patendimentojs2.jsp?c=licencavai-aqui" Customização da aparência da tag HTML A tag é composta por três elementos <div> de HTML, o primeiro <div> com o id patendimento_loading contém o HTML que será mostrado quando o sistema está sendo carregado. O segundo <div> com o id patendimento_online contém o HTML que será mostrado caso tenha algum atendente disponível para o atendimento de chamadas. O terceiro <div> com o id patendimento_offline contém o HTML que será mostrado caso não tenha nenhuma atendente online. O HTML contido em cada uma dessas DIVs pode totalmente personalizado, por exemplo trocando o caminho das imagens da tag <img> ou qualquer outra alteração do HTML. Passando valores para os campos do formulário do cliente no P-Atendimento Na tag podem ser feitas configurações para passar valores para campos já venham preenchidos, lembrando que o sistema do P-Atendimento permite o cadastro de campos não editáveis no formulário e a única forma de preencher esses campos não editáveis é passando valores para eles na seguinte linha da tag. src="http://plannersistemas.com.br/patendimento/patendimentojs2.jsp?c={license} &name=maria" Nessa linha está sendo passado o parâmetro name com o valor Maria, isso faz com que o campo nome no formulário já venha preenchido com Maria. A tabela de parâmetros é a seguinte: 2
Parâmetro name email phone enterprise area customfieldclient customfieldchat Descrição Campo nome do cliente Campo e-mail do cliente Campo telefone Campo empresa Campo departamento Campo personalizado relacionado ao cliente Campo personalizado relacionado ao atendimento Passando valores dinâmicos para os parâmetros Para explicar como passar parâmetros dinâmicos vamos usar o exemplo de um servidor de P-Atendimento que tem o formulário do cliente configurado da seguinte forma: 3
Na imagem acima podemos ver que foi configurado um campo personalizado relacionado ao atendimento, que se chama Protocolo, e que esse campo não é editável, ou seja, o cliente não poderá altera-lo, então o valor desse campo deve ser passado como parâmetro na tag como o exemplo abaixo em JSP: src="http://plannersistemas.com.br/patendimento/patendimentojs2.jsp?c={license}& customfieldchat=<%=urlencoder.encode(protocolo)%>" Mesmo exemplo em PHP: src="http://plannersistemas.com.br/patendimento/patendimentojs2.jsp?c={license}& customfieldchat=<?=$protocolo?>" Para passar mais de um parâmetro, os parâmetros devem ser separados por &. 4