“WordPress Plugin Maker (Freelancer Version)” Documentation by “Regel” v1.0

---

“WordPress Plugin Maker (Freelancer Version)”

---

Table of Contents

1. Installation Instructions
2. Working with Projects
3. Image Size
4. Custom Post Types
5. Metabox
6. Admin Bars
7. Shortcodes and Quicktags
8. Options
9. Widgets
10. WP Ajax
11. Style
12. Javascripts
13. Admin Menu
14. TinyMCE Plugin
15. Code Explanation
16. Licenses
17. Change Logs

---

A) Installation Instructions - top

Installation

1. Extract the archive file "plugin_maker.zip"
2. Then uploaded into your web hosting or if work on the project in localhost simply copy it, Suggested in your WordPress folder. as follows:

   

3. After you successfully copy or upload, you can use it open url address in browser, "http://localhost/yourwp/plugin-maker/" or "http://yourdomain/yourwp/plugin-maker/"

Preferences

1. On the Menu , point to Preferences and then click it.
2. On the preferences page you can change the layout, and determine the location of wordpress used to live test
3. Press Save button

---

B) Working with Projects - top

Create a New Project

1. On the Menu , point to New Project and then click it.
2. In the Project properties tab, enter the text in to Plugin Name, Short Name, Plugin URL, Description, Tags, Version, Requires, At least, Up to, Stable tag, Localization, Author, Author URL, License and License URL
3. Press Save button, it will go to Existing Projects tab

Project Status and Lock/Unlock

For choose current project you must change status project to active and if you want to edit the project must be unlock .

1. On the Menu , point to Project Manager and then click it.
2. In the Existing Project tab, there is a table with columns: status, lock and delete. To make it active by clicking on button down () on the status column then click active to change into active status , and vice versa.
3. Then, if you want to edit the project must be unlock on the lock column .

Delete the Project

• On the Menu , point to Project Manager and then click it.
• Stiil in the Existing Project tab, choose the project what do you want to delete then press Delete button.
• Press Yes, I agree button

Backup and restore

As a precaution, so as not to lose the project when something unexpected happens, you can perform the backup process

1. On the Menu , point to Backup and then click it.

If you want to restore the project that has been in the backup, follow these steps:

• On the Menu , point to Project Manager and then click it.
• Click Backup tab, choose the project what do you want to backup then press Restore button.
• Press Yes, I agree button

You can also delete, or download the existing backup.

Build a Project

Build a project is to transform the project into a code plugin, this will form the files needed for the plugin, such as readme.txt, file PHP, JS, CSS and others. It does not require any particular action, automatically run itself. But if you want to do it manually, you can click the Build Project .

Build Project consists of three tabs, ie Build Project itself, review projects and code view. The Build Project tab there is a reset button and the download button. Reset button is used to delete files previously created and then rebuild a new code, this action is necessary if there is a change in the previous project settings. While the delete button is used to download the plugin that has been finished.

You can see the all settings by clicking on the Review Project tab and to look at the generated code you can click on the Code View tab

---

C) Image Size - top

Setup Image Size

To create a thumbnail support certain size

1. On the left sidebar, select the image size
2. On the form you can select how much the image size you need.
3. Fill in the required fields such as width , height and crop
4. Then click the save button

Button with a picture of a garbage on top right is used to remove the form and the Remove button is used to repeat from empty

Code for Retrieving

To obtain a predetermined image size, use code like this:

---

D) Custom Post Types - top

Register Post Type

Post types you can use to save data to a database, such as database instance books, comics, movies, etc.

1. On the left sidebar, select the Post Type
2. On the form you can select how much the Post Type you need.
3. Fill in the required fields such as Name , Description , Icon (support dashicon) and Supports (fields will be used)
4. The contents of the text is also the language used
5. Then click the save button

Button with a picture of a garbage on top right is used to remove the form and the Remove button is used to repeat from empty

Code for Front-end

To change the layout of front-end, is on file with the name structure:

plugin_name/includes/post_type.aaa.inc.php

aaa = a post type name

