Break · Build · Repeat

daily notes

Fri, 03 Apr 2026 00:00:00 +0000

Creating a block

block.json

{
 "$schema": "https://schemas.wp.org/trunk/block.json",
 "apiVersion": 3,
 "name": "create-block/copyright-date-block",
 "version": "0.1.0",
 "title": "Copyright Date Block",
 "category": "widgets",
 "description": "Display your site's copyright date.",
 "example": {},
 "supports": {
 "color": {
 "background": false,
 "text": true
 },
 "html": false,
 "typography": {
 "fontSize": true
 }
 },
 "textdomain": "copyright-date-block",
 "editorScript": "file:./index.js",
 "render": "file:./render.php"
}

Similar to the useBlockProps() function in the Editor, get_block_wrapper_attributes() outputs all the necessary CSS classes and styles in the block’s wrapper. Only the content needs to be updated.

<?php
...
?>
<p <?php echo get_block_wrapper_attributes(); ?>>© <?php echo date( "Y" ); ?></p>

adding block attributes

"example": {},
"attributes": {
 "showStartingYear": {
 "type": "boolean"
 },
 "startingYear": {
 "type": "string"
 }
},

You can create your own custom panels using the InspectorControls component. The InspectorControls belongs to the @wordpress/block-editor package.

daily notes

Thu, 02 Apr 2026 00:00:00 +0000

Gutenberg replaced the “Classic Editor” (which was essentially a digital typewriter) with a modular system. Every element—a paragraph, an image, or a button—is a standalone object (a block).

The “Core” Categories:

Common Blocks: The essentials (Paragraph, Heading, Image).
Formatting: Tools for structured data like Table, Code snippets, or Pullquotes.
Layout Elements: These are “container” blocks. Columns, Groups, and Rows allow you to create complex grid structures without writing HTML/CSS from scratch.

daily notes

Wed, 01 Apr 2026 00:00:00 +0000

Notices

In the WordPress Block Editor, Notices are UI messages used to inform users about events, errors, warnings, or successful operations. They are typically displayed at the top of the editor or inside specific UI components.

WordPress provides a Notices API through the @wordpress/notices package, which integrates with the WordPress data store system.

Common use cases:

Showing validation errors
Confirming successful actions
Displaying warnings or info messages
Communicating background processes to the user

Types of Notices

The main types of notices include:

daily notes

Tue, 31 Mar 2026 00:00:00 +0000

Widgets Block Editor Overview

The Widgets Block Editor replaces the traditional Widgets screen in WordPress with a block-based interface similar to the post/page editor introduced with the Gutenberg.

Instead of dragging classic widgets into widget areas, users can now insert blocks into sidebars and widget areas.

Block-based editing experience
Consistent UI with the post/page editor
Access to all available blocks in widget areas
Ability to mix blocks and legacy widgets

daily notes

Mon, 30 Mar 2026 00:00:00 +0000

Session Fixation is a security vulnerability where an attacker “fixes” a user’s session ID before the user even logs in. If the application doesn’t change the session ID upon authentication, the attacker can use that pre-set ID to hijack the user’s account.
Attacker visits target website and obtains valid session ID. Attacker traps victim to login with that session ID. http://example.com/?PHPSESSID=123. Because the server did not issue a new session ID after login, the old ID (123) is now associated with the victim’s authenticated account.
Modern WordPress (version 4.0 and later) has moved away from standard PHP native sessions (PHPSESSID) and implemented a much more robust system that specifically defends against fixation.
WordPress uses a custom session manager. When a user logs in, WordPress generates a brand-new, random Session Token. Even if an attacker managed to plant a cookie on a user’s browser beforehand, that cookie is ignored or overwritten during the wp_signon() process. Session token stored in wp_usermeta table for that user. WordPress then sends that token to your browser wrapped inside a cookie (typically named wordpress_logged_in_[hash]).

Primitive Capabilities: These are “hard” permissions stored in the database for a specific role (e.g., edit_posts, manage_options). They are a simple “Yes” or “No.”
Meta Capabilities: These are “contextual” permissions that depend on a specific object, usually a Post ID (e.g., edit_post, delete_post).****
When you call current_user_can('edit_post', 123), WordPress runs map_meta_cap. If Post 123 belongs to the current user, it maps the request to the primitive edit_posts. If Post 123 belongs to someone else, it maps it to edit_others_posts.

/**
 * Custom Permission Logic:
 * Allow users to edit a post if they are the "Project Lead"
 * via a custom meta field.
 */
add_filter( 'map_meta_cap', 'my_custom_project_permissions', 10, 4 );

function my_custom_project_permissions( $caps, $cap, $user_id, $args ) {

 // 1. Target the specific meta capability
 if ( 'edit_post' === $cap || 'delete_post' === $cap ) {

 $post_id = $args[0]; // The ID of the post being checked
 $post_type = get_post_type( $post_id );

 // 2. Only apply logic to our 'project' post type
 if ( 'project' === $post_type ) {

 // Fetch the assigned "Lead" from post meta
 $project_lead_id = get_post_meta( $post_id, '_project_lead_id', true );

 // 3. If the current user is the Lead, give them the 'exist' capability
 // 'exist' is a primitive cap everyone has, effectively granting permission.
 if ( (int) $project_lead_id === (int) $user_id ) {
 return array( 'exist' );
 }
 }
 }

 // Return the original capabilities for all other cases
 return $caps;
}

Never return an empty array if you want to deny access. If you return an empty array, WordPress assumes no primitive capabilities are required, and the check will pass! To deny access, you should return a capability that you know the user doesn’t have, such as 'do_not_allow'.

daily notes

Fri, 27 Mar 2026 00:00:00 +0000

Dynamic Blocks (Gutenberg)

Dynamic blocks render content at runtime instead of saving full HTML in the database.

Rendering:
- Server-side (PHP) — most common
- Client-side (JavaScript)
save() must return null

When to Use

Data-driven content (posts, APIs)
Frequently changing content
Centralized rendering logic

Basic Dynamic Block (JS)

import { registerBlockType } from '@wordpress/blocks';

registerBlockType('my-plugin/dynamic-block', {
 title: 'Dynamic Block',
 category: 'widgets',

 attributes: {
 message: { type: 'string', default: 'Hello' }
 },

 edit: ({ attributes, setAttributes }) => (
 <input
 value={attributes.message}
 onChange={(e) => setAttributes({ message: e.target.value })}
 />
 ),

 save: () => null
});

Server-side Rendering (PHP)

function render_dynamic_block($attributes) {
 $message = $attributes['message'] ?? '';
 return '<div>' . esc_html($message) . '</div>';
}

add_action('init', function () {
 register_block_type(__DIR__ . '/build', [
 'render_callback' => 'render_dynamic_block',
 ]);
});

No static markup stored

daily notes

Thu, 26 Mar 2026 00:00:00 +0000

Block Editor

The WordPress Block Editor (Gutenberg) is a modern editing experience that allows content to be created using modular components called blocks. Each block represents a piece of content such as text, images, lists, or custom UI elements.

Creating custom blocks allows developers to extend the editor with tailored functionality suited to specific websites or applications.

The process of learning block development typically begins with a simple example and progressively adds functionality such as attributes, controls, styling, and dynamic rendering.

daily notes

Wed, 25 Mar 2026 00:00:00 +0000

Hooks in React

Hooks are functions that let you use state and lifecycle features in functional components. Introduced in React 16.8, they eliminate the need for class components in most cases.

Common Hooks

useState

Manages local component state.

Key Points

Returns current state and a setter function
State updates trigger re-render
State is preserved across renders

Code Example

import { useState } from "react";

function Counter() {
 const [count, setCount] = useState(0);

 return (
 <div>
 <p>Count: {count}</p>
 <button onClick={() => setCount(count + 1)}>Increment</button>
 </div>
 );
}

export default Counter;

useEffect

Handles side effects such as API calls, subscriptions, or DOM updates.

daily notes

Tue, 24 Mar 2026 00:00:00 +0000

React Functional Components

Functional components are JavaScript functions that return JSX and are the modern standard for building React applications. They are simpler, easier to read, and support hooks for state and lifecycle management.

Defined as plain JavaScript functions.
Use React Hooks (e.g., useState, useEffect) for state and side effects.
No need for this keyword.
Preferred over class components in modern React.
Easier to test and reuse.

import React, { useState, useEffect } from 'react';

function FunctionalComponent() {
 const [count, setCount] = useState(0);

 useEffect(() => {
 console.log('Component mounted or updated');
 }, [count]);

 return (
 <div>
 <p>Count: {count}</p>
 <button onClick={() => setCount(count + 1)}>
 Increment
 </button>
 </div>
 );
}

