📥Installation

Welcome to ug-webAdminPanel Installation! In this tutorial, we'll learn on how to install our Panel!

Currently, we can only install in Windows Systems. Linux Systems will be out soon!

1: XAMPP Installation

Installation

To get started, we need to install a program called by XAMPP. XAMPP is a software that allows us to start a web page with Apache. Let's install it by clicking here. Then, we need to wait 5 seconds and the download will start automatically.

Now, let's open the installer and click 'Yes'.

If it shows you a warning, just press the 'Ok' button.

After that, just follow this steps:

Click 'Next'

Select all the components and click 'Next'

Click 'Next'

Select 'English' and click 'Next'

Finally, click 'Next' to start the installation of XAMPP

When you're done, XAMPP will start installing in your computer. It may take 2-5 minutes depending on your computer.

If it shows you this Firewall Page, just press 'Authorize Access'

When you're done installing, you can uncheck the checkbox and click 'Finish'

Configuration

Now that our XAMPP is successfully installed, we are going to configure it with our necessary components to work with the panel.

First, let's open XAMPP

When you open XAMPP, you may see a panel. What we need for ug-webAdminPanel is:

Apache
MySQL DataBase

So, let's activate the two options by clicking in 'Start' in the panel and authorizing access to the Firewall.

And now, we successfully configured our XAMPP! Now, we can close the panel and start our Panel Installation.

2: Panel Installation

Installation

Now that we have XAMPP installed, we need to install our Panel. To do it, let's visit our GitHub Page by clicking here. After openned, we're going to click in the most recent release.

This Recent Release may not be the newest release. It can be another one than in this image!

Now, we should install the Panel Framework as our Server Framework. If you have a FiveM Server with ESX Framework, then install the ESX Version. If you have a FiveM Server with QB-Core Framework, then install the QB-Core Version. In this example, we're going to install the ESX Panel. Click on the correct framework version to start downloading.

The installing method is the same for each Framework Version! So, dont worry! You can follow this tutorial.

After the installation, we're going to extract the ZIP file to our Desktop.

With the folder in our Desktop, we can close the ZIP and open the extracted folder. It will contain all the files of ug-webAdminPanel.

Now, we're going to open our Apache folder. Go to your XAMPP installation location and open the folder 'htdocs'. The default installation location is 'C:\xampp'.

Delete everything that is inside the 'htdocs' folder and then drag all the files from ug-webAdminPanel to htdocs.

After that, you successfully installed your Panel! But wait! There's more to make it work! We need to make some more steps!

Right click on the file called by 'ug-webAdminPanel.sql' and click on 'Edit' and replace, where in the image is 'adminusername' by your username and where is 'yourpassword' by your password. This is to not let the default username and password to be in your database, or else someone can use it to enter in your account.

Example:

After that, press 'CTRL + A' and then 'CTRL + C' to copy the code. Now we're going to access our phpMyAdmin to create the Database and insert our account. To access it, click here. Your phpMyAdmin will load. Now, click on the 'SQL' button in the top of the website.

Now, paste the copied code in the input section and the press 'Continue'.

We finished our installation! To check if it's working, we need to enter to our panel. To access it, you just need to put in your URL bar the following URL or by clicking here:

http://localhost/

If it's working, the website may appear like this:

Congratulations! You installed ug-webAdminPanel!

Configuration

To make everything work now, we need to configure it. To do it, let's return back into our Website folder, the 'htdocs' folder. Now, follow these steps:

Open the folder 'app'

Open the folder 'config'

Open the file 'config.php', press 'More Applications', select 'Notepad', uncheck the checkbox and press 'Ok'.

Here you can modify some of the panel settings, such like Website Name, Discord Log (Webhooks) and more! What we're going to modify now is the database. Let's scroll down until you see Database Config & Server Database Config. Here we're going to put our Database credentials to work with the panel.

For the Database Config, here's the translation: