VueJS + WHMCS One Step Checkout Orderform Template

About VueJS + WHMCS One Step Checkout Orderform

WHMCS VueJS + WHMCS One Step Checkout Orderform Reduce your abandonment rate and accelerate your conversion speed by 10X with the most powerful and lightweight VueJs One Step Checkout Orderform. This fully responsive Checkout Orderform is highly optimized with Vue.js, a progressive JavaScript Framework to streamline the checkout processes simply.

Installation Guide

How to Download the Module Files?

1. Go to WHMCS main website i.e. https://whmcsglobalservices.com.

2. Next, login to your Client Area i.e. https://whmcsglobalservices.com/members/clientarea.php.

3. Now, Download the VueJS + WHMCS One Step Checkout Orderform depending on the WHMCS version you are using.

4. Once you have done that a zip file will start downloading.

Module files have been successfully downloaded.

How to install and configure VueJS Module Files?

1.After download now you will see the Vuejs WHMCS orderform folder

2. Open the Vuejs WHMCS orderform folder now you will see the two folders order and WHMCS, and open the order folder

3. After click order folder you will see the configure folder. Now click on config folder to move on next step

4. Now open the config folder you will see the config_opc.new file now rename it with config_opc.js

5. After removing.new your file looked like this

6. After renaming it open the file and the put the WHMCS url on this path

7. After all process upload the order folder in WHMCS set up folder or outside the WHMCS set up folder.

Note: Make sure these two folders(WHMCS and Vuejs) are in same server

How to upload the addon module for Vuejs cart ?

1.Click on WHMCS folder

2. Now you will see these two folders and open the modules folder

3. The addons folder will appear after you click the module folder.

4. Upload addon "vueWhmcsCart" folder to WHMCS (whmcs_root/modules/addons/)

How to upload language and configure language variables

1.Click on the lang folder

2.After lang folder you see the overrides folder

3. Upload "overrides" folder to WHMCS (whmcs_root/lang/).

Note: If the overrides folder is not there, then you need upload the overrides folder. If an overrides folder already exists, don't overwrite it. Take the following steps below

4. Now go to (whmcs_root/lang/overrides/)

4.1 Open English.php file or your language file

4.2 Copy all the variables given below and paste it over end of the file.

