Display a beautiful, modern analog or digital clock on your WordPress website. No Flash, pure JavaScript and CSS3.
- β Analog Clock - Smooth, animated circular clock with hour, minute, and second hands
- β Digital Clock - Modern digital display with time and date
- β No Flash - Completely rewritten in JavaScript and CSS3 (Flash removed for security)
- β Responsive Design - Works perfectly on all devices and screen sizes
- β Widget Support - Easy drag-and-drop widget with customization
- β
Shortcode - Simple
[wpclock]shortcode with parameters - β Customizable - Adjustable size and clock type
- β Modern Design - Beautiful gradient backgrounds and smooth animations
- β Secure - All output properly escaped, input sanitized
- β Translation Ready - Full internationalization support
- β WordPress 6.8 Compatible - Fully tested and updated
- Go to Plugins β Add New
- Search for "WordPress Clock"
- Click Install Now and then Activate
- Download the plugin zip file
- Extract the contents
- Upload the
wordpress-clockfolder to/wp-content/plugins/ - Activate the plugin through the Plugins menu in WordPress
cd wp-content/plugins/
git clone https://github.com/MervinPraison/wordpress-clock.gitDisplay a default analog clock:
[wpclock]
Customize the clock type and size:
[wpclock type="analog" size="200"]
[wpclock type="digital" size="300"]
Shortcode Parameters:
type- Clock type:analogordigital(default:analog)size- Clock size in pixels (default:200, min:100, max:500)timezone- Timezone (optional, uses browser's local time by default)
- Go to Appearance β Widgets
- Find WordPress Clock widget
- Drag it to your desired sidebar
- Configure:
- Title - Widget title (optional)
- Clock Type - Analog or Digital
- Size - Clock size in pixels
- Click Save
Use in your theme template:
<?php echo do_shortcode('[wpclock]'); ?>Or with parameters:
<?php echo do_shortcode('[wpclock type="digital" size="250"]'); ?>- WordPress: 4.0 or higher
- PHP: 5.6 or higher (7.4+ recommended)
- Modern Browser: Supports CSS3 and JavaScript
- β Flash Removed - Eliminated Flash dependency (major security risk)
- β Input Sanitization - All user input properly sanitized
- β Output Escaping - All output properly escaped
- β
Modern Widget API - Updated from deprecated
wp_register_sidebar_widget() - β No External Dependencies - Removed external CDN (jQuery Tools)
- β HTTPS URLs - All URLs updated to HTTPS
- β Nonce Verification - Widget forms properly secured
MAJOR UPDATE - Complete Rewrite:
Security Fixes:
- Removed Flash dependency (critical security risk)
- Removed external CDN dependency
- Added proper input sanitization
- Added output escaping
- Updated to modern WordPress widget API
- Changed all HTTP URLs to HTTPS
New Features:
- Pure JavaScript and CSS3 implementation
- Analog clock with smooth animations
- Digital clock with date display
- Responsive design for all devices
- Widget customization options
- Shortcode parameters (type, size, timezone)
Improvements:
- Modern gradient design
- Smooth second-hand animation
- Translation ready with text domain
- WordPress 6.8 compatibility
- Fixed plugin name typo (Worpress β WordPress)
- Better code organization
- Minor fixes
- Initial release with Flash clock
Add custom CSS to your theme to change colors:
/* Analog Clock */
.wpclock-face {
background: linear-gradient(135deg, #FF6B6B 0%, #4ECDC4 100%);
border-color: #333;
}
.wpclock-hour-hand,
.wpclock-minute-hand {
background: #333;
}
.wpclock-second-hand {
background: #FF6B6B;
}
/* Digital Clock */
.wpclock-digital {
background: linear-gradient(135deg, #2C3E50 0%, #3498DB 100%);
color: #ECF0F1;
}Override the default size with CSS:
.wpclock-container {
width: 300px !important;
height: 300px !important;
}.wpclock-date {
display: none;
}Add to your sidebar widget area for a live clock display.
Check the current time: [wpclock type="digital" size="250"]
Display different clock types on the same page:
Analog: [wpclock type="analog" size="200"]
Digital: [wpclock type="digital" size="200"]
[wpclock type="digital" size="400"]
Found a bug or have a feature request?
- GitHub Issues: Report here
- WordPress.org Support: Support Forum
wordpress-clock/
βββ wp-clock.php # Main plugin file
βββ readme.txt # WordPress.org readme
βββ README.md # This file
βββ css/
β βββ clock.css # Clock styles
βββ js/
β βββ clock.js # Clock JavaScript
βββ swf/ # Deprecated (Flash files - not used in v2.0)
βββ screenshot-1.png # Plugin screenshot
- PHP - WordPress plugin structure
- JavaScript - Clock logic and animations
- CSS3 - Modern styling and gradients
- HTML5 - Semantic markup
Contributions are welcome! Please:
- Fork the repository
- Create a feature branch (
git checkout -b feature/AmazingFeature) - Commit your changes (
git commit -m 'Add some AmazingFeature') - Push to the branch (
git push origin feature/AmazingFeature) - Open a Pull Request
If you're upgrading from version 1.x (Flash-based):
- Automatic: Simply update the plugin - no configuration needed
- Widgets: Existing widgets will continue to work but won't have new options until reconfigured
- Shortcodes: All existing
[wpclock]shortcodes will automatically use the new analog clock - Flash Files: The
/swf/folder is kept for backward compatibility but is not used
Version 2.0 completely removes Flash dependency. Flash is:
- No longer supported by browsers
- A major security risk
- Deprecated technology
The new version uses modern web technologies (JavaScript and CSS3) for better:
- Security
- Performance
- Compatibility
- Accessibility
Works in all modern browsers:
- β Chrome 90+
- β Firefox 88+
- β Safari 14+
- β Edge 90+
- β Opera 76+
This plugin is licensed under the GPLv2 or later.
This program is free software; you can redistribute it and/or modify
it under the terms of the GNU General Public License as published by
the Free Software Foundation; either version 2 of the License, or
(at your option) any later version.
This program is distributed in the hope that it will be useful,
but WITHOUT ANY WARRANTY; without even the implied warranty of
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
GNU General Public License for more details.
Mervin Praison
- Website: mer.vin
- GitHub: @MervinPraison
- WordPress.org: mervinpraison
- WordPress.org: https://wordpress.org/plugins/wordpress-clock/
- GitHub Repository: https://github.com/MervinPraison/wordpress-clock
- Support Forum: https://wordpress.org/support/plugin/wordpress-clock/
- Author Website: https://mer.vin
If you find this plugin useful, please consider:
- β Leaving a review
- π Reporting bugs
- π‘ Suggesting features
- π° Making a donation
Beautiful circular clock with smooth animations
Modern digital display with date
Easy-to-use widget settings
Original Release Date: January 13, 2012
First Published: WordPress.org Plugin Directory
Total Years Active: 13+ years
Made with β€οΈ for the WordPress community