Well we all are so perfect in typing HTML syntax aren’t we? Usage of HTML tags are easy and is very easy to understand. As the most widely used tags are FORM, Table, typography tags like p, span, heading and more. So why not try to automate it, and make life more easier. Usually HTML tags are paired with a back-end or front-end programming languages like PHP, Python, Javascript and more which helps us to make the site meet its desire needs.

Today I am using PHP to make life easier. As we all know the basic concepts of functions, parameters, classes, and the ways to call a function. Here is a simple example to do so. My example is for form, but you can do it for anything as needed.

We all know what a form consist of i.e. Form opening, closing, and some inputs consisting of type, name, id, placeholder, values and more. All these attributes of an input tag can be defined with a parameters into a function. as shown below:

function formOpen($action, $method='POST', $enctype=NULL) {return "<form action='$action' method='$method' enctype='$enctype'>";}

Here a function named “formOpen” is created with parameters action, method, and enctype by default the method is set to ‘POST’ and enctype field is set to NULL as we only use enctype for uploading images from a form. Later we attach the attributes of the form with the parameters values. Now we can call the function as follows:

echo formOpen('');

Now the form output we get is:

<form action='' method='POST' enctype=''>

Here one can check for if the passed parameters are empty or not to display it.

Similarly the above process can be repeated for inputs, checkbox, radio, submit, select and more as follows:

For opening and closing of a form tags:

<?phpclass Helpers {/*Starting a formconsists of parameter like action, method, enctype*/public function formOpen($action, $method='POST', $enctype=NULL) {return "<form action='$action' method='$method' enctype='$enctype'>";}/*Closing a form*/public function formClose() {return "</form>";}

For inputs like button, text, number, email and more…

public function inputs($type, $name, $class=NULL, $value=NULL, $checked=NULL) {// return "<input type='$type' name='$name' placeholder='Enter $name....' value='$value' id='$name'/>";$a = "<input type='$type' name='$name' placeholder='Enter $name....' value='$value' id='$name' class='$class'";$a .= ($checked!=NULL)?$checked:'';$a .= "/>";return $a;}

Form Labels:

For displaying the form labels here the function parameters are name and class, class is an optional parameter.

public function label($name, $class=NULL) {return "<label htmlFor='" . strtolower($name) . "' class='$class'>$name</label>";}

For select option tag:

Here as we know a select tag consist of various relative options, so basically we need an array, this array can be either an associative or index array as needed. Now to display every instances of the array a foreach loop is introduced.

public function select($name, $items, $class=NULL) {$a = "<select name='$name' class='$class'>";foreach ($items as $index=>$value):$a .= "<option value='$value'>$index</option>";endforeach;$a .= "</select>";return $a;}}

Now the above functions can be called in the following ways:

echo Helpers::formOpen('');

For text input type:

//for nameecho "<div>";echo Helpers::label('Name');echo Helpers::inputs('text', 'name', NULL, 'Evangelina');echo "</div>";

For Number input type:

//for phone numberecho "<div>";echo Helpers::label('Phone');echo Helpers::inputs('number', 'phone', NULL);echo "</div>";

For checkbox and radio:

Here one requires a checked parameter for checking as default, this can be send to the function in the fourth parenthesis.

//for radioecho "<div>";echo Helpers::label('Gender');echo Helpers::inputs('radio', 'gender', NULL, 'Male', 'checked');echo Helpers::label('Male');echo Helpers::inputs('radio', 'gender', NULL, 'Female');echo Helpers::label('Female');echo "</div>";
//for checkboxecho "<div>";echo Helpers::label('Interest');echo Helpers::inputs('checkbox', 'interest', NULL, 'Gaming', 'checked');echo "Gaming";echo Helpers::inputs('checkbox', 'interest', NULL, 'Coding');echo "Coding";echo Helpers::inputs('checkbox', 'interest', NULL, 'Sleeping');echo "Sleeping";echo "</div>";

For a select button:

Initially a associative or index array is required. Now the array is passed in the second parameter.

//for selectecho "<div>";echo Helpers::label('Country');$asso = ['Nepal' => 'Nepal','India' => 'India','China' => 'China','France' => 'France'];echo Helpers::select('country', $asso, NULL);echo "</div>";

For creating a button to submit,:

• The first parameter is for the input type.
• Second is the name and id of the button.
• Third parameter is for the class of the input.
• Fourth parameter expects value for the input.

//for buttonecho "<div>";echo Helpers::inputs('submit', 'submit', NULL, 'Submit');echo "</div>";

Calling the function to close the form tag. In this case, the function calling seems more hectic than just typing: </form>, so you can ignore this step.

echo Helpers::formClose();

Now the output we get is as follows:

https://miro.medium.com/v2/resize:fit:317/1*x10LtJg3gmHtMkEab57c-w.png

Browser Output

<form action='' method='POST' enctype=''><div><label htmlFor='name' class=''>Name</label><input type='text' name='name' placeholder='Enter name....' value='Dipesh' id='name' class=''/></div><div><label htmlFor='phone' class=''>Phone</label><input type='number' name='phone' placeholder='Enter phone....' value='' id='phone' class=''/></div><div><label htmlFor='gender' class=''>Gender</label><input type='radio' name='gender' placeholder='Enter gender....' value='Male' id='gender' class=''checked/><label htmlFor='male' class=''>Male</label><input type='radio' name='gender' placeholder='Enter gender....' value='Female' id='gender' class=''/><label htmlFor='female' class=''>Female</label></div><div><label htmlFor='intrest' class=''>Intrest</label><input type='checkbox' name='intrest' placeholder='Enter intrest....' value='Gaming' id='intrest' class=''checked/>Gaming<input type='checkbox' name='intrest' placeholder='Enter intrest....' value='Coding' id='intrest' class=''/>Coding<input type='checkbox' name='intrest' placeholder='Enter intrest....' value='Sleeping' id='intrest' class=''/>Coding</div><div><label htmlFor='country' class=''>Country</label><select name='country' class=''><option value='Nepal'>Nepal</option><option value='India'>India</option><option value='China'>China</option><option value='France'>France</option></select></div><div><input type='submit' name='submit' placeholder='Enter submit....' value='Submit' id='submit' class=''/></div></form>

Here I haven’t echo a line-break using ‘\n’ so the output is as follows but the minified version looks great, but one can add a \n to clean the outputs as follows:

echo Helpers::label('Name') ."\n";

The above steps can be done for various HTML tags. Thanks for viewing and Happy Coding Developers, keep learning…