$_LANG['vueOpcNavChooseDomain'] = "Choose Domain";
$_LANG['vueOpcNavChoosePlan'] = "Choose Plan";
$_LANG['vueOpcNavPayment'] = "Payment";
$_LANG['vueContinuePayment'] = "Continue to Payment";
$_LANG['vueMoneyBack'] = "Money-back";
$_LANG['vueMoneyGuarantee'] = "100% guarantee";
$_LANG['vuePromoCodeTitle'] = "Have a promo code?";
$_LANG['vuePromoCodeRequired'] = "Promo code required";
$_LANG['vueInvalidUrl'] = "is an Invalid URL";
$_LANG['vueOneTimeDiscount'] = "One Time Discount";
$_LANG['vueOpcDomainRequired'] = "Domain Required";
$_LANG['vueOpcSave'] = "Save";
$_LANG['vueOpcWelcomeBack'] = "Welcome Back";
$_LANG['vueOpcGoClientArea'] = "Go to Clientarea";
$_LANG['vueOpcDomainRegister'] = "Register a new domain";
$_LANG['vueOpcDomainTransfer'] = "Transfer your domain from another registrar";
$_LANG['vueOpcDomainOwn'] = "I will use my existing domain and update my nameservers";
$_LANG['vueOpcDomainSubdomain'] = "Use a subdomain from ";
$_LANG['vueOpcDomainAvailableYay'] = "Yayy!";
$_LANG['vueOpcDomainAvailableYourDomain'] = "Yayy Your domain is available!";
$_LANG['vueOpcDomainAvailableAt'] = " is available just at ";
$_LANG['vueOpcDomainAvailableFor'] = " for ";
$_LANG['vueOpcDomainAvailableFreeDomain'] = " . Domain price will be updated if your cart is applicable for free domain";
$_LANG['vueOpcAddCartButton'] = "Add to cart";
$_LANG['vueOpcCancelCartButton'] = "Cancel";
$_LANG['vueOpcDomainAddedCart'] = "Your domain successfully added to cart.";
$_LANG['vueOpcDomainFound'] = "+ result found";
$_LANG['vueOpcDomainUnavailable'] = "Domain is unavailable!";
$_LANG['vueOpcDomainUnavailableTagLine'] = "Sorry, this domain is already taken.";
$_LANG['vueOpcDomainAddedSuccess'] = "Your domain successfully added to cart.";
$_LANG['vueOpcDomainAdditionalFields'] = "Additional Domain Fields";
$_LANG['vueOpcDomainUpdateConfiguration'] = "Update Configuration";
$_LANG['vueOpcProductDiscountLabel'] = "when choose for";
$_LANG['vueOpcCartItem'] = "item";
$_LANG['vueOpcCartItems'] = "items";
$_LANG['vueOpcSubdomainLabel'] = "http://";
$_LANG['vueOpcSubdomainPlaceHolder'] = "yourname";
$_LANG['vueOpcDomainUpdatedMessage'] = "Domain configuration updated successfully";
$_LANG['vueOpcCurrencyChangeMessage'] = "Updating the currency will erase all your custom settings made on the cart.";
$_LANG['vueOpcCurrencyNote'] = "Note";
$_LANG['vueOpcConfirmButton'] = "Confirm";
$_LANG['vueOpcAddonAddButton'] = "Add";
$_LANG['vueOpcAddonAddedButton'] = "Added";
$_LANG['vueOpcApplyCreditAmount'] = " from my credit balance to this order and I will pay the remaining amount via the payment method selected below.";
$_LANG['vueOpcApplyCreditAmountNoFurtherPayment'] = " from my credit balance to this order. No further payment will be due.";
$_LANG['vueOpcConfigurableTotalPrice'] = "Total price configurable options";
$_LANG['vueOpcDomainAddonsTotalPrice'] = "Total price domain addons";
$_LANG['vueOpcApplyTextCredit'] = "Apply";
$_LANG['vueCopyText'] = "Copy";
$_LANG['vueOpcDomainRequiredText'] = "The product/service you have chosen requires a domain name. Please enter your domain name choose domain section.";
$_LANG['vueOpcAddonBilled'] = 'Billed";
$_LANG['vueOpcMoreProductGroup'] = 'More Product Group';
$_LANG['vueOpcChangeProductGroup'] = 'Change Product Group";,
$_LANG['vueOpcChangeProductGroupDesc'] = 'If you change the product group now, all your current order details will be lost.';
$_LANG['vueOpcCyclemonthly'] = 'per month';
$_LANG['vueOpcCyclequarterly'] = 'per 3 month';
$_LANG['vueOpcCyclesemiannually'] = 'per 6 month';
$_LANG['vueOpcCycleannually'] = 'per 12 month';
$_LANG['vueOpcReccuringDiscount'] = 'Recurring Discount';$_LANG['vueOpcUseSubDomainHead'] = 'use a free subdomain from us';
$_LANG['vueOpcUseSubDomainDescp'] = 'You can use free subdomain from us with hosting';
$_LANG['vueOpcUseOwnDomainHead'] = 'use your own domain';
$_LANG['vueOpcUseOwnDomainDescp'] = 'You can use your own domain with hosting';
$_LANG['vueOpcAdditionalRequired'] = 'Additional Required Information';
$_LANG['vueOpcFreeDomainTagLine'] = 'Free Domain For 1st Year';
$_LANG['vueOpcFreeDomainToolTip1'] = 'After Choosing this billing cycle.you get a free domain for one year.';
$_LANG['vueOpcFreeDomainToolTip2'] = 'Choose from ';
$_LANG['vueOpcFreeDomainToolTip3'] = 'domains.';
$_LANG['vueOpcFreeDomainToolTip4'] = 'After the first year, your domain will renew at the regular rate.';