External login area

suportgc · August 30, 2017

Hello good afternoon.

I wonder if you can help me.

How can I create an external login area for my WHMCS.

Just as it is done by hostgator (financial.hostgator.com.br)

I would like to create a similar homepage in html, so my clients can login for it.

I would like that after logout the client is directed to the login area again (index.html)

Also, in the case of clicking on the client's Area menu (if it is not logged in) that directs to index.html instead of index.php.

Follow print for a better understanding

Another doubt.

Is it possible to display an error on the same page if the customer enters data that is not present or wrong?

When I click login, even without entering data, it directs me to http://site.com/clientarea.php?incorrect=true

I would like to display the error message on the same page.

Can you help me ?

brian! · August 30, 2017

Hello good afternoon.
I wonder if you can help me.

How can I create an external login area for my WHMCS.

Just as it is done by hostgator (https://financeiro.hostgator.com.br/)

I would like to create a similar homepage in html, so my clients can login for it.

the basic way to add an external login page is to use the Integration Code -> utiliites -> integration code...

https://docs.whmcs.com/Linking_to_WHMCS#Integrating_The_Login_Form_into_your_Website

then it's just a case of styling that page to suit your site design.

I would like that after logout the client is directed to the login area again (index.html)

there's a logout.tpl template - you can change the link in there from index.php to index.html

Also, in the case of clicking on the client's Area menu (if it is not logged in) that directs to index.html instead of index.php.

use the hook in the thread below (2nd block of code)...

https://forum.whmcs.com/showthread.php?129218-Change-URL-for-Home-and-Logo-on-WHMCS-7-2-1&p=516622#post516622

suportgc · August 30, 2017

Hi Brian, everything worked perfectly.

I would like your help with just one more thing.

When the client clicks on login, even if he does not enter the username and password, he directs the page.

site/clientarea.php?incorrect=true

Could you tell me how I can do so that in index.html the information conference is held and if it is wrong email or password, display an alert?

brian! · August 31, 2017

some old forum threads are still valid and working - from 8 years ago...

https://forum.whmcs.com/showthread.php?19018-Custom-failed-login-page&p=131617#post131617

I suppose for you, if you're using an external html login form, you couldn't use the Smarty variables (as you're outside of WHMCS), so you might need to do something like this in go.php...

<?php

   if (strpos($_SERVER['REQUEST_URI'], "incorrect=true") !== false) {
       header( "Location: http://www.amazon.com?incorrect=true" );
   }
   else {
     header("Location: http://www.bbc.co.uk"); // here you can set any page of destination after logging
   }
?>

for a successful login, they're directed to the BBC website; if unsuccessful, they're directed to Amazon - now that's just a demonstration, for you a successful login should probably be directed to index.html and an unsuccessful one back to your external login page... though if it's a html page, you won't be able to use PHP, so that might make things complicated... perhaps have a separate page for incorrect logins.

I quickly tested this with both the default WHMCS login page and an external html form and it works fine with both (v7.2.3). :idea:

suportgc · August 31, 2017

Hello Brian, thanks for the help, this is of great help.

A colleague passed me this code.

Header

<head profile="https://gmpg.org/xfn/11">
   <script type="text/javascript">if (self != top) top.location = self.location;</script>
   <meta http-equiv="window-target" content="_top">
   <meta http-equiv="Content-type" content="text/html;charset=UTF-8"/>
   <meta name="viewport" content="width=device-width, initial-scale=1">
   <title>Financeiro - HostGator</title>
   <meta name="keywords" content=""/>
   <meta name="description" content="Aqui você pode: Atualizar as suas Informações de Cadastro, Alterar a Forma de Pagamento, Realizar um Pagamento, Fazer a Alteração de DNS e mais."/>
   <link href="assets/css/bootstrap.min.css" rel="stylesheet">
   <link href="assets/css/font-awesome.min.css" rel="stylesheet">
   <link type="text/css" href="custom_includes/cliente/assets/css/login.css" type="text/css" rel="stylesheet"/>
   <script type="text/javascript" src="custom_includes/cliente/assets/js/login.js"></script>
   <script type="text/javascript">
   </script>
</head>

Form

<div class="container login-page">
   <div class="sidebar-container col-lg-10 col-lg-offset-1 col-md-10 col-md-offset-1 col-xs-12">

       <div class="left-content-container col-lg-5 col-md-5 col-sm-5 col-xs-12">
           <section class="viewBox-login_default_tx">
               <h2 class="title login-title">Bem-vindo!</h2>
               <div class="box login-box">
                   <form id="login" method="post" action="https://site.com/custom_includes/cliente/validar/checklogin.php">
                       <!-- Login Form -->
                       <div class="boxhead-blue">
                           <h4>Início de sessão</h4>
                       </div>
                       <div class="box-body">
                           <input class="login_field email-input has-validation event-blur fn-emailValidate fn-required" type="email" name="email" value="" placeholder="Insira aqui seu e-mail"/>
                           <input class="login_field password-input has-validation event-blur fn-required" type="password" name="password" minlength="5" id="password" value="" placeholder="Senha"/>
                           <input type="hidden" name="csrf.token" value="5901d100393519.66172553">
                           <input type="hidden" name="invoiceid" value="">
                           <input type="hidden" name="supportform" value="">
                       </div>
                       <div class="full-col table-footer">
                           <button type="submit" class="button-yellow">Entrar</button>
                       </div>
                   </form>
               </div>

Footer

<script type="text/javascript">
   $(function () {
       var hasCaptcha = false;
       HGJS.validate.init(true);
       HGJS.validate.recaptcha = function () {
           var response = grecaptcha.getResponse();
           return response;
       };
       /*$( "#login" ).submit(function( e ) {
        e.stopPropagation(e);
        e.preventDefault(e);

        var $form = $(this);
        var $btn = $('#loginBtn');
        var defaultMessage = ' Usuario o contraseña invalidos. Por favor, inténtelo de nuevo, o entre em contacto con nuestro soporte técnico.';
        var data = {
        email: $form.find("input[name='email']").val(),
        password: $form.find("input[name='password']").val(),
        token: $form.find("input[name='csrf.token']").val(),
        };

        if (hasCaptcha) {
        data.g_captcha_response = grecaptcha.getResponse();
        }

        if ($btn.attr('disabled') === 'disabled') {
        return false;
        }

        if (!HGJS.validate($form, true)) {
        HGJS.validate.attachEvents();
        var top = $('.error').first().offset().top - 75;
        $(window).scrollTop(top);
        grecaptcha.reset();
        return false;
        }

        if (hasCaptcha && !HGJS.validate.recaptcha()) {
        $('#loginAlert')
        .removeClass('hidden')
        .find('.flash-message')
        .text(defaultMessage);
        $(window).scrollTop(top);
        grecaptcha.reset();
        return false;
        }

        $btn.addClass('processing').attr('disabled','disabled');

        $.ajax({
        url:'/cliente/validar',
        type: 'POST',
        dataType:'json',
        data: data
        })
        .done(function( obj ) {

        if (obj.error != undefined) {
        $('#loginAlert')
        .removeClass('hidden')
        .find('.flash-message')
        .text(defaultMessage);
        } else {

        var url = "/cliente/redirect?token=" + obj.token;

        window.location = url;
        }
        });
        });*/
   });
</script>

However, you did not make the file available to me.

/custom_includes/cliente/validar/checklogin.php

Can you tell me about the command, more or less how to reproduce?

Basically if I put a wrong email it displayed a wrong email alert, if the data is invalid it shows an alert, invalid data.

And if everything is correct, it directs you to the client area

Follows prints for better understanding

Edited August 31, 2017 by suportgc

brian! · August 31, 2017

Hello Brian, thanks for the help, this is of great help.
A colleague passed me this code.

However, they did not make the file available to me.

/custom_includes/cliente/validar/checklogin.php

Can you tell me about the command, more or less how to reproduce?

to be honest, no - for two reasons...

1. this code is obviously from the Hostgator website - so it's their code and you shouldn't really be using it.

2. you won't be able to access the code of .php files on their site, so i've no idea what the code inside checklogin.php does - though I would assume you should be using dologin.php from your WHMCS site in your form instead.

suportgc · August 31, 2017

Yes Yes.

This code is from the hostgator.

Who made me available was Hugo henrique (Support Technician level 2) "a friend of childhood".

As for the dologin, sin I'm using the dologin in my code.

Thanks for your help

brian! · August 31, 2017

Yes Yes.
This code is from the hostgator.

Who made me available was Hugo henrique (Support Technician level 2) "a friend of childhood".

if he works for Hostgator, he should be able to get it checklogin.php !

but as I said, you won't need it - you'll need dologin.php

suportgc · August 31, 2017

I already asked for it.

When he send me I'll let you know.

But as I said, I will continue to use dologin.php

A doubt, this dologin.php is encrypted?

I was able to make it display all the messages except when the client clicks login.

If the data is wrong it forwards to /clientarea.php?incorrect=true

Even changing the login and sending to go

But for now it is excellent, my clients can log in normally.

Unfortunately, if miss the password, will be directed to /clientarea.php?incorrect=true instead of receiving an incorrect data alert

brian! · August 31, 2017

I already asked for it.
When he send me I'll let you know.

you won't need it as it will be specifically coded to access the Hostgator login...

But as I said, I will continue to use dologin.php
A doubt, this dologin.php is encrypted?

yes, but you don't need to see the code - only how to manipulate it...

I was able to make it display all the messages except when the client clicks login.
If the data is wrong it forwards to /clientarea.php?incorrect=true

Even changing the login and sending to go

But for now it is excellent, my clients can log in normally.

Unfortunately, if miss the password, will be directed to /clientarea.php?incorrect=true instead of receiving an incorrect data alert

taking your 3 blocks of code, I created a basic HTML page that uses the goto function - it works fine (redirecting to amazon/bbc depending on the login result)...

the only real change I had to make was to point it to dologin.php?goto=go.php (remember to use full URL) and...

<input class="login_field email-input has-validation event-blur fn-emailValidate fn-required" type="email" name="email" value="" placeholder="Insira aqui seu e-mail"/>

to..

<input class="login_field email-input has-validation event-blur fn-emailValidate fn-required" type="text" name="username" value="" placeholder="Insira aqui seu e-mail"/>

I suspect those 3 hidden fields aren't necessary either...

suportgc · August 31, 2017

Incredible, it worked perfectly, it directs me to my home page in the right way.

One last debt and I promise to stop giving work.

When it points to my page, is there any way to display the message "incorrect data" as it displays in /clientarea.php?incorrect=true

For example embed in my html that incorrect=true.

Can be up to a popup on the screen with js or something similar

Edited August 31, 2017 by suportgc

brian! · August 31, 2017

yes, if you're login page was .php instead of .html - I suppose alternatively you could do it in .js - it's just getting variables from the URL... searching Google will give multiple examples of how to do it... basically if ($_GET['incorrect'] == "true) { display your error message }

with regards to the error message itself, that's just a bootstrap danger alert (your page is calling bootstrap.css, but not bootstrap.js so this might not work until you do) using a language string...

https://www.w3schools.com/bootstrap/bootstrap_alerts.asp

as this is outside of WHMCS, you won't have access to the language strings, so you'll have to code the output...

<div class="alert alert-danger">O e-mail e/ou senha estão incorretos. Por favor, tente novamente.</div>

suportgc · August 31, 2017

yes, if you're login page was .php instead of .html - I suppose alternatively you could do it in .js - it's just getting variables from the URL... searching Google will give multiple examples of how to do it... basically if ($_GET['incorrect'] == "true) { display your error message }

with regards to the error message itself, that's just a bootstrap danger alert (your page is calling bootstrap.css, but not bootstrap.js so this might not work until you do) using a language string...

https://www.w3schools.com/bootstrap/bootstrap_alerts.asp

as this is outside of WHMCS, you won't have access to the language strings, so you'll have to code the output...
<div class="alert alert-danger">O e-mail e/ou senha estão incorretos. Por favor, tente novamente.</div>

Sorry, I did not quite understand.

I'm very lazy in this part.

The code below worked perfectly.

<div class="alert alert-danger">O e-mail e/ou senha estão incorretos. Por favor, tente novamente.</div>

I just did not understand the part of if ($ _GET ['incorrect'] == "true).

Should I insert it in go.php?

And the alert too?

Sorry for my ignorance, but I'm still a beginner.

brian! · August 31, 2017

the part about $_get was in case you needed to check whether the URL contained incorrect=true (e.g if there is a login error)... if you don't need to check, then you can ignore what I wrote.

suportgc · August 31, 2017

Got it.

^^

About the second code, can you tell me how I can make it appear only if I miss the data?

brian! · August 31, 2017

About the second code, can you tell me how I can make it appear only if I miss the data?

that's where the $_GET code would come in. :idea:

suportgc · August 31, 2017

But get is not in php?

Should I enter it in go.php?

brian! · August 31, 2017

But get is not in php?

it is - it's in Smarty too, but you can't use Smarty here as it's outside of WHMCS.

if you change the extension of your page from .html to .php, then you'll be able to use $_GET.

Should I enter it in go.php?

no - it needs to be in the same page as where you want to configure the output... which I assume is your login form.

suportgc · August 31, 2017

I understand.

How can i put my page as whmc starter?

For example: if I put her name as home.php

How do i become the main page of whmcs?

brian! · August 31, 2017

the easiest way would be to edit the existing header.tpl and homepage.tpl templates... but it depends how much you want to change it.. the main page will always being index.php unless you direct visitors elsewhere.

External login area

Recommended Posts

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Join the conversation

Recently Browsing 0 members

Important Information