Change WordPress custom field default calendar [closed]

Question

I have a custom post type called X,

Post type X has some custom fields, one of these custom fields is date,

<input type="date" name="date_added" id="date_added" class="regular-text" value="<?php echo get_post_meta($post->ID,'date_added',true ); ?>">

When I want to fill this field, WordPress gives me a calendar (which is great),

I want to change this calendar's time zone (Persian calendar),

I would be thankful if anybody helps me.

Answer 1

The calendar you are referring to is not provided by WordPress. You are using a "date" input field type, which is an HTML5 input specification. The calendar is from your browser based on that.

If your question is about timezone offset for the input itself (so what displays with the input), then you should note that there is no timezone offset for HTML5 "date" inputs. It will always be GMT.

Option 1: HTML5 "datetime-local"

One possibility would be to use the input type "datetime-local" (do not use "datetime" as that is a deprecated field type), but keep in mind that may not actually give you what you want either because the timezone will be the user's timezone. If all your users are in the same timezone, then this might be a solution:

<input type="datetime-local" name="date_added" id="date_added" class="regular-text" value="<?php echo get_post_meta($post->ID,'date_added',true ); ?>">

Option 2: jQuery UI datepicker

A better solution might be to use something like the jQuery UI datepicker (which is included in WordPress). However, that is also GMT by default and is tricky to adjust for timezone offset. Unfortunately, I can't give you an example of timezone offset, but to get you started so you can use it, add the following to your functions.php:

add_action('wp_enqueue_scripts', 'my_add_jquery_datepicker');
function my_add_jquery_datepicker() {
    wp_enqueue_script( 'jquery' );
    wp_enqueue_script( 'jquery-ui-datepicker' );
    $css = wp_register_style( 'jquery-ui', '//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css' );
    wp_enqueue_style(  'jquery-ui', $css );
}

Then to use it, add some jQuery to attach your field's ID as a datepicker field. Just to give you an easy working example, here's a quick-and-dirty way to add it via wp_head (if used, you should implement this in a better way):

add_action( 'wp_head', function() {
    ?>
    jQuery(document).ready(function($) {
        $( "#date_added" ).datepicker();
    });
    <?php 
});

Once you're able to implement the jQuery datepicker, there are examples out there on how to implement a timezone offset for this date. Google is your friend (as is stackoverflow).

Or... leave the input as GMT and store as timezone offset

However, all of that being noted, if you want to adjust what the user inputs based on a specific timezone offset, you can take the default that you get as GMT and adjust it for the offset. Keep in mind that is not a "best practice" as dates/times should really be stored as GMT and adjusted when displayed.

Answer 2

Not sure its the complete answer, but try

        date_default_timezone_set('Asia/Jerusalem');

Replace Jerusalem with exact persian zone word.