Balochi Keyboard Plugin for WordPress

A comprehensive WordPress plugin that enables Balochi phonetic keyboard layout for writing Balochi language text in both Classic Editor and Block Editor (Gutenberg). Designed specifically for backend content creation.

🎯 Features

• Balochi Phonetic Keyboard Layout - Type in English, get Balochi characters
• Classic Editor Support - Full integration with WordPress Classic Editor and post titles
• Block Editor Support - Works seamlessly with Gutenberg blocks and all text fields
• Local Custom Fonts - Four beautiful Balochi fonts included (no external dependencies)
• Frontend Font Integration - Ready-to-use CSS code for displaying Balochi fonts on your website
• Separate Font Sizes - Independent control for content (12-36px) and title (12-48px)
• RTL Support - Automatic right-to-left text direction
• Easy Toggle - Quick keyboard on/off with Ctrl + M
• Visual Indicator - Always know when the keyboard is active
• Modern UI - Clean, user-friendly settings page with visual keyboard layout
• Taxonomy Support - Works with tags, categories, and custom taxonomies
• Copy-to-Clipboard - One-click copy for CSS code snippets

📸 Screenshots

1. Settings Page Configure font family, font sizes, and enable/disable editors	2. Visual Keyboard Layout Interactive keyboard layout showing all Balochi character mappings
3. Frontend Font Integration Ready-to-use CSS code generator with live font preview and copy-to-clipboard functionality	4. Block Editor (Gutenberg) Support Full support for Block Editor with real-time Balochi text conversion
5. Classic Editor Integration Balochi keyboard working seamlessly in WordPress Classic Editor

📦 Installation

1. Download the plugin files
2. Upload to /wp-content/plugins/balochi-keyboard/ directory
3. Activate the plugin through the 'Plugins' menu in WordPress
4. Go to Balochi Keyboard in the main admin menu to configure
5. Adjust font settings and enable for desired editors

⚙️ Configuration

Navigate to Balochi Keyboard in your WordPress admin menu (look for the translation icon) to access:

Settings Tab

• Font Family - Choose from 4 beautiful local Balochi fonts
• Content Font Size - Set font size for post content (12-36px)
• Title Font Size - Set font size for post titles (12-48px)
• Classic Editor Toggle - Enable/disable for Classic Editor
• Block Editor Toggle - Enable/disable for Block Editor (Gutenberg)

Keyboard Layout Tab

• Visual Keyboard - Interactive keyboard layout with shift functionality
• Character Reference - Complete list of all available characters

Frontend Fonts Tab

• Font Selection - Choose any of the 4 included Balochi fonts
• CSS Code Generator - Get ready-to-use @font-face declarations
• Usage Examples - Copy-paste CSS for applying fonts to your theme
• Live Preview - See how the selected font looks with sample text
• Implementation Guide - Step-by-step instructions for frontend integration

Help & About Tab

• Quick Start Guide - Get started in 4 easy steps
• Plugin Information - Version, developer, and layout details

Keyboard Layout

The plugin uses Balochi Phonetic keyboard mapping:

Lowercase Characters

• a → ا, b → ب, c → چ, d → د, e → ع
• f → ف, g → گ, h → ھ, i → ی, j → ج
• k → ک, l → ل, m → م, n → ن, o → و
• p → پ, q → ق, r → ر, s → س, t → ت
• u → ئ, v → ط, w → و, x → ش, y → ے, z → ز

Uppercase Characters

• A → آ, B → بھ, C → ث, D → ڈ, E → ٰ
• F → ٔ, G → غ, H → ح, I → �ى, J → ض
• K → خ, L → ﻻ, M → ﻤ, N → ں, O → ہ
• P → ُ, Q → َ, R → ڑ, S → ص, T → ٹ
• U → ء, V → ظ, W → ؤ, X → ژ, Y → ۓ, Z → ذ

Special Characters

• @ → ۆ (Wao with Ring) - Use Shift + 2
• # → ێ (Yeh with Small V) - Use Shift + 3
• | → ؔ (Arabic Sign Takhallus) - Use Shift + \
• ^ → ْ (Sukun - small circle) - Use Shift + 6
• ; → ؛ (Arabic semicolon)
• ? → ؟ (Arabic question mark)
• , → ، (Arabic comma)

⌨️ Keyboard Shortcuts

• Ctrl + M - Toggle keyboard on/off

🎨 Included Fonts

All fonts are included locally with the plugin - no external dependencies required!

1. Balochi Nastalik (Default) - Beautiful traditional Nastaliq style
2. Jameel Noori - Popular choice for Balochi and Urdu text
3. Droshum Balochi - Specially designed for Balochi language
4. BBC Urdu Font - Professional BBC Urdu font

The fonts are loaded from the assets/fonts/ directory and work offline.

Technical Details

Requirements

• WordPress 5.0 or higher
• PHP 7.2 or higher
• Modern browser with JavaScript enabled

File Structure

balochi-keyboard/
├── balochi-keyboard.php       # Main plugin file
├── assets/
│   ├── js/
│   │   ├── balochi-keyboard.js       # Classic Editor script
│   │   └── balochi-keyboard-block.js # Block Editor script
│   ├── css/
│   │   ├── balochi-keyboard.css      # Keyboard styles
│   │   ├── admin.css                 # Admin settings styles
│   │   └── fonts.css                 # Font definitions
│   └── fonts/
│       ├── BalochiNastalik.ttf       # Balochi Nastalik font
│       ├── JameelNoori.ttf           # Jameel Noori font
│       ├── DroshumBalochi.ttf        # Droshum Balochi font
│       └── BBCUrduFont.ttf           # BBC Urdu Font
├── languages/
│   └── balochi-keyboard.pot          # Translation template
└── README.md

Hooks & Filters

• admin_menu - Adds settings page
• admin_init - Registers settings
• admin_enqueue_scripts - Loads scripts for Classic Editor
• enqueue_block_editor_assets - Loads scripts for Block Editor

Usage

In Classic Editor

1. Create or edit a post
2. The keyboard indicator will appear in the bottom-right corner
3. Start typing - the keyboard is enabled by default
4. Works in:
   • Post title field
   • Post content editor (TinyMCE)
   • HTML mode
   • Tags and category fields
5. Press Ctrl + M to toggle on/off
6. Type English letters to get Balochi characters

In Block Editor (Gutenberg)

1. Create or edit a post in Block Editor
2. The keyboard indicator appears automatically
3. Works in:
   • Post title
   • All text blocks (paragraph, heading, list, quote, etc.)
   • Tags input field
   • Category fields
   • Custom taxonomy fields
4. Type naturally - conversion happens in real-time
5. Toggle with Ctrl + M if needed

🎨 Using Balochi Fonts on Frontend

Want to display Balochi text on your website frontend? The plugin includes all fonts and makes it easy!

Quick Steps:

1. Go to Frontend Fonts Tab

   • Navigate to Balochi Keyboard → Frontend Fonts in your WordPress admin

2. Select Your Font

   • Choose from 4 beautiful Balochi fonts
   • See live preview with sample text

3. Copy the CSS Code

   • Click "Copy Code" for @font-face declarations
   • Click "Copy Code" for usage examples

4. Add to Your Theme

   • Go to Appearance → Customize → Additional CSS
   • Paste the copied CSS code
   • Save and view your site!

Available Methods:

• Theme Customizer - Appearance → Customize → Additional CSS (Recommended)
• Child Theme - Add to your child theme's style.css
• Theme Files - Add to your theme's stylesheet

Example Usage:

/* Apply to entire site */
body {
    font-family: 'Balochi Nastalik', Arial, sans-serif;
    direction: rtl;
    text-align: right;
}

/* Apply to specific content only */
.balochi-text {
    font-family: 'Balochi Nastalik', Arial, sans-serif;
    direction: rtl;
    text-align: right;
}

Then use the class in your HTML:

<div class="balochi-text">
    Your Balochi content here
</div>

All fonts are loaded from the plugin directory - no external dependencies or CDN required!

Use Cases

• Writing Balochi blog posts
• Creating Balochi content pages
• Drafting Balochi articles
• Preparing Balochi educational content
• Managing Balochi news websites

Troubleshooting

🤝 Contributing

Contributions are welcome! Please feel free to submit pull requests or open issues for bugs and feature requests.

Changelog

Version 1.0.0

• ✅ Initial release
• ✅ Complete Balochi Phonetic keyboard layout (90+ characters)
• ✅ Classic Editor support (title, content, tags, categories)
• ✅ Block Editor (Gutenberg) support with taxonomy fields
• ✅ Modern, clean admin interface without gradients
• ✅ Four local Balochi fonts included (no external dependencies)
• ✅ Ready-to-use CSS code for frontend integration
• ✅ Copy-to-clipboard functionality for easy CSS code copying
• ✅ Dynamic font preview with live Balochi text samples
• ✅ Font selector with real-time CSS generation
• ✅ Two-column layout for optimal workflow (Settings + Preview)
• ✅ Separate font size controls for title and content
• ✅ Interactive visual keyboard layout with shift functionality
• ✅ RTL text direction support
• ✅ Keyboard toggle functionality (Ctrl + M)
• ✅ Visual status indicator
• ✅ Four-tab settings interface (Settings, Keyboard Layout, Frontend Fonts, Help)
• ✅ Plugin action links for quick access
• ✅ Responsive design for all screen sizes
• ✅ Tips & best practices guide for frontend implementation

Author

Zayed Baloch

• Website: https://zayedbaloch.com
• GitHub: @zayedbaloch

License

This plugin is licensed under the GPL v2 or later.

Acknowledgments

• WordPress community for excellent documentation
• Balochi language community for input on keyboard layout
• Contributors and testers

Support

For support, please:

1. Check the troubleshooting section above
2. Visit the Help & About tab in the plugin settings
3. Review the visual keyboard layout for character reference
4. Open an issue on GitHub
5. Contact: Zayed Baloch

---

Made with ❤️ for the Balochi community