Here’s a simple To-Do List Manager using PHP that allows users to create, view, and delete tasks. This tool will let users manage their tasks effectively.
1. PHP Code for Simple To-Do List Manager
<?php
session_start(); // Start a session to store the to-do list
// Initialize the to-do list if it doesn't exist
if (!isset($_SESSION['todo_list'])) {
$_SESSION['todo_list'] = [];
}
// Add a task to the to-do list
if (isset($_POST['add_task']) && !empty(trim($_POST['task']))) {
$_SESSION['todo_list'][] = htmlspecialchars(trim($_POST['task']));
}
// Remove a task from the to-do list
if (isset($_POST['remove_task'])) {
$task_index = $_POST['remove_task'];
unset($_SESSION['todo_list'][$task_index]);
$_SESSION['todo_list'] = array_values($_SESSION['todo_list']); // Reindex the array
}
?>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="A simple To-Do List Manager to create, view, and delete tasks.">
<meta name="keywords" content="To-Do List, Task Manager, PHP, Simple To-Do">
<title>Simple To-Do List Manager</title>
<style>
body {
font-family: Arial, sans-serif;
background-color: #f4f4f4;
margin: 0;
padding: 20px;
}
.container {
max-width: 600px;
margin: 0 auto;
padding: 20px;
background-color: #fff;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
}
h1 {
text-align: center;
}
form {
margin-top: 20px;
}
input[type="text"], input[type="submit"] {
width: 100%;
padding: 10px;
margin-bottom: 20px;
border: 1px solid #ccc;
border-radius: 5px;
}
input[type="submit"] {
background-color: #007bff;
color: #fff;
cursor: pointer;
}
ul {
list-style-type: none;
padding: 0;
}
li {
display: flex;
justify-content: space-between;
align-items: center;
padding: 10px;
border-bottom: 1px solid #ccc;
}
.remove-btn {
background-color: red;
color: white;
border: none;
padding: 5px 10px;
border-radius: 5px;
cursor: pointer;
}
</style>
</head>
<body>
<div class="container">
<h1>Simple To-Do List Manager</h1>
<form method="post">
<input type="text" name="task" placeholder="Enter a new task" required>
<input type="submit" name="add_task" value="Add Task">
</form>
<h2>Your Tasks</h2>
<ul>
<?php if (empty($_SESSION['todo_list'])): ?>
<li>No tasks added yet.</li>
<?php else: ?>
<?php foreach ($_SESSION['todo_list'] as $index => $task): ?>
<li>
<?php echo $task; ?>
<form method="post" style="display: inline;">
<input type="hidden" name="remove_task" value="<?php echo $index; ?>">
<input type="submit" class="remove-btn" value="Remove">
</form>
</li>
<?php endforeach; ?>
<?php endif; ?>
</ul>
</div>
</body>
</html>2. How the Simple To-Do List Manager Works
- Adding Tasks: Users can enter a new task in the input field and click “Add Task” to add it to their to-do list.
- Viewing Tasks: The current tasks are displayed in a list format. If there are no tasks, a message indicating that no tasks have been added appears.
- Removing Tasks: Each task has a “Remove” button that allows users to delete it from the list.
3. Integrating the Simple To-Do List Manager into WordPress
Method 1: Creating a Custom Plugin
Steps:
- Create a Plugin Folder:
- Go to
/wp-content/plugins/and create a folder calledsimple-todo-list-manager.
- Create the Plugin File:
- Inside the
simple-todo-list-managerfolder, create a file namedsimple-todo-list-manager.php. - Add the following PHP code:
<?php
/*
Plugin Name: Simple To-Do List Manager
Description: A simple To-Do List Manager to create, view, and delete tasks.
Version: 1.0
Author: Your Name
*/
session_start(); // Start a session to store the to-do list
// Initialize the to-do list if it doesn't exist
if (!isset($_SESSION['todo_list'])) {
$_SESSION['todo_list'] = [];
}
// Add a task to the to-do list
if (isset($_POST['add_task']) && !empty(trim($_POST['task']))) {
$_SESSION['todo_list'][] = htmlspecialchars(trim($_POST['task']));
}
// Remove a task from the to-do list
if (isset($_POST['remove_task'])) {
$task_index = $_POST['remove_task'];
unset($_SESSION['todo_list'][$task_index]);
$_SESSION['todo_list'] = array_values($_SESSION['todo_list']); // Reindex the array
}
// Function to display the To-Do List Manager
function simple_todo_list_manager_shortcode() {
ob_start(); // Start output buffering
?>
<div class="container">
<h1>Simple To-Do List Manager</h1>
<form method="post">
<input type="text" name="task" placeholder="Enter a new task" required>
<input type="submit" name="add_task" value="Add Task">
</form>
<h2>Your Tasks</h2>
<ul>
<?php if (empty($_SESSION['todo_list'])): ?>
<li>No tasks added yet.</li>
<?php else: ?>
<?php foreach ($_SESSION['todo_list'] as $index => $task): ?>
<li>
<?php echo $task; ?>
<form method="post" style="display: inline;">
<input type="hidden" name="remove_task" value="<?php echo $index; ?>">
<input type="submit" class="remove-btn" value="Remove">
</form>
</li>
<?php endforeach; ?>
<?php endif; ?>
</ul>
</div>
<?php
return ob_get_clean(); // Return the output
}
// Register the shortcode [simple_todo_list_manager]
add_shortcode('simple_todo_list_manager', 'simple_todo_list_manager_shortcode');
?>- Activate the Plugin:
- Go to the WordPress Admin Dashboard > Plugins and activate the Simple To-Do List Manager plugin.
- Add the Shortcode:
- To display the tool on any post or page, use the shortcode:
[simple_todo_list_manager]
This Simple To-Do List Manager allows users to easily create and manage their tasks. You can customize the styling as needed to fit the design of your WordPress site.
