PHP Content Management Module
Looking for PHP Contact Form Script? Click Here.
Download and learn how this simple PHP Web Page Content Management System was made. Technologies used include PHP OOP, MySQL, Bootstrap and jQuery.
This source code will enable you to manage a dynamic web page content. You can format the content the way you want it. Put links, files, images, texts and more on your web page.
The system looks simple. But I assure you that when you study the source code, you will learn a lot of useful PHP coding techniques.
Some include: How to use a rich text editor with a file manager and browser, coding an SEO-friendly web page, file upload and deletion, system user restrictions and more! You can see the detailed list of features on section 6.0 below.
This source code is a very good starting point if you’re trying to build your own PHP Web Page Content Management System (CMS) and add some more complex features later.
Before you download, please make sure you have basic understanding of the following topics.
a. PHP, MySQL and OOP CRUD Tutorial – Step by Step Guide!
b. Apache .htaccess RewriteRule Examples
Once you learned our tutorials above, this source code should be easy to understand.
Below are some screenshots of our script’s output. You can click an image to view the larger version of it.
Please note that the following images are just output previews. New features might be added already the time you are reading this.
[espro-slider id=5990]
Our database name will be “php_web_page_cms”, and we will have two tables: Pages and Users.
The following folders and files are included in our source code. It will have more meaning if you will see the code inside the folders and files.
├─ admin/
├─── create_page.php
├─── delete_page.php
├─── index.php
├─── layout_foot.php
├─── layout_head.php
├─── login_checker.php
├─── navigation.php
├─── paging.php
├─── remove_featured_image.php
├─── search_page.php
├─── update_page.php
├─ config/
├─── core.php
├─── database.php
├─ dev/
├─── php_web_page_cms.sql
├─── readme.txt
├─ images/
├─ libs/
├─── css/
├────── bootstrap/
├────── font-awesome/
├─── js/
├────── bootstrap-image-gallery/
├────── responsive_filemanager/
├────── tinymce/
├────── bootbox.min.js
├────── custom-script.js
├────── jquery.js
├─── php/
├────── pw-hashing/
├────── utils.php
├─ objects/
├─── page.php
├─── user.php
├─ .htaccess
├─ index.php
├─ info.php
├─ layout_foot.php
├─ layout_head.php
├─ login.php
├─ logout.php
├─ navigation.php
├─ page.php
| FEATURE | PHP WEB PAGE CMS |
| Learn more techniques when coding with PHP, MySQL and OOP | YES |
| Save your precious time coding and searching about how to do the features below. | YES |
| PHP PDO and Prepared Statements | YES |
| jQuery enabled | YES |
| Bootstrap enabled | YES |
| Font-awesome enabled | YES |
| TinyMCE enabled | YES |
| Buttons are displayed with appropriate icons | YES |
| USER | |
| Login using email and password | YES |
| Log out user | YES |
| Hashed password stored in database | YES |
| Logged-in user name display on the right side of navigation bar | YES |
| Log-out button displayed on drop-down when user name was clicked | YES |
| Page can be edited and deleted by the user who created it | YES |
| When user tries to edit a page he did not created, he will be redirected to home page | YES |
| ‘View Page’ nagivation bar will show ‘Admin’ if user is logged in, else it will be a link to login page | YES |
| CREATE A PAGE | |
| Title field | YES |
| Title is shown as page title when shared on Facebook | YES |
| Slug field | YES |
| Slug must be unique (validated when form was submitted) | YES |
| Slug is formatted automatically via JavaScript when form not yet was submitted | YES |
| Slug is formatted automatically via PHP when form was submitted | YES |
| Fill out slug field automatically while you type | YES |
| Fill out slug field automatically when title field loses focus | YES |
| Body field | YES |
| Rich text editor using TinyMCE (like WordPress) | YES |
| Upload and browse files using a file manager | YES |
| Format your content with links, texts, images and more. | YES |
| Meta Description field | YES |
| Meta Description is shown as page description when shared on Facebook | YES |
| Featured Image field | YES |
| Featured Image is shown as page image when shared on Facebook | YES |
| Featured Image allowed file types: JPG, PNG, GIF | YES |
| Featured Image must be less than 1MB in size | YES |
| Save Featured Image file in server directory | YES |
| Status field | YES |
| Page ‘Status’ can be ‘Draft’ or ‘Published’ | YES |
| Button link to read pages | YES |
| Only a logged in user can create a page, else he will be redirected to login page | YES |
| READ PAGES | |
| Display list of pages | YES |
| Featured Image column | YES |
| Title column | YES |
| Status column | YES |
| Author column | YES |
| Created column | YES |
| Actions column | YES |
| Featured images can be clicked and shown in a lightbox | YES |
| View page button to view page content | YES |
| Edit button to update page content | YES |
| Delete button to delete page content | YES |
| Clicking ‘Delete’ button will show confirmation pop up | YES |
| Edit and Delete button will appear only if the logged-in user created that page | YES |
| Pagination for list of pages | YES |
| UPDATE A PAGE | |
| Read Pages button to go back to list of pages | YES |
| Fields has almost the same features as the ‘Create Page’ section above, but the following are some differeces | YES |
| View Page button to view page content | YES |
| Fill out form fields with data from database (based on given page ID) | YES |
| Show uploaded featured image (if any) under Featured Image field | YES |
| ‘Remove Featured Image’ button under Featured Image | YES |
| Clicking ‘Remove Featured Image’ button will show confirmation pop up | YES |
| Featured image can be clicked and shown in a lightbox | YES |
| Highlight Bootstrap radio button based on selected ‘Status’ | YES |
| ‘Slug’ field is not fill out automatically when ‘Title’ field was changed. This is because it is not recommended to change a page URL. | YES |
| DELETE A PAGE | |
| Clicking ‘Delete’ button will show confirmation pop up | YES |
| If user clicked ‘No’, pop up will disappear and nothing will be deleted | YES |
| If user clicked ‘Yes’, it will post page ID to delete_page.php so it can be deleted | YES |
| SEARCH PAGES | |
| User can enter search term in search box, then press enter to search | YES |
| System will search page title, slug, body and meta description for the search term | YES |
| Display list of pages with the search term | YES |
| Pagination in search results | YES |
| VIEW PAGE | |
| Show page title | YES |
| Show featured image | YES |
| Clicking featured image will show it in a lightbox | YES |
| Show page content / body | YES |
| All images in the body can be clicked and shown in a lightbox | YES |
| Show author and date created | YES |
| Show share buttons with icons | YES |
| Users can share the page to Facebook, Twitter or Google+ | YES |
| ‘Edit This Page’ button will appear under ‘Title’ if user is logged in | YES |
| SEO-friendly URL. Page URL does not have parameter like page ID. Page content is retrieved by slug. | YES |
| Used Apache .htaccess file to make SEO-friendly URL work | YES |
| Select ‘Published’ pages in navigation drop-down | YES |
| SUPPORT AND UPDATES | |
| Free support for 6 months. | YES |
| Free source code updates. | YES |
| [purchase_link id=”16098″ text=”DOWNLOAD SOURCE CODE NOW” style=”button” color=”green”] | |
If you download this (PHP Web Page Content Management System) source code, here are the few instructions how to run this source code:
1. Copy the extracted files to your localhost or upload it to your webserver.
2. You have to create your database using PhpMyAdmin, name of the database: php_web_page_cms
3. Import the SQL file called “php_web_page_cms.sql” located in the “dev” folder.
4. Change line 7 .htaccess file (No changes should be made if you put the files on the root directory of your localhost)
RewriteBase /YOUR_ROOT_DIRECTORY/
5. Run the login.php file on your browser, use the following user credentials.
User #1
Username: [email protected]
Password: ninja12qw!@QW
User #2
Username: [email protected]
Password: darwin12qw!@QW
To make TinyMCE file manager / file browser work: (No changes should be made if you put the files on the root directory of your localhost)
Change line 71 of /libs/js/responsive_filemanager/filemanager/config/config.php
'upload_dir' => '/YOUR_ROOT_DIRECTORY/libs/js/responsive_filemanager/source/',
Change line 78-79 of /admin/layout_foot.php
external_filemanager_path:"/YOUR_ROOT_DIRECTORY/libs/js/responsive_filemanager/filemanager/",
external_plugins: { "filemanager" : "/YOUR_ROOT_DIRECTORY/libs/js/responsive_filemanager/filemanager/plugin.min.js"},
[adinserter block=”30″]
Thank you for reading about this PHP Web Page Content Management System source code and supporting our projects here at codeofaninja.com!
If you have any questions, comments or suggestions, please do not hesitate to contact me.
a. Send me an email. My email address is [email protected]
b. Go to https://fb.com/codeofaninja and chat me up.