Click – Payment button installation instructions

Option 1 – redirect by link:

To redirect to CLICK payment page you need to create a button (link) to the following address:

https://my.click.uz/services/pay?service_id={service_id}&merchant_id={merchant_id}&amount={amount}&transaction_param={transaction_param}&return_url={return_url}&card_type={card_type}
# Parameter name Data type Description
1 merchant_id mandatory Merchant ID
2 merchant_user_id optional User ID for Merchant system
3 service_id mandatory Merchant Service ID
4 transaction_param mandatory Order ID (for online shopping) / personal account / login in the billing of the supplier. Corresponds to merchant_trans_id from SHOP-API
5 amount mandatory Transaction amount (format: N.NN)
6 return_url optional The link where user will be redirected after the payment
7 card_type optional Type of payment system (uzcard, humo)

Button styling example (CSS) is shown in Option 2

Option 2 – redirect by HTML form:

<form action="https://my.click.uz/services/pay" method="get" target="_blank">
                                    <button typo="submit" class="pay_with_click"><i></i>Оплатить через CLICK</button>
                                    <input type=”hidden” name=”KEY” value=”VALUE” />
                                    <input type=”hidden” name=”KEY” value=”VALUE” />
                                    …
</form>

For the purposes of interaction between the merchant’s website and CLICK payment interface the following parameters with hidden fields have to be passed:

# Parameter name Data type Description
1 merchant_id mandatory Merchant ID
2 merchant_user_id optional User ID for Merchant system
3 service_id mandatory Merchant Service ID
4 transaction_param mandatory Order ID (for online shopping) / personal account / login in the billing of the supplier. Corresponds to merchant_trans_id from SHOP-API
5 amount mandatory Transaction amount (format: N.NN)
6 return_url optional The link where user will be redirected after the payment
7 card_type optional Type of payment system (uzcard, humo)

Form example (PHP Code):

<?
$merchantID = 20; //It’s necessary to replace the parameter with the new ID
$merchantUserID = 4;
$serviceID = 31;  $transID = "user23151";
$transAmount = number_format(1000, 2, '.', '');
$returnURL = "merchant website url";
$HTML = <<<CODE
<form action="https://my.click.uz/services/pay" id=”click_form” method="get" target="_blank">
                                    <input type="hidden" name="amount" value="$transAmount" />
                                    <input type="hidden" name="merchant_id" value="$merchantID"/>
                                    <input type="hidden" name="merchant_user_id" value="$merchantUserID"/>
                                    <input type="hidden" name="service_id" value="$serviceID"/>
                                    <input type="hidden" name="transaction_param" value="$transID"/>
                                    <input type="hidden" name="return_url" value="$returnURL"/>
                                    <input type="hidden" name="card_type" value="$cardType"/>
                                    <button type="submit" class=”click_logo"><i></i>Pay with CLICK</button>
</form>
CODE;

Example of the final HTML code:

<form id="click_form" action="https://my.click.uz/services/pay" method="get" target="_blank">
  <input type="hidden" name="amount" value="1000" />
  <input type="hidden" name="merchant_id" value="46"/>
  <input type="hidden" name="merchant_user_id" value="4"/>
  <input type="hidden" name="service_id" value="36"/>
  <input type="hidden" name="transaction_param" value="user23151"/>
  <input type="hidden" name="return_url" value="merchant website url"/>
  <input type="hidden" name="card_type" value="uzcard/humo"/>
  <button type="submit" class="click_logo"><i></i>Pay with CLICK</button>
</form>

CSS code for the button:

click_logo {
  padding:4px 10px;
  cursor:pointer;
  color: #fff;
  line-height:190%;
  font-size: 13px;
  font-family: Arial;
  font-weight: bold;
  text-align: center;
  border: 1px solid #037bc8;
  text-shadow: 0px -1px 0px #037bc8;
  border-radius: 4px;
  background: #27a8e0;
  background:   url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzI3YThlMCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMxYzhlZDciIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
  background: -webkit-gradient(linear, 0 0, 0 100%, from(#27a8e0), to(#1c8ed7));
  background: -webkit-linear-gradient(#27a8e0 0%, #1c8ed7 100%);
  background: -moz-linear-gradient(#27a8e0 0%, #1c8ed7 100%);
  background: -o-linear-gradient(#27a8e0 0%, #1c8ed7 100%);
  background: linear-gradient(#27a8e0 0%, #1c8ed7 100%);
  box-shadow:  inset    0px 1px 0px   #45c4fc;
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#27a8e0', endColorstr='#1c8ed7',GradientType=0 );
  -webkit-box-shadow: inset 0px 1px 0px #45c4fc;
  -moz-box-shadow: inset  0px 1px 0px  #45c4fc;
  -webkit-border-radius:4px;
  -moz-border-radius: 4px;
}
.click_logo i {
  background: url(https://m.click.uz/static/img/logo.png) no-repeat top left;
  width:30px;
  height: 25px;
  display: block;
  float: left;
}
© 2019 Click