README

Instantly jump from browser elements to your PHP source code

What is PHP Locator?

PHP Locator brings click-to-code functionality to PHP development. Inspired by LocatorJS, it allows you to Alt+Click any element in your browser and instantly jump to the exact source code line in VS Code.

Key Benefits:

Zero Configuration - Install and it works automatically
Universal Compatibility - Works with any PHP project or framework
Instant Navigation - Jump directly to source code in seconds
Visual Feedback - Clear indicators show clickable elements
Professional Workflow - Streamlines debugging and development

Installation

Step 1: Browser Extension

Chrome/Edge/Brave/Opera:

🚀 Install from Chrome Web Store ✅ NOW LIVE!

Manual Installation:

Download the latest release
Extract the ZIP file
Open chrome://extensions/
Enable "Developer mode"
Click "Load unpacked" → Select the extension folder

Step 2: PHP Package

Option A: Composer (Recommended)

composer require zemmelmootez/phplocator

The package auto-loads and starts working immediately - no additional setup required.

Option B: Manual Installation

git clone https://github.com/zemmelmootez/phplocator.git

<?php
require_once 'path/to/phplocator.php';
// Now ready to use
?>

Usage

The Simple Process:

Hold Alt key
Hover over any HTML element (highlights appear)
Click the element → VS Code opens to the exact line

Framework Examples:

Vanilla PHP:

<?php
// Composer auto-loads PHP Locator
?>
<!DOCTYPE html>
<html>
<body>
    <h1>Welcome</h1> <!-- Alt+Click opens this line in VS Code -->
    <p>Content here</p>
</body>
</html>

Laravel Blade:

@extends('layouts.app')
@section('content')
    <div class="container">
        <h1>{{ $title }}</h1> {{-- Alt+Click opens this Blade file --}}
    </div>
@endsection

WordPress:

<?php
// In your theme's functions.php - Composer auto-loads
?>
<div class="post-content">
    <h2><?php the_title(); ?></h2> <!-- Alt+Click opens this template -->
</div>

Advanced Configuration

Manual Data Attributes

For custom implementations:

<div data-php-file="<?php echo __FILE__; ?>" data-php-line="<?php echo __LINE__; ?>">
    Custom tracked element
</div>

Troubleshooting

Extension not working?

✅ Extension installed and enabled
✅ Developer mode enabled in browser
✅ VS Code installed with URL handler
✅ PHP package installed via Composer

No highlights appearing?

Check HTML source for: 
Verify Composer autoload is working
Check browser console for errors

VS Code not opening?

Ensure VS Code is properly installed
Try: code --install-extension to register URL handler
Test with different browsers

Technical Details

How It Works:

PHP Locator automatically injects source mapping data attributes
Browser extension detects these attributes
Alt+Click triggers VS Code protocol handler
VS Code opens the exact file and line number

Supported Environments:

PHP: 7.4+ (tested with 8.0, 8.1, 8.2, 8.3)
Frameworks: Laravel, Symfony, WordPress, CodeIgniter, or any PHP project
Browsers: Chrome, Edge, Brave, Opera (Firefox coming soon)
IDEs: VS Code (PHPStorm support planned)

Contributing

We welcome contributions! Here's how to help:

Fork the repository
Create your feature branch (git checkout -b feature/improvement)
Commit your changes (git commit -m 'Add improvement')
Push to the branch (git push origin feature/improvement)
Open a Pull Request

Development Setup:

git clone https://github.com/zemmelmootez/phplocator.git
cd phplocator
# Extension development in /extension folder
# PHP development in root directory

License

This project is licensed under the MIT License - see the LICENSE file for details.

zemmelmootez / phplocator

Maintainers

Details