A Visual Studio Code extension for managing blog images and ad banners with an interactive UI.
Features
Easy banner size selection from predefined standard sizes
Visual image selection interface
Batch processing of multiple HTML files
Automatic banner replacement based on class names
Support for various image formats (PNG, JPG, JPEG, GIF, WebP)
Installation
Open VS Code
Press Ctrl+P or Cmd+P to open the Quick Open dialog
Type ext install banner-manager and press Enter
Usage
Click on the Blog Banner Manager icon in the Activity Bar (left sidebar)
Select a banner size from the dropdown menu
Click "Browse..." to select your new banner image
Click "Select Files" to choose the HTML files you want to update
Click "Replace Banners" to update all selected files
Supported Banner Sizes
The extension supports the following standard banner sizes:
160x600 (Wide Skyscraper)
200x200 (Small Square)
250x250 (Square)
300x50 (Mobile Banner)
300x60 (Mobile Banner)
300x100 (3:1 Rectangle)
300x200 (Rectangle)
300x250 (Medium Rectangle)
300x600 (Half Page)
320x50 (Mobile Leaderboard)
320x100 (Large Mobile Banner)
336x280 (Large Rectangle)
468x60 (Banner)
600x314 (Social Media)
728x90 (Leaderboard)
970x90 (Large Leaderboard)
920x90 (Large Leaderboard)
How It Works
The extension searches for specified banner classes in your HTML files and replaces the image source while maintaining the existing class names and other attributes. For example:
<!-- Before -->
<div class="IMG300-250">
<img src="https://github.com/ketanchoudhari/BannerManager_VS_pluggin/raw/HEAD/old-banner.jpg" alt="Banner">
</div>
<!-- After -->
<div class="IMG300-250">
<img src="https://github.com/ketanchoudhari/BannerManager_VS_pluggin/raw/HEAD/new-banner.jpg" alt="Banner">
</div>
Requirements
Visual Studio Code version 1.60.0 or higher
Extension Settings
This extension doesn't require any additional settings.
Known Issues
None at the moment.
Release Notes
0.0.2
Initial release of Blog Banner Manager:
Basic banner replacement functionality
Support for multiple banner sizes
Multiple file selection
Interactive UI
Contributing
If you'd like to contribute to this extension, please feel free to submit a pull request on our GitHub repository.
