Webmail da Roundcube diretamente no site Webacappela

Olá galera do bem,

Recentemente auxiliei um colega que necessitava colocar uma forma de acessar o webmail da Roundcube diretamente do site. 

Estou então postando aqui para enriquecer nossa biblioteca WebAcappella

No exemplo vocês não conseguirão acessar pois não sabem a senha. Mas já dá pra ter uma noção.

Vamos lá:

No meu ponto de vista, acessar o webmail é algo que o internauta(visitante do site) não precisa ter acesso. Por isso eu acho interessante criar uma página e chamar ela de restrito.

Só como exemplo vou utilizar o próprio sistema de senha já existente no WebAcappella. Para não fugir do foco deste tutorial. 

Em outra postagem estarei explicando de como criar um sistema de login bacana para se colocar no site WebAcappella.

Para utilizar o sistema de senha padrão do WebAcappela vá na opção  SITE>> PROPRIEDADES DO WEBSITE, clique no Cadeado preencha com uma senha o campo disponível e marque a caixa de verificação "Bloquear o clique direito do mouse nas suas páginas"

Clique em OK.

Agora vai na página restrito e vai na opção PÁGINAS/ MATRIZES >> PROPRIEDADE DA PÁGINA  no WebAcappella. Clique no ícone do cadeado e marque a caixa de verificação "Esta página é protegida por uma senha" 

Utilizaremos o código abaixo para nossa função:

<form action="http://endereço_do_site:PORTA/login/" method="POST" target="_blank">

<input type="hidden" name="login_theme" value="cpanel">

<input type="hidden" name="goto_uri" value="/3rdparty/roundcube/index.php">

<input type="hidden" name="login_theme" value="cpanel">

E-mail:

<input type="text" name="user" size="TAMANHOCAMPOEMAIL" alt="E-Mail" value="@domínio" onblur="if(this.value=='') this.value='E-Mail';" onfocus="if(this.value=='E-Mail') this.value='@endereço_do_site';">

Senha:

<input type="password" name="pass" size="TAMANHOCAMPOSENHA" alt="" value="" onblur="if(this.value=='') this.value='';" onfocus="if(this.value=='') this.value='';">

<button value="Login" name="Submit" type="submit" title="Login">Acessar</button>

</form>

Entendendo o código e fazendo alterações: Observe as áreas do código em vermelho.

endereço_do_site  -  Altere com o endereço do domínio referente ao e-mail , ex: se o e-mail for teste@bhinf.com.br  colque www.bhinf.com.br

PORTA : Substitua pela porta que acessa seu webmail. para descobrir basta acessar na forma tradicional que estará aparecendo na barra de endereço do navegador. 

E-mail: : Substitua com o texto que queira  que apareça na frente do campo do e-mail

TAMANHOCAMPOEMAIL : Informe o tamanho que você quer o campo onde será digitado o e-mail 

@domínio : Você preenche com uma máscara que irá aparecer no campo do e-mail antes que seja digitado algo ou pode deixar sem nada para que não apareça nada

Senha: Substitua com o texto que queira  que apareça na frente do campo da senha

TAMANHOCAMPOSENHA: Informe o tamanho que você quer o campo onde será digitado a senha

Acessar: Substitua com o texto que você quer que apareça dentro do botão  

O meu código alterado para este exemplo ficou assim:

<form action="http://www.bhinf.com.br:2095/login/" method="POST" target="_blank">

<input type="hidden" name="login_theme" value="cpanel">

<input type="hidden" name="goto_uri" value="/3rdparty/roundcube/index.php">

<input type="hidden" name="login_theme" value="cpanel">

Digite seu email:

<input type="text" name="user" size="40" alt="E-mail" value=@bhinf.com.br onblur="if(this.value=='') this.value='E-Mail';" onfocus="if(this.value=='E-Mail') this.value='@ed';">

Senha:

<input type="password" name="pass" size="10" alt="" value="" onblur="if(this.value=='') this.value='';" onfocus="if(this.value=='') this.value='';">

<button value="Login" name="Submit" type="submit" title="Login">Enviar</button>

</form>

Agora no WebAcappella utilize a opção INSERIR>>CÓDIGO HTML e insira o seu código já com suas alterações.

Agora é você ajustar a página de acordo com sua criatividade no site. No meu exemplo ficou assim:

Em funcionamento se as credenciais estiverem certas vai cair direto para o webmail do Roundcube.

Caso contrário vai ser redirecionado para a tela padrão do webmail do domínio.

Para ver online clique aqui. 

É isso aê galera do bem..abração.