How to display star ratings from the database in PHP and MySQL

You can display star rating which is stored as integer (1 to 5) in database, in an html table using PHP and MySQL. For example, if you want to show a list of hotels with thier star ratings ( from 1 star to 5 star), you can develop an application in PHP to display them in a html table.

In this topic, we will create this simple application to display star ratings using PHP and MySQL.

We will take a simple example of a database table that stores hotel details. Each hotel has a rating field which is a number and can have values between 0 and 5. We have added '0' also for not rated hotel. Each number has caption, 0 - Not Rated, 1- One Star, 2 - Two Star , 3 - Three Star, 4 - Four Star, 5 - Five Star.

We will display the details of the hotels in a html table and in this table, there will be one column for rating. In the rating field, we will display the star symbols and the description or caption for each rating with color as shown below.

how to display star rating in php and mysql

Assumption

You must have basic knowledge of HTML and CSS. You can read below topics for more details:

Folders and Files

Below is a screenshot of the folder structure and files used:

I have created a folder called 'star_rating' under 'xampp/htdocs' as I am using XAMPP. If you are using WAMP, create 'star_rating' folder under 'www'.

Folder 'cfg' - In this folder I have kept dbconnect.php which is used to connect to the MySQL database.
Folder 'css' - Custom stylesheet is in this folder
index.php is the main program that displays a list of hotels with star rating.

Below is the screenshot of the page:

Star Rating display page in PHP

Development Steps

Step 1 - Create a MySQL table for hotels
Step 2 - Connect to MySQL database (dbconnect.php)
Step 3 - Write a PHP program to display hotels with star ratings(index.php)
Step 4 - Add CSS (style.css)

Step 1 - Create a database table for hotels

Let us create a table named 'hotels' in MySQL database. I have a database called 'demo'. So 'hotels' Table will be created in this database. If you have an existing database other than demo you can also use it. Just make sure same table name does not exist already. Table structure is given below:

Table has 5 columns.

id - It is the primary key and auto incremented
hotel_name - Name of the hotel
description - Description of the hotel
rating - Rating of the hotel, it is an integer, values 0 - 5
date_modified - Date of modification, default current date

Create table script for this table is given below, you can use this code to create the table. You can also download the scripts from the download section later in this topic.

hotels.sql

After you run the scripts, verify if data is inserted correctly, it should have below data in it:

Step 2 - Connect to MySQL database (dbconnect.php)

Use below script to connect to the database. Note that we have this database connection php program in 'cfg' folder. This is written once and used in every program where database connection is needed. This will be easy for maintenance and also will enable reusability of the code.

dbconnect.php

I am using mysqli_connect() function which needs 4 parameters.

server - in our case it is localhost
userid - we are using root user
password - no password for user root
database name - demo in our case.

For detail database connection understanding please read topic How to connect to MySQL database in PHP using MySQLi and PDO.

Step 3 - Write a PHP program to display hotels with star ratings (index.php)

Rating for each hotel will be displayed as star symbol and depending on the rating, one or more star symbols will be highlighted. Also, a description of the rating will be displayed with color code, like for One Star it will be red and for Five Star color will be green. If no rating is given, default rating will be zero and it will denote Not-Rated as shown below:

Let us now see the code of index.php

index.php

We have a simple html table with three fields. For rating, we have a number, but we need to display stars and highlight number of stars based on the rating value.

Using a for loop, star symbols are displayed. All stars with values less than or equal to the rating are being added with a class called 'selected'. This class is defined in the style.css and it is used to show stars with highlighted color.

Step 4 - Add CSS (style.css)

Let us add below styles. I have already added style.css in index.php.

style.css

You can see class 'selected' is added along with other simple styles. Keep this style.css file in your css folder.

Test the Application

Make sure in your XAMPP control panel Apache and MySQL services are running. Open the browser and run localhost/star_rating. You will see the below page displayed as below:

display star rating page in php and mysql

You can see the stars are showing with color for specific rating. If there is no rating it means rating is 0, then it displays Not-Rated and no star is colored.

Hope you could understand all the steps and you could develop and test it successfully.

Download Source Code

I have put all codes in a zip file. You can download it by clicking on the Download button below. You do not need to register yourself to download it. You can directly use the code or you can modify them as per your requirements.

Conclusion

In this topic, I have given example for the hotel; it can be the rating for a product or feedback as well. You can change to meet your requirements using the similar structure and concept. Hope it will be useful for you.