Help with whois plugin

ricrey · January 23, 2021

Hello, I am using the free whois plugin that they give in the marketplace, https://marketplace.whmcs.com/product/4795-whois-for-clients

The problem is that the whois design in version 8.1 with the "twenty-one" theme has been slightly distorted, and with the "six" theme it works ...

Maybe some good soul of this community can help me adapt it for "twenty-one" I would appreciate it immensely, I can even pass on the modification that I had made to that free plugin so that it has a better functionality ...

I will put here the code of the tpl that I think is the one that gives problems with "twenty-one" because of the "class" of the "div"

This is how I modified it some years ago so that it has a "buy" button and a "print" button.

<div class="row">
    <div class="col-lg-10 col-lg-offset-2">
        <form
                method="POST"
                action="{$moduleLink}"
                class="form-inline"
        >
            <div class="col-lg-12 align-content-center">
                <div class="input-group col-lg-8">

                    <input
                            type="text"
                            class="form-control input-lg"
                            placeholder="example.com"
                            name="domainName"
                            value="{$domainName}"
                    />
                    <span class="input-group-btn">
                    <button
                            class="btn btn-danger btn"
                            type="submit"
                    >
                        GET WHOIS LOOKUP
                    </button>
                </span>
                </div>
            </div>
        </form>
    </div>
</div>
<br>
<br>
<div class="panel panel-primary">

    {if !empty($whoisData) }
        <div class="panel panel-primary">
            <div class="panel-heading">WHOIS Data for <strong>{$domainName}</strong><button onclick="myFunction()" style="float:right;background:white;color: blue;border: none;border-radius: 4px;cursor: pointer; padding:2px 8px;">Print</button></div>
            <br>
            <div class="row">
                <div class="col-lg-10 col-md-offset-1">
                    <div class="alert alert-warning" role="alert">
                       <h5> <form action="https://www.hostingsupremo.com/shop/cart.php?a=add&domain=register" method="post">
                        <input type="text" value="{$domainName}" name="query" readonly class="whoresult" >is <span style="color:red;">{$whoisData['status']}</span>  for registration <input type="submit" value="Buy Now"  class="whobuy"/>
                        </form></h5>
                        
                    </div>
                </div>
            </div>

            <div class="panel-body">
                
                <div class="nstyle">
                <b>{$whoisData['whois']}</b>
                </div>

            </div>
        </div>
    {/if}
</div>
<style>
    .nstyle{
        margin:auto;
        width:83.33333333%;
        
    }
    .whoresult{
        border: 0px solid; background:#fcf8e3; float: left; text-align:right;   padding-right:5px;
    }
   .whobuy{
       float: right;background-color: #4CAF50;color: white;border: none;border-radius: 4px;cursor: pointer; padding:4px 8px;
   }
    
</style>
<script>
function myFunction() {
  window.print();
}
</script>

This is the original code of the free plugin of the marketplace, it is practically not modified at all xD

<div class="row">
    <div class="col-lg-12 col-lg-offset-3">
        <form
                method="POST"
                action="{$moduleLink}"
                class="form-inline"
        >
            <div class="col-lg-12 align-content-center">
                <div class="input-group col-lg-8">

                    <input
                            type="text"
                            class="form-control input-lg"
                            placeholder="example.com"
                            name="domainName"
                            value="{$domainName}"
                    />
                    <span class="input-group-btn">
                    <button
                            class="btn btn-primary btn-lg"
                            type="submit"
                    >
                        GET WHOIS
                    </button>
                </span>
                </div>
            </div>
        </form>
    </div>
</div>
<br>
<br>
<div class="row">


    {if !empty($whoisData) }
        <div class="panel panel-primary">
            <div class="panel-heading">WHOIS Data for <strong>{$domainName}</strong></div>
            <br>
            <div class="row">
                <div class="col-lg-10 col-md-offset-1">
                    <div class="alert alert-warning" role="alert">
                        <span class="glyphicon glyphicon-info-sign" aria-hidden="true"></span>
                        <span style="font-size:14px">This domain name is {$whoisData['status']}</span>
                    </div>
                </div>
            </div>

            <div class="panel-body">

                {$whoisData['whois']}

            </div>
        </div>
    {/if}
</div>

Note: I always considered that WHMCS as a "Hosting" platform should have included this as part of the development ...

Edited January 23, 2021 by ricrey
add note.

ricrey · January 23, 2021

the plugin's layout file shows this:

layout.tpl

{*{include file='./pageHeader.tpl'}*}
{include file="./$templateName.tpl"}
{*{include file='./pageFooter.tpl'}*}

brian! · January 24, 2021

On 23/01/2021 at 14:17, ricrey said:

Maybe some good soul of this community can help me adapt it for "twenty-one" I would appreciate it immensely, I can even pass on the modification that I had made to that free plugin so that it has a better functionality ...

to get it looking the same/similar should just involve adding the CSS that is used in six into your stylesheet (specifically the .panel class) - this is nothing more than a copy&paste job.

though i'd argue the "Buy Now" button shouldn't be there unless the domain is available.

On 23/01/2021 at 14:17, ricrey said:

Note: I always considered that WHMCS as a "Hosting" platform should have included this as part of the development ...

well WHMCS have removed whois.php from the latest versions, so I don't foresee WHMCS doing this as a core function in the client area.

ricrey · January 24, 2021

19 minutes ago, brian! said:

to get it looking the same/similar should just involve adding the CSS that is used in six into your stylesheet (specifically the .panel class) - this is nothing more than a copy&paste job.

where can i find that css? and where should I place it in the child theme or the main theme "twenty-one"?

20 minutes ago, brian! said:

though i'd argue the "Buy Now" button shouldn't be there unless the domain is available.

well WHMCS have removed whois.php from the latest versions, so I don't foresee WHMCS doing this as a core function in the client area.

I am a bit of a programming novice, I was able to place the "buy now" and "print" button but I don't know how to do so that when the domain is not available the button does not appear and when it is, it does come out .. there my knowledge is limited .

brian! · January 24, 2021

3 minutes ago, ricrey said:

where can i find that css?

the .panel classes would be defined in /templates/six/css/all.css

4 minutes ago, ricrey said:

and where should I place it in the child theme or the main theme "twenty-one"?

if you're only going to need this css on this one addon page, then i'd add it to the <style> declarations in the clientarea.tpl file of the addon.

<div class="row">
	<div class="col-lg-12">
		<div class="alert alert-warning" role="alert">
			<form action="cart.php?a=add&domain=register" method="post">
				<h5>{$domainName} is <span style="color:red;">{$whoisData['status']}</span> for registration
				<input type="hidden" value="{$domainName}" name="query">
				{if {$whoisData['status']} eq 'available'}<input type="submit" value="Buy Now" class="whobuy">{/if}
				</h5>
			</form>
		</div>
	</div>
</div>

ricrey · January 24, 2021

I added all the code to .panel will it be ok? ... apparently it works ..

.panel {
  margin-bottom: 20px;
  background-color: #fff;
  border: 1px solid transparent;
  border-radius: 4px;
  -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.05);
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.05);
  font-size: .9em;

}
.panel-body {
  padding: 15px;
}
.panel-heading {
  padding: 10px 15px;
  border-bottom: 1px solid transparent;
  border-top-left-radius: 3px;
  border-top-right-radius: 3px;
}
.panel-heading > .dropdown .dropdown-toggle {
  color: inherit;
}
.panel-title {
  margin-top: 0;
  margin-bottom: 0;
  font-size: 16px;
  color: inherit;
}
.panel-title > a,
.panel-title > small,
.panel-title > .small,
.panel-title > small > a,
.panel-title > .small > a {
  color: inherit;
}
.panel-footer {
  padding: 10px 15px;
  background-color: #f5f5f5;
  border-top: 1px solid #ddd;
  border-bottom-right-radius: 3px;
  border-bottom-left-radius: 3px;
}
.panel > .list-group,
.panel > .panel-collapse > .list-group {
  margin-bottom: 0;
}
.panel > .list-group .list-group-item,
.panel > .panel-collapse > .list-group .list-group-item {
  border-width: 1px 0;
  border-radius: 0;
}
.panel > .list-group:first-child .list-group-item:first-child,
.panel > .panel-collapse > .list-group:first-child .list-group-item:first-child {
  border-top: 0;
  border-top-left-radius: 3px;
  border-top-right-radius: 3px;
}
.panel > .list-group:last-child .list-group-item:last-child,
.panel > .panel-collapse > .list-group:last-child .list-group-item:last-child {
  border-bottom: 0;
  border-bottom-right-radius: 3px;
  border-bottom-left-radius: 3px;
}
.panel > .panel-heading + .panel-collapse > .list-group .list-group-item:first-child {
  border-top-left-radius: 0;
  border-top-right-radius: 0;
}
.panel-heading + .list-group .list-group-item:first-child {
  border-top-width: 0;
}
.list-group + .panel-footer {
  border-top-width: 0;
}
.panel > .table,
.panel > .table-responsive > .table,
.panel > .panel-collapse > .table {
  margin-bottom: 0;
}
.panel > .table caption,
.panel > .table-responsive > .table caption,
.panel > .panel-collapse > .table caption {
  padding-right: 15px;
  padding-left: 15px;
}
.panel > .table:first-child,
.panel > .table-responsive:first-child > .table:first-child {
  border-top-left-radius: 3px;
  border-top-right-radius: 3px;
}
.panel > .table:first-child > thead:first-child > tr:first-child,
.panel > .table-responsive:first-child > .table:first-child > thead:first-child > tr:first-child,
.panel > .table:first-child > tbody:first-child > tr:first-child,
.panel > .table-responsive:first-child > .table:first-child > tbody:first-child > tr:first-child {
  border-top-left-radius: 3px;
  border-top-right-radius: 3px;
}
.panel > .table:first-child > thead:first-child > tr:first-child td:first-child,
.panel > .table-responsive:first-child > .table:first-child > thead:first-child > tr:first-child td:first-child,
.panel > .table:first-child > tbody:first-child > tr:first-child td:first-child,
.panel > .table-responsive:first-child > .table:first-child > tbody:first-child > tr:first-child td:first-child,
.panel > .table:first-child > thead:first-child > tr:first-child th:first-child,
.panel > .table-responsive:first-child > .table:first-child > thead:first-child > tr:first-child th:first-child,
.panel > .table:first-child > tbody:first-child > tr:first-child th:first-child,
.panel > .table-responsive:first-child > .table:first-child > tbody:first-child > tr:first-child th:first-child {
  border-top-left-radius: 3px;
}
.panel > .table:first-child > thead:first-child > tr:first-child td:last-child,
.panel > .table-responsive:first-child > .table:first-child > thead:first-child > tr:first-child td:last-child,
.panel > .table:first-child > tbody:first-child > tr:first-child td:last-child,
.panel > .table-responsive:first-child > .table:first-child > tbody:first-child > tr:first-child td:last-child,
.panel > .table:first-child > thead:first-child > tr:first-child th:last-child,
.panel > .table-responsive:first-child > .table:first-child > thead:first-child > tr:first-child th:last-child,
.panel > .table:first-child > tbody:first-child > tr:first-child th:last-child,
.panel > .table-responsive:first-child > .table:first-child > tbody:first-child > tr:first-child th:last-child {
  border-top-right-radius: 3px;
}
.panel > .table:last-child,
.panel > .table-responsive:last-child > .table:last-child {
  border-bottom-right-radius: 3px;
  border-bottom-left-radius: 3px;
}
.panel > .table:last-child > tbody:last-child > tr:last-child,
.panel > .table-responsive:last-child > .table:last-child > tbody:last-child > tr:last-child,
.panel > .table:last-child > tfoot:last-child > tr:last-child,
.panel > .table-responsive:last-child > .table:last-child > tfoot:last-child > tr:last-child {
  border-bottom-right-radius: 3px;
  border-bottom-left-radius: 3px;
}
.panel > .table:last-child > tbody:last-child > tr:last-child td:first-child,
.panel > .table-responsive:last-child > .table:last-child > tbody:last-child > tr:last-child td:first-child,
.panel > .table:last-child > tfoot:last-child > tr:last-child td:first-child,
.panel > .table-responsive:last-child > .table:last-child > tfoot:last-child > tr:last-child td:first-child,
.panel > .table:last-child > tbody:last-child > tr:last-child th:first-child,
.panel > .table-responsive:last-child > .table:last-child > tbody:last-child > tr:last-child th:first-child,
.panel > .table:last-child > tfoot:last-child > tr:last-child th:first-child,
.panel > .table-responsive:last-child > .table:last-child > tfoot:last-child > tr:last-child th:first-child {
  border-bottom-left-radius: 3px;
}
.panel > .table:last-child > tbody:last-child > tr:last-child td:last-child,
.panel > .table-responsive:last-child > .table:last-child > tbody:last-child > tr:last-child td:last-child,
.panel > .table:last-child > tfoot:last-child > tr:last-child td:last-child,
.panel > .table-responsive:last-child > .table:last-child > tfoot:last-child > tr:last-child td:last-child,
.panel > .table:last-child > tbody:last-child > tr:last-child th:last-child,
.panel > .table-responsive:last-child > .table:last-child > tbody:last-child > tr:last-child th:last-child,
.panel > .table:last-child > tfoot:last-child > tr:last-child th:last-child,
.panel > .table-responsive:last-child > .table:last-child > tfoot:last-child > tr:last-child th:last-child {
  border-bottom-right-radius: 3px;
}
.panel > .panel-body + .table,
.panel > .panel-body + .table-responsive,
.panel > .table + .panel-body,
.panel > .table-responsive + .panel-body {
  border-top: 1px solid #ddd;
}
.panel > .table > tbody:first-child > tr:first-child th,
.panel > .table > tbody:first-child > tr:first-child td {
  border-top: 0;
}
.panel > .table-bordered,
.panel > .table-responsive > .table-bordered {
  border: 0;
}
.panel > .table-bordered > thead > tr > th:first-child,
.panel > .table-responsive > .table-bordered > thead > tr > th:first-child,
.panel > .table-bordered > tbody > tr > th:first-child,
.panel > .table-responsive > .table-bordered > tbody > tr > th:first-child,
.panel > .table-bordered > tfoot > tr > th:first-child,
.panel > .table-responsive > .table-bordered > tfoot > tr > th:first-child,
.panel > .table-bordered > thead > tr > td:first-child,
.panel > .table-responsive > .table-bordered > thead > tr > td:first-child,
.panel > .table-bordered > tbody > tr > td:first-child,
.panel > .table-responsive > .table-bordered > tbody > tr > td:first-child,
.panel > .table-bordered > tfoot > tr > td:first-child,
.panel > .table-responsive > .table-bordered > tfoot > tr > td:first-child {
  border-left: 0;
}
.panel > .table-bordered > thead > tr > th:last-child,
.panel > .table-responsive > .table-bordered > thead > tr > th:last-child,
.panel > .table-bordered > tbody > tr > th:last-child,
.panel > .table-responsive > .table-bordered > tbody > tr > th:last-child,
.panel > .table-bordered > tfoot > tr > th:last-child,
.panel > .table-responsive > .table-bordered > tfoot > tr > th:last-child,
.panel > .table-bordered > thead > tr > td:last-child,
.panel > .table-responsive > .table-bordered > thead > tr > td:last-child,
.panel > .table-bordered > tbody > tr > td:last-child,
.panel > .table-responsive > .table-bordered > tbody > tr > td:last-child,
.panel > .table-bordered > tfoot > tr > td:last-child,
.panel > .table-responsive > .table-bordered > tfoot > tr > td:last-child {
  border-right: 0;
}
.panel > .table-bordered > thead > tr:first-child > td,
.panel > .table-responsive > .table-bordered > thead > tr:first-child > td,
.panel > .table-bordered > tbody > tr:first-child > td,
.panel > .table-responsive > .table-bordered > tbody > tr:first-child > td,
.panel > .table-bordered > thead > tr:first-child > th,
.panel > .table-responsive > .table-bordered > thead > tr:first-child > th,
.panel > .table-bordered > tbody > tr:first-child > th,
.panel > .table-responsive > .table-bordered > tbody > tr:first-child > th {
  border-bottom: 0;
}
.panel > .table-bordered > tbody > tr:last-child > td,
.panel > .table-responsive > .table-bordered > tbody > tr:last-child > td,
.panel > .table-bordered > tfoot > tr:last-child > td,
.panel > .table-responsive > .table-bordered > tfoot > tr:last-child > td,
.panel > .table-bordered > tbody > tr:last-child > th,
.panel > .table-responsive > .table-bordered > tbody > tr:last-child > th,
.panel > .table-bordered > tfoot > tr:last-child > th,
.panel > .table-responsive > .table-bordered > tfoot > tr:last-child > th {
  border-bottom: 0;
}
.panel > .table-responsive {
  margin-bottom: 0;
  border: 0;
}
.panel-group {
  margin-bottom: 20px;
}
.panel-group .panel {
  margin-bottom: 0;
  border-radius: 4px;
}
.panel-group .panel + .panel {
  margin-top: 5px;
}
.panel-group .panel-heading {
  border-bottom: 0;
}
.panel-group .panel-heading + .panel-collapse > .panel-body,
.panel-group .panel-heading + .panel-collapse > .list-group {
  border-top: 1px solid #ddd;
}
.panel-group .panel-footer {
  border-top: 0;
}
.panel-group .panel-footer + .panel-collapse .panel-body {
  border-bottom: 1px solid #ddd;
}
.panel-default {
  border-color: #ddd;
}
.panel-default > .panel-heading {
  color: #333333;
  background-color: #f5f5f5;
  border-color: #ddd;
}
.panel-default > .panel-heading + .panel-collapse > .panel-body {
  border-top-color: #ddd;
}
.panel-default > .panel-heading .badge {
  color: #f5f5f5;
  background-color: #333333;
}
.panel-default > .panel-footer + .panel-collapse > .panel-body {
  border-bottom-color: #ddd;
}
.panel-primary {
  border-color: #337ab7;
}
.panel-primary > .panel-heading {
  color: #fff;
  background-color: #337ab7;
  border-color: #337ab7;
}
.panel-primary > .panel-heading + .panel-collapse > .panel-body {
  border-top-color: #337ab7;
}
.panel-primary > .panel-heading .badge {
  color: #337ab7;
  background-color: #fff;
}
.panel-primary > .panel-footer + .panel-collapse > .panel-body {
  border-bottom-color: #337ab7;
}
.panel-success {
  border-color: #d6e9c6;
}
.panel-success > .panel-heading {
  color: #3c763d;
  background-color: #dff0d8;
  border-color: #d6e9c6;
}
.panel-success > .panel-heading + .panel-collapse > .panel-body {
  border-top-color: #d6e9c6;
}
.panel-success > .panel-heading .badge {
  color: #dff0d8;
  background-color: #3c763d;
}
.panel-success > .panel-footer + .panel-collapse > .panel-body {
  border-bottom-color: #d6e9c6;
}
.panel-info {
  border-color: #bce8f1;
}
.panel-info > .panel-heading {
  color: #31708f;
  background-color: #d9edf7;
  border-color: #bce8f1;
}
.panel-info > .panel-heading + .panel-collapse > .panel-body {
  border-top-color: #bce8f1;
}
.panel-info > .panel-heading .badge {
  color: #d9edf7;
  background-color: #31708f;
}
.panel-info > .panel-footer + .panel-collapse > .panel-body {
  border-bottom-color: #bce8f1;
}
.panel-warning {
  border-color: #faebcc;
}
.panel-warning > .panel-heading {
  color: #8a6d3b;
  background-color: #fcf8e3;
  border-color: #faebcc;
}
.panel-warning > .panel-heading + .panel-collapse > .panel-body {
  border-top-color: #faebcc;
}
.panel-warning > .panel-heading .badge {
  color: #fcf8e3;
  background-color: #8a6d3b;
}
.panel-warning > .panel-footer + .panel-collapse > .panel-body {
  border-bottom-color: #faebcc;
}
.panel-danger {
  border-color: #ebccd1;
}
.panel-danger > .panel-heading {
  color: #a94442;
  background-color: #f2dede;
  border-color: #ebccd1;
}
.panel-danger > .panel-heading + .panel-collapse > .panel-body {
  border-top-color: #ebccd1;
}
.panel-danger > .panel-heading .badge {
  color: #f2dede;
  background-color: #a94442;
}
.panel-danger > .panel-footer + .panel-collapse > .panel-body {
  border-bottom-color: #ebccd1;
}

brian! · January 24, 2021

11 minutes ago, ricrey said:

I added all the code to .panel will it be ok?

you won't need all of it, but it can't do any harm leaving the unused parts in there.

11 minutes ago, ricrey said:

apparently it works ..

don't sound surprised! 🙂

Sign In

Help with whois plugin

Recommended Posts

ricrey

Link to comment

Share on other sites

ricrey

Link to comment

Share on other sites

brian!

Link to comment

Share on other sites

ricrey

Link to comment

Share on other sites

brian!

Link to comment

Share on other sites

ricrey

Link to comment

Share on other sites

brian!

Link to comment

Share on other sites

Join the conversation

Recently Browsing 0 members

Browse

Latest Activity

Blog

Technical Support

Important Information