export default FunctionalComponent;

React Class Components

Class components are ES6 classes that extend `React.Component` and include lifecycle methods and internal state. They were widely used before hooks were introduced.

Must extend React.Component.

daily notes

Mon, 23 Mar 2026 00:00:00 +0000

By default, WordPress provides several built-in sections you can hook into or build upon:

Site Identity: Site title, tagline, and logo/favicon.
Colors: Background colors, header colors.
Header Media: Header images or videos.
Background Image: Site-wide background image settings.
Menus: Menu creation and location assignment.
Widgets: Managing widget areas directly from the front end.
Homepage Settings: Choosing between a static page or latest posts.
Additional CSS: A built-in code editor for custom styles.

daily notes

Fri, 20 Mar 2026 00:00:00 +0000

Cache Stampede, Customizer API : Selective Refresh vs postMessage, Webpack
A component is a reusable, independent unit of UI in React.
Each component must return JSX (cannot return undefined).
A React app can be visualized as a tree of components.

Functional Components

Defined as JavaScript functions.
Accept props (input data from parent).
Return JSX.

function Welcome(props) {
 return <h1>Hello, {props.name}</h1>;
}

Using Components and Props

Props are read-only inputs passed from parent → child.

daily notes

Thu, 19 Mar 2026 00:00:00 +0000

Decoupled WordPress (Advanced Notes)

Concept

A decoupled (headless) WordPress architecture separates:

Backend (WordPress CMS) → content management
Frontend (React / Next.js / other) → presentation layer

Architecture Flow

WordPress (REST API / GraphQL)
 ↓
API Layer (JSON)
 ↓
Frontend (React / Next.js)

Headless vs Decoupled

Aspect	Headless	Decoupled
Frontend	Completely external	External but may still use WP frontend partially
Rendering	Fully independent	Hybrid
Flexibility	High	Moderate
Use case	SPA / mobile apps	Progressive migration

Enabling API in WordPress

REST API (built-in)

Example endpoint:

TOTP Explained: How a Stopwatch and Math Replaced Your Password

Thu, 19 Mar 2026 00:00:00 +0000

Ever wondered about that six-digit code your authenticator app displays? The one that changes every 30 seconds? That’s TOTP (Time-based One-Time Password), and it’s one of the most elegant pieces of security technology we use every day.

The Problem with Passwords

Traditional username-password authentication is inherently vulnerable. Even with complex passwords containing letters, numerals, and symbols, a single data breach from an inadequately secured server or a malicious observer looking over your shoulder can expose your credentials and grant unlimited access to your account.

daily notes

Wed, 18 Mar 2026 00:00:00 +0000

GraphQL Overview

GraphQL is a strongly typed query language and runtime designed to enable clients to request exactly the data they need from an API. It was originally developed by Facebook and is now maintained by the GraphQL Foundation.

Unlike traditional REST APIs, GraphQL exposes a single endpoint and allows clients to define the structure of the response, reducing over-fetching and under-fetching of data.

Key Characteristics

Declarative data fetching
Strongly typed schema

daily notes

Tue, 17 Mar 2026 00:00:00 +0000

Asset Building using Webpack & Babel

Modern WordPress development often separates source code (ES6+, SCSS, modules) from production-ready assets (minified JS/CSS). Tools like Webpack and Babel enable this workflow.

Key Concepts

Module Bundling: Combines multiple JavaScript files into a single optimized bundle.
Transpilation: Converts modern JavaScript (ES6+) into backward-compatible versions.
Tree Shaking: Removes unused code from final bundles.
Loaders & Plugins: Extend Webpack functionality (e.g., handling CSS, images).

Typical Project Structure

theme/
├── src/
│ ├── js/
│ │ └── index.js
│ ├── scss/
│ │ └── style.scss
├── dist/
│ ├── bundle.js
│ └── style.css
├── webpack.config.js
├── package.json

Webpack Configuration Example

const path = require('path');

module.exports = {
 entry: './src/js/index.js',
 output: {
 path: path.resolve(__dirname, 'dist'),
 filename: 'bundle.js',
 },
 module: {
 rules: [
 {
 test: /\.js$/,
 exclude: /node_modules/,
 use: {
 loader: 'babel-loader',
 },
 },
 {
 test: /\.scss$/,
 use: ['style-loader', 'css-loader', 'sass-loader'],
 },
 ],
 },
 mode: 'production',
};

Babel Configuration (.babelrc)

{
 "presets": ["@babel/preset-env"]
}

Enqueuing Compiled Assets in WordPress

function theme_enqueue_assets() {
 wp_enqueue_script(
 'theme-bundle',
 get_template_directory_uri() . '/dist/bundle.js',
 array(),
 '1.0',
 true
 );

 wp_enqueue_style(
 'theme-style',
 get_template_directory_uri() . '/dist/style.css',
 array(),
 '1.0'
 );
}
add_action('wp_enqueue_scripts', 'theme_enqueue_assets');

Internal Mechanics

Understanding WordPress internals is essential for extending functionality and debugging.

daily notes

Mon, 16 Mar 2026 00:00:00 +0000

Dashboard widgets

wp_add_dashboard_widget( $widget_id, $widget_name, $callback, $control_callback, $callback_args );

$widget_id: an identifying slug for your widget. This will be used as its CSS class and its key in the array of widgets.
$widget_name: this is the name your widget will display in its heading.
$callback: The name of a function you will create that will display the actual contents of your widget.
$control_callback (Optional): The name of a function you create that will handle submission of widget options forms, and will also display the form elements.
$callback_args (Optional): Set of arguments for the callback function.

function wporg_add_dashboard_widgets() {
 // Add function here
}
add_action( 'wp_dashboard_setup', 'wporg_add_dashboard_widgets' );
# wp_network_dashboard_setup to use in network dashboard

function wporg_add_dashboard_widgets() {
 wp_add_dashboard_widget(
 'wporg_dashboard_widget', // Widget slug.
 esc_html__( 'Example Dashboard Widget', 'wporg' ), // Title.
 'wporg_dashboard_widget_render' // Display function.
 );
}
add_action( 'wp_dashboard_setup', 'wporg_add_dashboard_widgets' );

function wporg_dashboard_widget_render() {
 esc_html_e( "Howdy! I'm a great Dashboard Widget.", "wporg" );
}

Removing default widget

// Create the function to use in the action hook
function wporg_remove_dashboard_widget() {
 remove_meta_box( 'dashboard_quick_press', 'dashboard', 'side' );
}
// Hook into the 'wp_dashboard_setup' action to register our function
add_action( 'wp_dashboard_setup', 'wporg_remove_dashboard_widget' );

# use these instad of wp_add_dashboard_widget fn to place at custom position
add_meta_box(
 'dashboard_widget_id',
 esc_html__( 'Dashboard Widget Title', 'wporg' ),
 'dashboard_widget',
 'dashboard',
 'side', 'high'
);

delete_expired_transients action is used to call function of same name, used to schedule deletion of expired transients daily.

A widget adds content and features to a widget area (also called a sidebar). A widget is a PHP object that outputs some HTML. The same kind of widget can be used multiple times on the same page (e.g. the Text Widget). Widgets can save data in the database (in the options table).

daily notes

Fri, 13 Mar 2026 00:00:00 +0000

HEAD is much less well known than the other two. HEAD is essentially the same as a GET request except that it does not retrieve the data, only information about the data. This data describes such things as when the data was last updated, whether the client should cache the data, what type the data is, etc. Modern browsers often send HEAD requests to pages you have previously visited to determine if there are any updates.
All good API clients utilize HEAD before performing a GET request to potentially save on bandwidth.
GET, POST, HEAD are the most common used in wp.

Status Code	Description
2xx	Request was successful
3xx	Request was redirected to another URL
4xx	Request failed due to client error. Usually invalid authentication or missing data
5xx	Request failed due to a server error. Commonly missing or misconfigured configuration files
`$response = wp_remote_get( 'https://api.github.com/users/blobaugh' );`
The following defaults are assumed, though they can be changed via the $args parameter:

method – GET

daily notes

Thu, 12 Mar 2026 00:00:00 +0000

Customizer API

Overview of the WordPress Customizer

The WordPress Customizer provides a user-friendly interface that allows website owners to modify theme settings and preview changes in real time before publishing them. It is designed primarily for non-technical users such as bloggers, designers, and business owners.

The Customizer enables users to adjust theme elements such as:

Site title and tagline
Colors and typography
Header and background images
Menus and widgets
Custom theme options

daily notes

Wed, 11 Mar 2026 00:00:00 +0000

Drop-ins

WordPress drop-ins are special PHP files placed directly in the wp-content directory that override or extend specific WordPress core functionality. Unlike regular plugins, they are automatically loaded by WordPress if the file exists.

Key characteristics:

Stored in wp-content/
Automatically detected and loaded
Cannot be activated or deactivated via the admin panel
Used to replace or extend core behavior
Visible under Plugins → Drop-ins in the admin area

Default WordPress drop-ins:

daily notes

Tue, 10 Mar 2026 00:00:00 +0000

Email Integration in WordPress

WordPress sends emails using the wp_mail() function, which is a wrapper around PHP’s mail() function. While it works for simple setups, it is unreliable in production environments because many hosting providers block or throttle PHP mail. Professional deployments typically use an SMTP or API-based email service. A commonly recommended solution is Amazon SES (Simple Email Service), which provides scalable and reliable email delivery.

wp_mail() basics

The wp_mail() function sends emails using the WordPress mail system. It supports plain text and HTML emails and allows attachments and custom headers.

daily notes

Mon, 09 Mar 2026 00:00:00 +0000

Custom Database Tables in WordPress

A custom database table in WordPress is used when plugin data does not fit well into the default WordPress database schema. WordPress provides built-in tables such as wp_posts, wp_postmeta, wp_users, and others. However, certain plugins require structured, high-performance storage that cannot be efficiently managed through post meta or options tables.

Using custom tables allows developers to define their own schema optimized for the plugin’s data model.

daily notes

Fri, 06 Mar 2026 00:00:00 +0000

WordPress Cron API

Understanding WP-Cron

WP-Cron is WordPress’s task scheduling system used to run automated tasks such as:

publishing scheduled posts
checking for plugin/theme updates
sending scheduled emails
cleaning temporary data
running background jobs

Unlike a traditional Linux cron daemon, WP-Cron:

runs only when a page loads
does not run continuously
executes missed tasks immediately on the next page load

This system is often called pseudo-cron or false cron.

Key characteristics:

daily notes

Thu, 05 Mar 2026 00:00:00 +0000

Concept of Roles and Capabilities

WordPress provides a role-based permission system that controls what actions a user can perform on a website. Instead of granting every user full administrative access, WordPress assigns each user a role, and each role contains a set of capabilities.

A capability is a specific permission such as:

editing posts
publishing posts
installing plugins
managing options
deleting users

A role is simply a collection of capabilities.

daily notes

Wed, 04 Mar 2026 00:00:00 +0000

WordPress AJAX in Plugin Development

AJAX in WordPress allows asynchronous server communication via admin-ajax.php or the REST API without reloading the page. In plugins, this is commonly implemented using wp_ajax_{action} and wp_ajax_nopriv_{action} hooks.

AJAX request flow with admin-ajax.php

JavaScript sends request to admin_url( 'admin-ajax.php' ) with an action parameter.
WordPress routes the request to:
- wp_ajax_{action} for authenticated users
- wp_ajax_nopriv_{action} for unauthenticated users
PHP callback processes data and outputs JSON.
Script exits with exit; or wp_die();.

daily notes

Tue, 03 Mar 2026 00:00:00 +0000

rest_pre_serve_request filter) to intercept the data right before it’s sent and convert the JSON object into XML or CSV.

An API is an Application Programming Interface. REST, which stands for “Representational State Transfer,” is a set of concepts for modeling and accessing your application’s data as interrelated objects and collections.

API is a set of code that allows one system to interact (or “interface”) with another.

REST – Representational State Transfer, or REST, provides standards that web systems can use to interface with each other.

daily notes

Mon, 02 Mar 2026 00:00:00 +0000

1. WordPress HTTP API Overview

WordPress provides a standardized HTTP API for communicating with remote servers.

Main Functions

wp_remote_get() — Perform GET request
wp_remote_post() — Perform POST request
wp_remote_request() — Custom HTTP methods (PUT, DELETE, PATCH)
wp_remote_retrieve_body() — Extract response body
wp_remote_retrieve_response_code() — Get HTTP status code
wp_remote_retrieve_headers() — Get response headers

Core Classes

WP_Http — Main HTTP wrapper class
WP_Http_Curl — cURL transport
WP_Http_Streams — Streams transport
WP_Http_Response — Standardized response object

daily notes

Fri, 27 Feb 2026 00:00:00 +0000

WordPress Core APIs

Overview:
WordPress Core APIs provide functions to extend WordPress safely. They handle heavy-lifting tasks and ensure backward compatibility for plugins and themes.

Core APIs Learned:

Metadata API – manage metadata for posts, users, comments, terms
Shortcode API – create dynamic shortcodes
Admin Menus – add menus in admin dashboard
Settings & Options API – manage plugin/theme settings

Advanced Core APIs:

HTTP API – remote requests with caching & authentication

daily notes

Thu, 26 Feb 2026 00:00:00 +0000

WP-CLI

Overview

WP-CLI (WordPress Command Line Interface) lets you manage a WordPress installation directly from the terminal. Instead of using the browser-based admin dashboard, you execute commands via SSH or a local terminal.

It supports:

Core management (install, update, downgrade)
Plugin and theme management
Database operations
User and role management
Content import/export
Custom command development

WP-CLI commands follow this structure:

wp <entity> <subcommand> [options] [--global-parameters]

Example:

wp core update

Installation (Quick Method)

Download and make executable:

daily notes

Wed, 25 Feb 2026 00:00:00 +0000

In the context of the WordPress REST API a route is a URI which can be mapped to different HTTP methods. The mapping of an individual HTTP method to a route is known as an endpoint.

The Route is the URL path itself The Endpoint is the combination of a Route and an HTTP Method (like GET, POST, or DELETE).

/wp-json/ is a route, and when that route receives a GET request then that request is handled by the endpoint which displays what is known as the index for the WordPress REST API.

daily notes

Tue, 24 Feb 2026 00:00:00 +0000

get_template_directory_uri() Retrieves template directory URI for the active theme. Returns the URL of the parent theme directory

get_header($name = null, $args = array()) { } Includes the header template for a theme or if a name is specified then a specialized header will be included. For the parameter, if the file is called “header-special.php” then specify “special”.

get_theme_file_uri('/assets/css/style.css') The URL to a specific file, and it checks Child theme first, Then parent theme (fallback)

daily notes

Mon, 23 Feb 2026 00:00:00 +0000

WordPress REST API

The WordPress REST API allows applications to interact with a WordPress site using JSON over HTTP. It exposes WordPress data (posts, pages, users, taxonomies, custom post types) through RESTful endpoints.

It powers the WordPress Block Editor and enables headless architectures, custom dashboards, mobile apps, and external integrations.

What Is REST?

API – A set of rules that allows systems to communicate.

REST (Representational State Transfer) – A standard for structuring APIs using:

daily notes

Thu, 19 Feb 2026 00:00:00 +0000

CSS Reset / Normalize

*,
*::before,
*::after {
 box-sizing: border-box;
 margin: 0;
 padding: 0;
}

Layout Structure (Flexbox)

.container {
 width: 1200px;
 margin: 0 auto;
}

.header {
 display: flex;
 justify-content: space-between;
 align-items: center;
}

Grid Layout Example

.post-grid {
 display: grid;
 grid-template-columns: repeat(3, 1fr);
 gap: 30px;
}

Typography Precision

Font Loading

function basic_theme_fonts() {
 wp_enqueue_style(
 'google-fonts',
 'https://fonts.googleapis.com/css2?family=Inter:wght@400;600;700&display=swap',
 false
 );
}
add_action('wp_enqueue_scripts', 'basic_theme_fonts');

Typography System

body {
 font-family: 'Inter', sans-serif;
 font-size: 16px;
 line-height: 1.6;
 color: #222;
}

h1 { font-size: 40px; font-weight: 700; }
h2 { font-size: 32px; font-weight: 600; }
p { margin-bottom: 20px; }

header.php

<!DOCTYPE html>
<html <?php language_attributes(); ?>>
<head>
 <meta charset="<?php bloginfo('charset'); ?>">
 <meta name="viewport" content="width=device-width, initial-scale=1.0">
 <?php wp_head(); ?>
</head>
<body <?php body_class(); ?>>

<header class="site-header">
 <div class="container">
 <h1 class="logo">
 <a href="<?php echo home_url(); ?>">
 <?php bloginfo('name'); ?>
 </a>
 </h1>
 <?php
 wp_nav_menu(array(
 'theme_location' => 'primary',
 'container' => 'nav',
 'menu_class' => 'main-menu'
 ));
 ?>
 </div>
</header>

function basic_theme_setup() {
 register_nav_menus(array(
 'primary' => 'Primary Menu'
 ));
}
add_action('after_setup_theme', 'basic_theme_setup');

Responsive Design

Viewport Meta

<meta name="viewport" content="width=device-width, initial-scale=1.0">

Media Queries

@media (max-width: 992px) {
 .container {
 width: 90%;
 }

 .post-grid {
 grid-template-columns: 1fr 1fr;
 }
}

@media (max-width: 600px) {
 .post-grid {
 grid-template-columns: 1fr;
 }
}

Custom Single Template

<?php get_header(); ?>

<main class="single-post container">
<?php
if ( have_posts() ) :
 while ( have_posts() ) : the_post(); ?>
 <h1><?php the_title(); ?></h1>
 <?php the_content(); ?>
 <?php endwhile;
endif;
?>
</main>

<?php get_footer(); ?>

daily notes

Wed, 18 Feb 2026 00:00:00 +0000

Media Management in WordPress Themes

Handling Images

Uploading & Metadata


// Get attachment metadata

$meta = wp_get_attachment_metadata( $attachment_id );



// Access width and height

$width = $meta['width'];

$height = $meta['height'];

WordPress stores media under wp-content/uploads/year/month/.
Generates multiple sizes automatically (thumbnail, medium, large).
Metadata stored in wp_postmeta for efficient retrieval.

Featured Images


// Enable support in functions.php

add_theme_support( 'post-thumbnails' );



// Display a specific size

if ( has_post_thumbnail() ) {

the_post_thumbnail( 'medium' );

}



// Get URL

$url = get_the_post_thumbnail_url( get_the_ID(), 'large' );

Custom Image Sizes

daily notes

Tue, 17 Feb 2026 00:00:00 +0000

Classic themes: Edited using classic editor, or third party plugins like elementor. Has Widget, menus
Block Themes: Introduced FSE

Is it important to have index.php in wordpress themes?

Yes, it is still strictly required. If you are building a theme using the traditional PHP method (the way themes have been built for 20 years), WordPress still looks for index.php as the primary fallback. Without it, the theme is considered “broken” and cannot be activated.

daily notes

Mon, 16 Feb 2026 00:00:00 +0000

Child Themes in WordPress

Concept and Purpose

A child theme is a WordPress theme that inherits the design and functionality of another theme, called the parent theme. It allows developers to modify or extend a site’s appearance and behavior without editing the parent theme’s files directly.

This approach ensures that customizations remain intact after parent theme updates and that core theme files remain untouched. It is considered best practice when modifying styling, template files, or functions.php.

daily notes

Fri, 13 Feb 2026 00:00:00 +0000

Advanced CSS Properties and Techniques

CSS Custom Properties (Variables)

Useful for theming and maintaining consistent design values across components.

:root {
 --primary-color: #6c5ce7;
 --border-radius: 12px;
 --shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
}

.card {
 background-color: var(--primary-color);
 border-radius: var(--border-radius);
 box-shadow: var(--shadow);
}

Variables can be overridden inside media queries or themes:

.dark {
 --primary-color: #1e1e2f;
}

Advanced CSS Grid Layout

Responsive auto-fitting layout:

.container {
 display: grid;
 grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
 gap: 24px;
}

Grid template areas for complex layouts:

daily notes

Thu, 12 Feb 2026 00:00:00 +0000

Theme File Structure

A basic WordPress theme requires:

style.css (theme metadata and styles)
index.php (fallback template)

Common additional files:

header.php
footer.php
sidebar.php
functions.php
single.php
page.php
archive.php
search.php
404.php

Page Template Layout

Custom Page Template:

<?php
/* Template Name: Custom Layout */
get_header();
?>

<section class="custom-page">
 <?php
 while (have_posts()) : the_post();
 the_content();
 endwhile;
 ?>
</section>

<?php get_footer(); ?>

Enqueue Styles and Scripts

In functions.php:

daily notes

Wed, 11 Feb 2026 00:00:00 +0000

A WordPress theme controls the visual presentation and layout of a WordPress site. It consists of template files, stylesheets, functions, and optional assets (JavaScript, images, fonts). Themes define how content stored in the database is rendered in the browser.

A theme does not modify core WordPress functionality; instead, it uses WordPress APIs, hooks, and template hierarchy rules to display content.

Basic Theme Structure

A minimal theme requires:

style.css
index.php

Example: style.css (Theme Header)

/*
Theme Name: Example Theme
Theme URI: https://example.com
Author: Your Name
Author URI: https://example.com
Description: A minimal custom WordPress theme.
Version: 1.0
License: GNU General Public License v2 or later
Text Domain: example-theme
*/

The header comment identifies the theme in the WordPress admin panel.

daily notes

Tue, 10 Feb 2026 00:00:00 +0000

Administration Menus are the menus you see on the left sidebar of the WordPress admin dashboard (/wp-admin).
Each of these is an admin menu, and plugins can:
1. Add a top-level menu
2. Add a submenu under an existing menu
3. Add hidden pages (no visible menu item)

<?php
/**
 * Plugin Name: My Admin Menu Plugin
 * Description: Demonstrates how to create WordPress administration menus.
 * Version: 1.0
 * Author: You
 */

if ( ! defined( 'ABSPATH' ) ) {
 exit; // Prevent direct access
}

/**
 * Hook into the admin menu system
 */
add_action( 'admin_menu', 'my_plugin_register_admin_menu' );

/**
 * Register admin menus
 */
function my_plugin_register_admin_menu() {

 // TOP-LEVEL MENU
 add_menu_page(
 'My Plugin Dashboard', // Page title
 'My Plugin', // Menu title
 'manage_options', // Capability
 'my-plugin', // Menu slug
 'my_plugin_dashboard_page', // Callback function
 'dashicons-admin-generic', // Icon
 25 // Position
 );

 // SUBMENU PAGE
 add_submenu_page(
 'my-plugin', // Parent slug
 'My Plugin Settings', // Page title
 'Settings', // Menu title
 'manage_options', // Capability
 'my-plugin-settings', // Menu slug
 'my_plugin_settings_page' // Callback function
 );
}

/**
 * Dashboard page callback
 */
function my_plugin_dashboard_page() {

 if ( ! current_user_can( 'manage_options' ) ) {
 return;
 }

 ?>
 <div class="wrap">
 <h1>My Plugin Dashboard</h1>
 <p>This is the main dashboard page of the plugin.</p>
 </div>
 <?php
}

/**
 * Settings page callback
 */
function my_plugin_settings_page() {

 if ( ! current_user_can( 'manage_options' ) ) {
 return;
 }

 ?>
 <div class="wrap">
 <h1>My Plugin Settings</h1>

 <form method="post" action="options.php">
 <?php
 settings_fields( 'my_plugin_settings_group' );
 do_settings_sections( 'my-plugin-settings' );
 submit_button();
 ?>
 </form>
 </div>
 <?php
}

Settings & Options API

Options API - Stores and retrieves data from the database
Settings API - Builds admin settings pages (UI + validation + security)
Settings API does NOT store data. Options API does NOT render UI
All wordpress options are stored in wp_options table.

add_option( 'my_plugin_color', 'blue' );

update_option( 'my_plugin_color', 'red' );

$color = get_option( 'my_plugin_color', 'default' );

delete_option( 'my_plugin_color' );

<?php
/**
 * Plugin Name: My Settings Plugin
 * Description: End-to-end example of Admin Menu + Settings & Options API
 * Version: 1.0
 */

if ( ! defined( 'ABSPATH' ) ) {
 exit;
}

/**
 * 1️⃣ ADMIN MENU (ENTRY POINT)
 */
add_action( 'admin_menu', 'my_plugin_add_admin_menu' );

function my_plugin_add_admin_menu() {

 add_menu_page(
 'My Plugin Settings', // Page title
 'My Plugin', // Menu title
 'manage_options', // Capability
 'my-plugin', // Menu slug
 'my_plugin_settings_page', // Page callback
 'dashicons-admin-settings' // Icon
 );
}

/**
 * 2️⃣ REGISTER SETTINGS (SETTINGS API)
 */
add_action( 'admin_init', 'my_plugin_register_settings' );

function my_plugin_register_settings() {

 // Register option (Options API via Settings API)
 register_setting(
 'my_plugin_settings_group', // Settings group
 'my_plugin_options', // Option name (stored in wp_options)
 'my_plugin_sanitize_options'// Sanitization callback
 );

 // Settings section
 add_settings_section(
 'my_plugin_main_section', // Section ID
 'Main Settings', // Title
 'my_plugin_section_text', // Callback
 'my-plugin' // Page slug (menu slug)
 );

 // Settings field
 add_settings_field(
 'enable_feature', // Field ID
 'Enable Feature', // Label
 'my_plugin_enable_field', // Field callback
 'my-plugin', // Page slug
 'my_plugin_main_section' // Section ID
 );
}

/**
 * 3️⃣ SECTION DESCRIPTION
 */
function my_plugin_section_text() {
 echo '<p>Configure the main settings for the plugin.</p>';
}

/**
 * 4️⃣ FIELD HTML
 */
function my_plugin_enable_field() {

 $options = get_option( 'my_plugin_options' );
 $enabled = $options['enable_feature'] ?? '';

 ?>
 <input type="checkbox"
 name="my_plugin_options[enable_feature]"
 value="1"
 <?php checked( 1, $enabled ); ?>>
 <label>Enable the main feature</label>
 <?php
}

/**
 * 5️⃣ SANITIZATION
 */
function my_plugin_sanitize_options( $input ) {

 $output = [];

 $output['enable_feature'] = isset( $input['enable_feature'] ) ? 1 : 0;

 return $output;
}

/**
 * 6️⃣ SETTINGS PAGE (CONNECTED TO ADMIN MENU)
 */
function my_plugin_settings_page() {

 if ( ! current_user_can( 'manage_options' ) ) {
 return;
 }
 ?>
 <div class="wrap">
 <h1>My Plugin Settings</h1>

 <form method="post" action="options.php">
 <?php
 settings_fields( 'my_plugin_settings_group' );
 do_settings_sections( 'my-plugin' );
 submit_button();
 ?>
 </form>
 </div>
 <?php
}

What the Settings API Does (and DOES NOT do)

What it DOES

Registers settings

daily notes

Mon, 09 Feb 2026 00:00:00 +0000

Block Patterns: A predefined group of blocks (text, images, buttons, columns, etc.) inserted inside a post or page. Once inserted, they’re just normal blocks—you can fully edit them
Template Patterns: Larger structural layouts meant for templates used in the Site Editor (not regular page editing). Often define parts of a page or an entire page layout

The WordPress commitment is to conform to all WCAG 2.2 Level A and Level AA guidelines.
Nonce:

class MyPlugin_Admin {

 // Display a form in the WP Admin
 public function render_settings_page() {
 ?>
 <div class="wrap">
 <h1><?php echo esc_html__( 'Plugin Settings', 'my-plugin' ); ?></h1>
 <form method="post" action="admin-post.php">
 <?php wp_nonce_field( 'save_plugin_settings', 'my_admin_nonce' ); ?>

 <input type="hidden" name="action" value="my_save_action">

 <input type="text" name="setting_one" value="">
 <?php submit_button( esc_html__( 'Save Changes', 'my-plugin' ) ); ?>
 </form>
 </div>
 <?php
 }
}

public function handle_save() {
 // 1. Verify the nonce
 // If this fails, WP automatically calls wp_die() with a 403 error
 check_admin_referer( 'save_plugin_settings', 'my_admin_nonce' );

 // 2. If we reach here, the request is valid!
 // Now sanitize the other inputs
 if ( isset( $_POST['setting_one'] ) ) {
 $data = sanitize_text_field( $_POST['setting_one'] );
 update_option( 'my_plugin_data', $data );
 }

 // 3. Redirect back
 wp_redirect( admin_url( 'admin.php?page=my-plugin-page&status=success' ) );
 exit;
}

$action (The “What”)

daily notes

Fri, 06 Feb 2026 00:00:00 +0000

WordPress Theme

A theme controls the visual presentation of a WordPress website.
It defines layout, typography, colors, and structure.
Themes use PHP, HTML, CSS, and JavaScript.
WordPress themes follow a template hierarchy to load files.

Theme Architecture Overview

A WordPress theme is composed of:

Template files (PHP)
Stylesheets (CSS)
Functions file
Assets (CSS, JS, images)

theme-name/
├── style.css
├── index.php
├── functions.php
├── header.php
├── footer.php
├── sidebar.php
├── page.php
├── single.php
├── archive.php
├── 404.php

Required Theme Files

1. style.css

Contains theme metadata
Required for theme recognition

/*
Theme Name: Basic Theme
Author: Developer
Version: 1.0
*/

2. index.php

Main fallback template
Required for rendering content

<?php
if ( have_posts() ) {
 while ( have_posts() ) {
 the_post();
 the_title('<h1>', '</h1>');
 the_content();
 }
}

Template Files and Their Purpose

header.php

Contains opening HTML, <head>, and navigation

<!DOCTYPE html>
<html <?php language_attributes(); ?>>
<head>
 <?php wp_head(); ?>
</head>
<body <?php body_class(); ?>>

footer.php

Contains footer content and closing tags

<?php wp_footer(); ?>
</body>
</html>

sidebar.php

Displays widget areas

<?php if ( is_active_sidebar('main-sidebar') ) : ?>
 <?php dynamic_sidebar('main-sidebar'); ?>
<?php endif; ?>

page.php

Used for static pages

<?php get_header(); ?>
<?php the_title('<h1>', '</h1>'); ?>
<?php the_content(); ?>
<?php get_footer(); ?>

single.php

Used for single blog posts

<?php get_header(); ?>
<h1><?php the_title(); ?></h1>
<?php the_content(); ?>
<?php get_footer(); ?>

Template Hierarchy (Basic)

Order WordPress follows to load templates:

daily notes

Thu, 05 Feb 2026 00:00:00 +0000

WP_Query

What `WP_Query` is

WP_Query is WordPress’s main class for querying posts from the database. It powers:

The main loop
Custom loops (recommended way)
Complex queries (meta, tax, date, pagination, etc.)

Use it instead of query_posts() (which you should basically never use).

Basic Usage Pattern

$args = [
 'post_type' => 'post',
 'posts_per_page' => 10,
];

$query = new WP_Query($args);

if ($query->have_posts()) {
 while ($query->have_posts()) {
 $query->the_post();
 the_title();
 }
 wp_reset_postdata();
}

Key points

Always call wp_reset_postdata() after a custom loop
$query->the_post() sets up global $post

Common Query Arguments

Post Type

'post_type' => 'post' // or 'page', 'product', 'custom_post_type'

Multiple post types:

daily notes

Wed, 04 Feb 2026 00:00:00 +0000

WordPress uses a MySQL (or MariaDB) database. By default, it consists of 12 core tables. The 12 core tables are:
wp_commentmeta: Stores extra information (metadata) about comments.
wp_comments: Contains all comments on posts and pages.
wp_links: Stores information related to the Links feature (often deprecated but still included for backward compatibility).
wp_options: Stores general site settings, configuration options, and temporary data (transients) for themes and plugins.(Site URL, Admin email, active plugins, and theme configurations).

daily notes

Tue, 03 Feb 2026 00:00:00 +0000

defined( 'ABSPATH' ) || exit; contains the absolute path to the WordPress root directory. If php run directly, it exits.

`$this`

Refers to the current object instance
Used for non-static properties and methods
Only available inside object context

`self::`

Refers to the class itself
Used for static properties and methods
Does NOT require an object

add_action( 'init', array( $post_types, 'register_post_types' ) ) is a callable reference that means:

When the init hook fires, call $post_types->register_post_types()

daily notes

Mon, 02 Feb 2026 00:00:00 +0000

Create a folder named plugin name in wp-content/plugins directory.
Inside it create a php file with same name as plugin name.
It should contain header which is used by wordpress to display meta information about it.
WordPress uses gettext via wrapper functions to make strings translatable.
A text domain uniquely identifies your plugin’s translations. Must match the plugin slug (folder or main file name).

/*
 * Plugin Name: My Plugin
 * Text Domain: my-plugin
 */

Domain Path

Defines where translation files live.
Defaults to the plugin folder.
If using a /languages directory, add to header:

/*
 * Domain Path: /languages
 */

__( 'Text', 'my-plugin' )
- Returns a translated string.
_e( 'Text', 'my-plugin' )
- Echoes the translated string.

Uninstall hook

Method 1:

register_uninstall_hook(
 __FILE__,
 'pluginprefix_function_to_run'
);

Method 2: To use this method you need to create an uninstall.php file inside the root folder of your plugin. This magic file is run automatically when the users deletes the plugin. /plugin-name/uninstall.php
If both are defined, uninstall.php will be used.

// if uninstall.php is not called by WordPress, die
if ( ! defined( 'WP_UNINSTALL_PLUGIN' ) ) {
 die;
}

$option_name = 'wporg_option';

delete_option( $option_name );

// for site options in Multisite
delete_site_option( $option_name );

// drop a custom database table
global $wpdb;
$wpdb->query( "DROP TABLE IF EXISTS {$wpdb->prefix}mytable" );

`wpdb`

This is WordPress’s global database object.
It’s an instance of the wpdb class.
You use it to safely interact with the WordPress database instead of using raw mysqli or PDO.

require Includes and loads a PHP file so its code can run.
use Imports a namespace or class so you can refer to it with a shorter name. use works after the code is loaded (so you still need require or autoloading).

shortcode

add_shortcode('wporg', 'wporg_shortcode');
function wporg_shortcode( $atts = [], $content = null) {
 // do something to $content
 // always return
 return $content;
}

[wporg] is your new shortcode. The use of the shortcode will trigger the wporg_shortcode callback function.

Actions allow you to add data or change how WordPress operates. Callback functions for Actions will run at a specific point in the execution of WordPress. Actions do not return anything back to the calling hook,(i.e., do_action() do not return anythin)

daily notes

Fri, 30 Jan 2026 00:00:00 +0000

Plugins are packages of code that extend the core functionality of WordPress. WordPress plugins are made up of PHP code and can include other assets such as images, CSS, and JavaScript.
FileDoc comment example:

/**
 * Get all image nodes.
 *
 * @param \DOMNode $node The \DOMDocument instance
 * @param boolean $strict If the document has to be valid
 *
 * @return \DOMNode
 */
 public function getImageNodes(\DOMNode $node, $strict = true): \DOMNode
 {
 // ...
 }

Example: Hello Dolly Plugin

<?php
/**
 * @package Hello_Dolly
 * @version 1.7.2
 */
/*
Plugin Name: Hello Dolly
Plugin URI: http://wordpress.org/plugins/hello-dolly/
Description: This is not just a plugin, it symbolizes the hope and enthusiasm of an entire generation summed up in two words sung most famously by Louis Armstrong: Hello, Dolly. When activated you will randomly see a lyric from <cite>Hello, Dolly</cite> in the upper right of your admin screen on every page.
Author: Matt Mullenweg
Version: 1.7.2
Author URI: http://ma.tt/
*/

function hello_dolly_get_lyric() {
 /** These are the lyrics to Hello Dolly */
 $lyrics = "Hello, Dolly
Well, hello, Dolly
It's so nice to have you back where you belong
You're lookin' swell, Dolly
I can tell, Dolly
You're still glowin', you're still crowin'
You're still goin' strong
I feel the room swayin'
While the band's playin'
One of our old favorite songs from way back when
So, take her wrap, fellas
Dolly, never go away again
Hello, Dolly
Well, hello, Dolly
It's so nice to have you back where you belong
You're lookin' swell, Dolly
I can tell, Dolly
You're still glowin', you're still crowin'
You're still goin' strong
I feel the room swayin'
While the band's playin'
One of our old favorite songs from way back when
So, golly, gee, fellas
Have a little faith in me, fellas
Dolly, never go away
Promise, you'll never go away
Dolly'll never go away again";

 // Here we split it into lines.
 $lyrics = explode( "\n", $lyrics );

 // And then randomly choose a line.
 return wptexturize( $lyrics[ mt_rand( 0, count( $lyrics ) - 1 ) ] );
}

// This just echoes the chosen line, we'll position it later.
function hello_dolly() {
 $chosen = hello_dolly_get_lyric();
 $lang = '';
 if ( 'en_' !== substr( get_user_locale(), 0, 3 ) ) {
 $lang = ' lang="en"';
 }

 printf(
 '<p id="dolly"><span class="screen-reader-text">%s </span><span dir="ltr"%s>%s</span></p>',
 __( 'Quote from Hello Dolly song, by Jerry Herman:', 'hello-dolly' ),
 $lang,
 $chosen
 );
}

// Now we set that function up to execute when the admin_notices action is called.
add_action( 'admin_notices', 'hello_dolly' );

// We need some CSS to position the paragraph.
function dolly_css() {
 echo "
 <style type='text/css'>
 #dolly {
 float: right;
 padding: 5px 10px;
 margin: 0;
 font-size: 12px;
 line-height: 1.6666;
 }
 .rtl #dolly {
 float: left;
 }
 .block-editor-page #dolly {
 display: none;
 }
 @media screen and (max-width: 782px) {
 #dolly,
 .rtl #dolly {
 float: none;
 padding-left: 0;
 padding-right: 0;
 }
 }
 </style>
 ";
}

add_action( 'admin_head', 'dolly_css' );

A WordPress installation is a website/project that is built using WordPress. It is a folder on a server (or your local machine) that contains files like:

# example files in wordpress project
wp-admin/
wp-content/
wp-includes/
wp-config.php
index.php

# Create your plugin here
your-wordpress-site/
└── wp-content/
 └── plugins/
 └── plugin-name/
 └── plugin-name.php

Header format. Simple and extended:

/*
 * Plugin Name: YOUR PLUGIN NAME
 */

/**
 * Plugin Name
 *
 * @package PluginPackage
 * @author Your Name
 * @copyright 2019 Your Name or Company Name
 * @license GPL-2.0-or-later
 *
 * @wordpress-plugin
 * Plugin Name: Plugin Name
 * Plugin URI: https://example.com/plugin-name
 * Description: Description of the plugin.
 * Version: 1.0.0
 * Requires at least: 5.2
 * Requires PHP: 7.2
 * Author: Your Name
 * Author URI: https://example.com
 * Text Domain: plugin-slug
 * License: GPL v2 or later
 * License URI: http://www.gnu.org/licenses/gpl-2.0.txt
 * Update URI: https://example.com/my-plugin/
 * Requires Plugins: my-plugin, yet-another-plugin
 */

Activation and deactivation hooks let your plugin react to being turned on or off, so it can set itself up properly and clean up after itself — without doing unnecessary work every time WordPress runs.
The deactivation hook is sometimes confused with the uninstall hook. The uninstall hook is best suited to delete all data permanently such as deleting plugin options and custom tables, etc.

register_activation_hook(
 __FILE__,
 'pluginprefix_function_to_run'
);

register_deactivation_hook(
 __FILE__,
 'pluginprefix_function_to_run'
);

# first parameter in each of these functions refers to your main plugin file

PHP provides a number of functions to verify existence of variables, functions, classes and constants. All of these will return true if the entity exists.
- Variables: isset() (includes arrays, objects, etc.)
- Functions: function_exists()
- Classes: class_exists()
- Constants: defined()
The root level of your plugin directory should contain your plugin-name.php file and, optionally, your uninstall.php file. All other files should be organized into sub folders whenever possible.

/plugin-name
plugin-name.php
uninstall.php
/languages
/includes
/admin
/js
/css
/images
/public
/js
/css
/images

__FILE__ is a PHP magic constant. It resolves to the full filesystem path of the current PHP file at runtime.
Authorization checking:

# Example of a core wordpress fn to chck permission
current_user_can( 'edit_others_posts' );

i18n and l10n

i18n refers to preparing a theme or plugin so it can be easily translated into multiple languages. This involves wrapping all text strings in translation functions (__(), _e(), _x(), etc.) so they can later be translated without editing the code.
10n stands for “localization” (10 letters between “l” and “n”). This is the process of translating and adapting a theme/plugin for a specific language or region. It uses the internationalization groundwork (i18n) to actually provide translated content to users.

Internationalisation (i18n)	Localisation (l10n)
Product design & architecture	Language & cultural adaptation
One-time (mostly) effort	Repeated for each locale
Done by developers	Done by translators & local experts
Makes localisation possible	Uses internationalisation

__('Settings saved', 'super-plugin'); : translates string for localisation. It is core wordpress function.

daily notes

Thu, 29 Jan 2026 00:00:00 +0000

Traits

Traits are used to declare methods that can be used in multiple classes. Traits can have methods and abstract methods that can be used in multiple classes, and the methods can have any access modifier (public, private, or protected).
Traits allow you to reuse several methods freely in different classes, and are a mechanism for code reuse.