All required variables exist in its class __construct , you can use it quickly, if it is not needed you can delete it. While on markup function that will come out on the front-end page.

---

E) Metabox - top

Register Metabox

Metabox is a toolbar on the new or edit a post/page, it is used to store additional information into the database. How to make it do the following:

1. On the left sidebar, select the Metabox
2. On the form you can select how much the Metabox you need.
3. Fill in the required fields such as Name , Label , Display at (On page post what you want to display) and HTML Markup may leave blank
4. Fill also postmeta , postmeta the desired additional information columns. To delete a postmeta, fill blank the column name. postmeta will add javascript and css automatically.
5. Then click the save button

Code for Back-end

To change the back-end layout metabox, is on file with the name structure:

plugin_name/includes/metabox.bbb.inc.php
plugin_name/includes/assets/js/aaa_metabox.js
plugin_name/includes/assets/css/aaa_metabox.css

aaa = plugin short name
bbb = a metabox name

---

F) Admin Bars - top

Create Admin Bars

While you are logged in to WordPress, this toolbar on the top the admin bar.

1. On the left sidebar, select the Admin Bars
2. On the form you can select how much the Admin Bars you need.
3. Fill in the required fields such as ID (ID Link), Anchor (Label), URL (Link/href) and Parent ID
4. Then click the save button

---

G) Shortcodes and Quicktags - top

Create Shortcodes and Quicktags

Shortcodes have been introduced for creating macros to be used in a post's content. and Quicktags is additional buttons in the Text (HTML) mode of the WordPress editor.

1. On the left sidebar, select the Shortcodes/Quicktags
2. On the form you can select how much the Shortcodes you need.
3. Fill in the required fields such as Tag , Title , HTML Markup , Sample WordPress API , Post Type and Properties
4. Then click the save button

---

H) Plugin Option - top

Create Option

Creating custom options panels in WordPress

1. On the left sidebar, select the Plugin Options
2. On the form you can select how much the Field you need.
3. Fill in the required fields such as Name , Label , Type , and Default Value
4. Then click the save button

Code for Retrieving

You can also find it by accessing wp live test

---

I) Widget - top

Create Widget

1. On the left sidebar, select the Widgets
2. On the form you can select how much the widget you need.
3. Fill in the required fields such as ID , Title , and Desc
4. For the front-end display, you can select Example WordPress API and Post-Type do you need, and also you can insert the External Javascript and External CSS
5. For the back-end display, you can add some widget option
6. Then click the save button

Code for Front-end

To change the layout of front-end, is on file with the name structure:

plugin_name/includes/widget.[bbb].inc.php
plugin_name/assets/css/[aaa]_widget_[bbb].css
plugin_name/assets/js/[aaa]_widget_[bbb].js

aaa = plugin shortname
bbb = widget id

All required variables exist in its class __construct , you can use it quickly, if it is not needed you can delete it. While on markup function that will come out on the front-end page.

You can also find it by accessing wp live test

---

J) WP Ajax - top

Create WP Ajax

WP Ajax is the standardization of processing ajax and php response in WordPress, it is very effective to avoid the vulnerability Auth by Pass

1. On the left sidebar, select the WP Ajax
2. On the form you can select how much the ajax you need.
3. Fill in the required fields such as ID , Admin Area (Priv/No Priv) , Form Query , Sample WordPress API , and Post Type
4. For the back-end display, you can add some widget option
5. Then click the save button

---

K) Styles - top

Insert Style

If you want to add css file into the code must use the available menu.

1. On the left sidebar, select the Styles
2. On the form you can select how much the css you need.
3. Fill in the required fields such as ID , Source , Admin Area , Version , and Hooks
4. Then click the save button

---

L) Javascripts - top

Insert Javascript

1. On the left sidebar, select the Javascripts
2. On the form you can select how much the javascript you need.
3. Fill in the required fields such as ID , Source , Admin Area , Version , and Hooks
4. The scripts that must be loaded before this script, please checked (default jQuery)
5. Then click the save button

---

