将自定义管理页面信息保存到数据库

我使用add_theme_page函数创建了一个自定义页面，我目前在向数据库添加信息时卡住了。我在WordPress Codex上找到了这篇文章

如果你看到链接

<?php add_post_meta($post_id, $meta_key, $meta_value, $unique); ?>

第一个参数需要$post_id，但在我的情况下，我没有post ID。

下面是当前的代码:

add_action('admin_menu', 'my_plugin_menu');
    function my_plugin_menu() {
        add_theme_page('Social Media', 'Social Media', 'edit_theme_options', 'social-media-links', 'social_media_links');
    }
    function social_media_links(){
        if(isset($_POST["wipit"]) and $_POST["wipit"] == "theme-options"){
            $facebook = $_POST["facebook"];
            $twitter = $_POST["twitter"];
            $youtube = $_POST["youtube"];
            $pinterest = $_POST["pinterest"];
            $facebook = sanitize_text_field($facebook);
            $twitter = sanitize_text_field($twitter);
            $youtube = sanitize_text_field($youtube);
            $pinterest = sanitize_text_field($pinterest);
            $facebook = esc_url($facebook);
            $twitter = esc_url($twitter);
            $youtube = esc_url($youtube);
            $pinterest = esc_url($pinterest);
        }
    ?>
    <link rel="stylesheet" href="<?php echo get_template_directory_uri(); ?>/resources/css/bootstrap.css">
    <link rel="stylesheet" href="<?php echo get_template_directory_uri(); ?>/resources/css/admin.css">
    <script src="<?php echo get_template_directory_uri(); ?>/resources/js/vendor/bootstrap.min.js"></script>
        <div class="wrap" id="theme-options-wrap">
        <h2>Social Media</h2>
        <ul class="nav nav-tabs">
          <li class="active"><a href="#social" data-toggle="tab">Social Media</a></li>
          <li><a href="#profile" data-toggle="tab">Profile</a></li>
          <li><a href="#messages" data-toggle="tab">Messages</a></li>
          <li><a href="#settings" data-toggle="tab">Settings</a></li>
        </ul>
        <form method="post" enctype="multipart/form-data" action="<?php $_SERVER["PHP_SELF"]; ?>">
        <input type="hidden" value="theme-options" name="wipit"/>
          <div class="tab-content" id="social-media">
            <div class="tab-pane fade in active" id="social">
              <div class="row">
                <div class="col-md-4"><label>Facebook</label></div>
                <div class="col-md-8"><input type="email" class="form-control" id="facebook" name="facebook"></div>
              </div>
              <div class="row">
                <div class="col-md-4"><label>Twitter</label></div>
                <div class="col-md-8"><input type="email" class="form-control" id="twitter" name="twitter"></div>
              </div>
              <div class="row">
                <div class="col-md-4"><label>YouTube</label></div>
                <div class="col-md-8"><input type="email" class="form-control" id="youtube" name="youtube"></div>
              </div>
              <div class="row">
                <div class="col-md-4"><label>Pinterest</label></div>
                <div class="col-md-8"><input type="email" class="form-control" id="pinterest" name="pinterest"></div>
              </div>
            </div>
            <div class="tab-pane fade" id="profile">...</div>
            <div class="tab-pane fade" id="messages">...</div>
            <div class="tab-pane fade" id="settings">...</div>
          </div>
          <div class="theme-option-button"><button type="submit" class="btn btn-primary btn-lg">Save Changes</button></div>
        </form>
      </div>
    <?php
    }   
    ?>