trait TraitName { // some code...}

class MyClass {
 use TraitName;
}

// ----------------------------------

<?php
// Define a trait
trait message1 {
 public function msg1() {
 echo "PHP OOP is fun! ";
 }
}

// Use the trait in a class
class Welcome {
 use message1;
}

$obj = new Welcome();
$obj->msg1();
?>

Static methods and properties

<?php
class pi {
  // static property
  public static $value = 3.14159;
}

// Get static property directly
echo pi::$value;
?>

<?php
class greeting {
  // static method
  public static function welcome() {
    echo "Hello World!";
  }
}

// Call static method directly
greeting::welcome();
?>

The purpose of these lessons is to get a conceptual understanding of PHPUnit testing using WP_PHPUnit for WordPress plugins/themes.

daily notes

Wed, 28 Jan 2026 00:00:00 +0000

Coding standards help avoid common coding errors, improve the readability of code, and simplify modification. They ensure that files within the project appear as if they were created by a single person.
The WordPress commitment is to conform to all WCAG 2.2 Level A and Level AA guidelines. Conformance to level AAA success criteria is encouraged where relevant, as is exceeding the accessibility of any of these guidelines.
Level A success criteria address concerns considered to be accessibility barriers on a very wide scale that will prevent many people from accessing the site and the minimum set of accomplished goals required for the majority of web-based interfaces.

daily notes

Tue, 27 Jan 2026 00:00:00 +0000

WP_PHPUnit Testing Architecture

Purpose of WP_PHPUnit

WP_PHPUnit extends PHPUnit to work within the WordPress ecosystem. Its main goal is to validate WordPress-specific behavior that cannot be tested in isolation.

Test Lifecycle in WordPress

Each test follows a predictable lifecycle managed by WP_PHPUnit.

Lifecycle Phases

setUp()
- Runs before each test method.
- Used to create test data (users, posts, options).
- Database transaction begins here.
Test Execution
- The actual test logic runs.
- Assertions check expected vs actual behavior.

daily notes

Fri, 23 Jan 2026 00:00:00 +0000

Full Site Editing (FSE)

Full Site Editing (FSE) is a modern WordPress feature introduced in WordPress 5.9.
It allows users to edit the entire website visually (header, footer, templates, layouts) without writing code.
FSE is built on the Gutenberg block editor and works only with Block Themes.

Full Site Editing (FSE)

FSE is an umbrella project that includes multiple Gutenberg-related features.
It focuses on user-friendly site customization using blocks.
Users can design pages, posts, headers, footers, and templates directly from the dashboard.

Core Concepts of Full Site Editing

1. Site Editor

Used to build and edit the entire site using blocks.
Allows customization of templates, layouts, menus, and styles.
Accessible via Appearance → Editor.
Works only with Block Themes.

2. Blocks

Blocks are individual, reusable components (e.g., paragraph, image, button).
Pages, posts, and templates are created by combining multiple blocks.
Blocks are customizable and flexible.

3. Templates

A template is a collection of blocks arranged for a specific purpose.
Used for pages, posts, archives, search results, etc.
Examples: Single Post template, Page template, Archive template.

4. Block Themes

Themes designed specifically for Full Site Editing.
Fully editable using the Site Editor.
Include a theme.json file to control:
- Colors
- Typography
- Layout settings
- Block styles

Key Benefits of Full Site Editing

No coding required for site-wide changes.
Unified editing experience for content and design.
Better control over global styles and layouts.
Faster and more consistent site customization.

Multisite / Network

WordPress Multisite allows multiple websites to run from a single WordPress installation.
All sites share the same core files but have:
- Separate dashboards
- Separate content
- Individual users
Managed by a Network Admin (Super Admin)

Multisite Setup Basics

Enabled by adding one line of code in wp-config.php.
Can be created easily using LocalWP.
Multisite options during setup:
- Single Site (default)
- Subdirectory Multisite
  - Example: myproject.local/site1
- Subdomain Multisite
  - Example: site1.myproject.local

Use Cases of Multisite

Managing multiple blogs or websites from one dashboard.
Useful for universities, companies, or agencies.
Centralized updates and plugin management.

daily notes

Thu, 22 Jan 2026 00:00:00 +0000

WordPress Customizing

Themes & Plugins

Themes control the appearance of a WordPress site.
Plugins extend functionality beyond WordPress core features.
WordPress relies heavily on plugins for customization and scalability.
Multiple themes can be installed, but only one theme can be active at a time.
Theme and plugin auto-updates can be enabled or disabled.

WordPress Customizer

Allows real-time visual customization of site settings.
Common options include:
- Site Identity (logo, title, tagline)
- Colors & typography
- Menus & widgets
- Homepage settings

WordPress Editor (Block Editor / Gutenberg)

Default editor since WordPress 5.0.
Uses a block-based content creation approach.
Everything is a block: text, images, buttons, headings, etc.
Supports:
- Block patterns
- Reusable / Synced blocks
- Block directory for third-party blocks

WordPress Terminology (Key Terms)

Back-end: Admin dashboard for managing the site.
Front-end: Public-facing part of the website.
CMS: Content Management System.
Theme: Controls site design and layout.
Plugin: Adds or modifies functionality.
Permalink: Permanent URL for posts/pages.
Widgets: Small content blocks in sidebars or footers.
Menu / Navigation: Structured links for site navigation.
Sidebar: Widget-ready area (can have multiple).
User Roles: Define access and permissions.
Nonce: Security token to prevent unauthorized actions.

Full Site Editing (FSE)

Introduced in WordPress 5.9.
Enables editing the entire site using blocks (no code required).
Works only with Block Themes.

Core Concepts

Site Editor: Edit templates, headers, footers, and layouts.
Blocks: Building units of content and layout.
Templates: Define structure for pages, posts, archives, etc.
Template Parts: Reusable sections (header, footer).
Global Styles: Control site-wide typography, colors, and spacing via theme.json

Key Takeaways

WordPress customization relies on themes, plugins, and blocks.
Gutenberg and FSE shift WordPress toward a visual, block-first editing experience.
Block themes + Global Styles = powerful, code-free site customization.
Understanding WordPress terminology improves development and collaboration.

daily notes

Wed, 21 Jan 2026 00:00:00 +0000

Advanced WordPress & PHP: Integration & System Snippets

External Database Connection

Connecting to a database outside of the WordPress installation using the wpdb class.

// Create a new database object for an external server
$external_db = new wpdb( 'db_user', 'db_password', 'db_name', 'db_host' );

// Query the external DB
$results = $external_db->get_results( "SELECT * FROM external_table LIMIT 10" );

// Error checking
if ( $external_db->last_error ) {
 error_log( 'DB Error: ' . $external_db->last_error );
}

cURL / Remote Requests (WP_Http)

Using the WordPress wrapper for cURL (more secure and handles timeouts/SSL better).

daily notes

Tue, 20 Jan 2026 00:00:00 +0000

WordPress Core Architecture and Request Lifecycle

WordPress is a dynamic Content Management System (CMS) powered by PHP and backed by a MySQL or MariaDB database. Understanding the path a request takes from the server to the browser is essential for high-performance development.

1. The Request Pathway

When a user accesses a URL on a WordPress site, the following sequence occurs:

Initialization: The index.php file in the root directory loads wp-blog-header.php, which subsequently triggers wp-load.php.
Configuration: The wp-config.php file is parsed to establish database connections, set memory limits, and define security constants.
Core Loading: WordPress loads the core files in wp-includes/, initializes the plugin environment, and then loads the active theme.
The Query: The WP_Query class parses the URL to determine what content is being requested (e.g., a single post, a category archive, or a custom post type).
Template Hierarchy: WordPress selects the most specific template file available in the theme (e.g., single-post.php before single.php before index.php) based on the Template Hierarchy.
The Loop: The selected template executes “The Loop,” fetching data from the database and rendering the HTML output.

2. File and Directory Structure

wp-admin/: Contains the administrative dashboard logic. Core files here should never be modified.
wp-includes/: The library folder containing the majority of WordPress core functions, classes (like WP_Query, WP_Error), and APIs.
wp-content/: The only directory where developers should actively add files.
/plugins/: Individual folders for site functionality.
/themes/: Folder for the active design and layout templates.
/uploads/: Media and file assets.

The Hook System: Actions and Filters

The “Hook” system is the mechanism that makes WordPress extensible without modifying core files. This is the foundation of professional plugin and theme development.

daily notes

Mon, 19 Jan 2026 00:00:00 +0000

WordPress started as a simple blogging platform but today is used as a CMS as well as an application framework. It can power many things such as eCommerce, LMS (this site), membership sites, communities (social networks), and backend for mobile/decoupled applications.
WordPress can be installed using developer tools like EasyEngine, Laravel Valet, Local by Flywheel, Varying Vagrant Vagrants (VVV), and Lando.

Layout

Toolbar has links to various administration functions, and is displayed at the top of each Administration Screen. Many Toolbar items expand (flyout) when hovered over to display more information.

daily notes

Fri, 16 Jan 2026 00:00:00 +0000

array_key_exists()

$data = ['username' => 'Ashish', 'bio' => null];

// array_key_exists returns true because the key 'bio' is present
var_dump(array_key_exists('bio', $data)); // Output: bool(true)

var_dump()

$user = ["id" => 1, "active" => true];
var_dump($user);
/* Output:
array(2) {
 ["id"]=> int(1)
 ["active"]=> bool(true)
}
*/

array_push($stack, "Apple", "Raspberry");: Adds to the end
array_unshift(): Adds to the start
$result = array_merge($defaults, $userSettings) : merge the arrays
Function Declaration

function functionName() { }
$functionName = function() { };
function functionName ($arg1, $arg2) { }

echo: Does not have a return value
print: Always returns the integer 1

echo "This ", "is ", "multiple ", "parameters."; // accepts multiple params
$result = print "Hello"; // $result is now

include: If the file is missing, it generates a Warning (E_WARNING). The script will continue to execute the remaining code.
require: If the file is missing, it generates a Fatal Error (E_COMPILE_ERROR). The script will stop immediately.
isset()

$a = "test";
if (isset($a)) {
 echo "var set!";
}

$_SERVER: Contains information about headers, paths, and script locations.

daily notes

Thu, 15 Jan 2026 00:00:00 +0000

WP-CLI is a PHP-based tool that interacts with your WordPress files and database. It bypasses the web browser, making it significantly faster for repetitive tasks and bulk operations.

Task	Command
List all plugins	`wp plugin list`
Install & Activate	`wp plugin install contact-form-7 --activate`
Update all plugins	`wp plugin update --all`
Deactivate a plugin	`wp plugin deactivate akismet`

Export DB: wp db export (creates a .sql file instantly)
Import DB: wp db import file.sql

daily notes

Wed, 14 Jan 2026 00:00:00 +0000

WordPress is a free and open-source web content management software (CMS) that can be downloaded and installed on one’s own server.

VSCode Extensions

Eslint
Code runner
CSS flexbox cheatsheet
Beautify

Applications

LocalWP
brew install composer wget php node
Install PHPCS

composer global require "squizlabs/php_codesniffer=*"
export PATH="$HOME/.composer/vendor/bin:$PATH"

Install rules

composer global require dealerdirect/phpcodesniffer-composer-installer \
automattic/vipwpcs \
"phpcompatibility/phpcompatibility-wp:*" \
--update-no-dev -W

Update

composer global update automattic/vipwpcs phpcompatibility/phpcompatibility-wp -W

a “Sniff” is a single PHP class that checks one specific coding rule.

daily notes

Tue, 13 Jan 2026 00:00:00 +0000

PHP: Hypertext Preprocessor
Runs on the server, not in the browser
With PHP you are not limited to output HTML. You can output images or PDF files. You can also output any text, such as XHTML and XML.
Install: dnf install php

<?php
declare(strict_types=1);

echo "Hello, PHP\n";

$name = 'Master';
$age = 21;
$iStudent = true;
$int1 = 012; // => 10 (a leading 0 denotes an octal number)
$int4 = 0x0F; // => 15 (a leading 0x denotes a hex literal)
$int5 = 0b11111111; // 255 (a leading 0b denotes a binary number)

$float = 1.234;
$float = 1.2e3;
$float = 7E-10;

// Delete variable
unset($int1);

$number += 1; // Shorthand op
echo $number++; // increment op

// Special characters are only escaped in double quotes
$escaped = "This contains a \t tab character.";

echo "Age check\n";

if ($age >= 18) {
 echo "Adult\n";
} else {
 echo "Minor\n";
}

for ($i = 0; $i < 5; $i++) {
 echo $i;
}
echo "\n";

function add(int $a, int $b): int {
 return $a + $b;
}

echo add(30, 45), "\n";

$nums = [1,2,3,4];
$user = [
 "name" => "Master",
 "role" => "student"
];

class User {
 public function __construct(
 public string $name,
 public string $role
 ) {}
}

$user = new User("Master", "Student");
echo $user->name;

echo "\n";

// Single line comment
# single line comment
/*
 Mulit line comment*/

var_dump(5);
var_dump("John");
var_dump(3.14);
var_dump(true);
?>

PHP script starts with <?php and ends with ?>

php basic.php To run a file php -S web.php To start php server

CTF Write-up: TCS HackQuest Season 10

Fri, 19 Dec 2025 00:00:00 +0000

Cybersecurity is as much about persistence as it is about technical skill. I recently participated in TCS HackQuest Season 10 (held on December 13, 2025). The competition was intense, featuring a total of 14 challenges ranging from steganography and reverse engineering to web exploitation and binary analysis.

Despite some technical hurdles with the server in the final hours, I managed to successfully solve 11 out of the 14 questions. This writeup provides a brief breakdown of my approach and the logic used to solve each challenge.

About This Blog

Tue, 16 Dec 2025 00:00:00 +0000

Hi, I’m Ashish. This is my blog, where I:

Document my journey in coding, security, and projects
Share writeups of CTF challenges, experiments, and bypasses
Explain technical concepts like TOTP, credit card verification, and system internals
Record my projects, and everything else

This is a space to learn, reflect, and maybe help someone along the way. Posts range from mini-experiments to full project deep dives.

Welcome!

Bad Feedback

Tue, 16 Dec 2025 00:00:00 +0000

Category: Web Security / Injection
Vulnerability: XML External Entity (XXE) Injection

1. Challenge Description

The challenge features a customer feedback form that claims to accept feedback “at face value.” The goal is to read a flag file stored on the server’s root directory.

Description: “Every feedback is accepted at face value, no questions asked. What can go wrong? Flag is in the root.”

2. Reconnaissance

Inspecting the HTML source code revealed how the frontend processes the form data. A script intercepts the form submission and manually constructs an XML payload string before sending it to the /feedback endpoint via fetch.

Nitro

Tue, 16 Dec 2025 00:00:00 +0000

Category: Scripting / Automation
Description: A race-against-time challenge where the user must process data and submit a response faster than humanly possible.

1. Challenge Description

The challenge provides a landing page with a clear directive: “Manual attempts miss the window—only code will do.”

The workflow requires the following steps:

GET a random string from /task.
Reverse the string.
Base64 encode the reversed string.
Format the result into a specific template: CSK__{{payload}}__2025.
POST the final string to /submit.

Any attempt to perform these steps manually results in a generic “Too slow!” error, confirming that the server enforces a strict timeout (likely under 1 second).

Orbital Boot Sequence

Tue, 16 Dec 2025 00:00:00 +0000

Category: Web Exploitation
Vulnerability: Hardcoded Credentials, Weak JWT Secret, Server-Side Template Injection (SSTI)

1. Challenge Description

Description: “The Orbital Boot Sequence has stalled mid-launch. Can you restart the relay and seize control before the fleet drifts off-course? Submit the root flag for the win.”

2. Reconnaissance

Upon accessing the main page, I inspected the source code and noticed a reference to a JavaScript file named /static/js/secrets.js.

Analyzing secrets.js revealed hardcoded credentials in the operatorLedger array:

Ticket

Tue, 16 Dec 2025 00:00:00 +0000

Category: Mobile / Web Security
Vulnerability: Hardcoded Secrets & JWT Forgery

1. Challenge Description

Strike Bank detected unusual activity in their customer portal. The objective is to investigate their Android application (com.strikebank.netbanking) using public OSINT tools, uncover hidden secrets, and use them to compromise the web portal to retrieve the flag.

Hint: “Everything you need is already out there! Connect the dots…”

2. Reconnaissance (Mobile Analysis)

The challenge explicitly pointed to bevigil.com, a search engine for mobile applications. By searching for the package name com.strikebank.netbanking, we accessed the automated security report.

Triangle

Tue, 16 Dec 2025 00:00:00 +0000

Category: Web Security / Source Code Review
Vulnerability: PHP Type Juggling (Loose Comparison) & Backup File Disclosure

1. Challenge Description

The challenge presents a login interface protected by a “Trinity” of security layers: a username, a password, and three sequential One-Time Password (OTP) verification steps. The goal is to bypass these layers to retrieve the flag.

Description: “The system guards its secrets behind a username, a password, and three sequential verification steps. Only those who truly understand how the application works will pass all three. Break the Trinity and claim the flag.”