M) Admin Menu - top

Create Admin Menu

This form will be create admin menu and admin page code

1. On the left sidebar, select the Admin Menu
2. On the form you can select how much the admin menu you need.
3. Fill in the required fields such as Name , Label , Icon , HTML Markup , Javascript and CSS
4. Then click the save button

---

N) TinyMCE Plugin - top

Create TinyMCE Plugin

1. On the left sidebar, select the TinyMCE Plugin
2. On the form you can select how much the TinyMCE Button you need.
3. Fill in the required fields such as Button Name , Label , Icon and Sample Code
4. Then click the save button

---

O) Code Explanation - top

Structure Files

This tool will create a plugin with a file structure is as follows:

CSS Explanation

For CSS Folder exist in the folder assets, CSS file naming is as follows:

Firstly we will start off by seeing the wrong way of adding stylesheets to WordPress and a common way I've seen people add stylesheets to WordPress. Because CSS stylesheets are added to the head tag of a web page and people are familiar with the wp_head action, they will use this to add stylesheets to the page.

Use CSS menu on the left to add css file or you can use the function wp_enqueue_style. For coding, HTML tag given id with the prefix taken from Plugin ShortName, Use Inspect Element on the browser to know the ID/CLASS, it is advisable to use the best practice coding css wordpress

JS Explanation

For JS file also exist in the folder assets, JS file naming is as follows:

To insert JS file you also have to use the existing Javascript menu on the left side of the tool or if it can use the manual coding use the function wp_enqueue_script and Please read JavaScript Best Practices as guidance

PHP Explanation

Together with the file name, the function name as well. Consider the example shown below:

In editing the file of course you need a reference, for there have been references to the codes. That way you can get easy reference, this will be easier if you use editor that supports IDE like netbean.

Maybe there are some variables that are not needed by you, you can remove it if it is not needed. It is useful to simplify / speed up your work by displaying the variable using the echo / print.

---

P) Licenses - top

Product

• Regular License
• Extended License
• Tools License

Third Parties

Name	License	Web
Colorbox	MIT License	http://www.jacklmoore.com/colorbox
EditArea by Christophe Dolivet	Licensed under the Apache License, Version 2.0 GNU Library Public License, version 2 BSD License	https://sourceforge.net/projects/editarea/
jsTree by Ivan Bozhanov	MIT License	http://jstree.com/
bootstrap tagsInput by Tim Schlechter	MIT License
jQuery Validation Plugin by Jorn Zaefferer	MIT License	http://jqueryvalidation.org/validate/
Bootstrap by Twitter, Inc	MIT License	http://getbootstrap.com/
jQuery by jQuery Foundation, Inc	jquery.org/license	http://jquery.org
Holder - client side image placeholders by Ivan Malopinsky	MIT License	http://holderjs.com
Font Awesome by davegandy	MIT License SIL OFL 1.1	http://fontawesome.io
Dashicon by wordpress.org	GNU General Public License version 2 SIL OFL 1.1	http://wordpress.org

---

Q) Change Logs - top

1. Version 1.0 (Rev. 15.11.01)
   • Release
2. Version 1.0 (Rev. 15.11.12)
   • Documentation using Envato Template
   • Adding "Code Explanation" on documentation
   • Adding "Change Logs" on documentation
   • Add readme.txt and licenses.txt
3. Version 1.0 (Rev. 15.11.30)
   • Fix Documentation
   • Adding "FAQs" on Help Tools
   • Fix Some Bugs
   • Add Datepicker on Metabox PostMeta
   • Fix Plugin Text Domain/Translatation
   • Add Dropdown Page Dinamic on Metabox PostMeta
   • Add Media Upload Dinamic on Metabox PostMeta

---

---

Once again, thank you so much for purchasing this tool. As I said at the beginning, I'd be glad to help you if you have any questions relating to this theme. No guarantees, but I'll do my best to assist. If you have a more general question relating to the tool on Codecanyon, you might consider visiting the forums and asking your question in the "Item Discussion" section.

Regel

Go To Table of Contents

---