Three types of analog clocks to use depending on the placement:
① If you want to place the clock on the top left in WordPress, use type.
②When you want to place the analog clock in the center of the screen.
③When you want to place the analog clock in the right-bottom of the screen.
④If you want to place the clock at the top center of the screen.
⑤If you want to place it in HTML, use the third type.
You can change the position of the clock by changing the position of the shortcode.
• Display at the top left:
clock_display position=”left-top”
• Display in the center:
clock_display position=”center”
• Display at the bottom right:
clock_display position=”right-bottom”
• Display at the top center
clock_display position=”top-center”
Can I use this analog clock, digital clock, and date in real time on WordPress sites around the world?Yes, you can basically use it in real time on WordPress sites around the world.
However, there are some prerequisites and considerations.
About real time:
Digital clock and date: JavaScript obtains and displays the system time of the user’s local computer, so the local time and date at the moment the user is looking at it are displayed. It does not depend on the server’s time zone settings.
Analog clock: JavaScript also calculates the movement of the analog clock hands based on the system time of the user’s local computer, rotates them, and displays them. Therefore, it reflects the local time at the moment the user is looking at it.
About use with WordPress:
Plugin operation: The PHP code you provided is designed to function correctly as a WordPress plugin. You can use the shortcode to embed it anywhere where WordPress content is displayed, such as posts and static pages.
Serving CSS and JavaScript: The CSS file (clock-style.css) and JavaScript file (clock-script.js) must be loaded correctly in the HTML generated by the plugin. The wp_enqueue_scripts function ensures that WordPress serves these files appropriately.
Things to consider:
User time zone: The time displayed depends on the time zone setting of the user’s device (computer, smartphone, etc.) viewing your website. The time zone setting of your server has no effect.
JavaScript execution environment: The user’s browser must have JavaScript enabled. If JavaScript is disabled, the analog clock will remain static and the digital clock will not update.
CSS application: If the CSS file is not loaded correctly, the clock design may appear distorted.