Add Settings to Custom Post Type

Ok, so I got annoyed with it not working and decided to just rewrite it. I’m not sure what the solution was, but I suspect two things: the wrong endpoint for the form (should be options.php) and the wrong $option_group and $option_name (they were probably not matched correctly).

For posterity, I’ll leave my rewrite here and hopefully it helps others. A few differences between this and the previous version.

1. This is now in it’s own file so you won’t see the custom post type registered.
2. I used an object for the page per example 2 from the WordPress codex.

3. I added a second option for a media uploader using this tutorial, which I updated to use wp_localize_script() to inject a JSON object to get some PHP data.

   public function __construct()
   {
       add_action( 'admin_menu', array( $this, 'add_submenu_page_to_post_type' ) );
       add_action( 'admin_init', array( $this, 'sub_menu_page_init' ) );
       add_action( 'admin_init', array( $this, 'media_selector_scripts' ) );
   }
   
   /**
    * Add sub menu page to the custom post type
    */
   public function add_submenu_page_to_post_type()
   {
       add_submenu_page(
           'edit.php?post_type=rushhour_projects',
           __('Portfolio Projects Options', 'rushhour'),
           __('Portfolio Options', 'rushhour'),
           'manage_options',
           'projects_archive',
           array($this, 'rushhour_projects_options_display'));
   }
   
   /**
    * Options page callback
    */
   public function rushhour_projects_options_display()
   {
       $this->options = get_option( 'rushhour_projects_archive' );
   
       wp_enqueue_media();
   
       echo '<div class="wrap">';
   
       printf( '<h1>%s</h1>', __('Portfolio Options', 'rushhour' ) ); 
   
       echo '<form method="post" action="options.php">';
   
       settings_fields( 'projects_archive' );
   
       do_settings_sections( 'projects-archive-page' );
   
       submit_button();
   
       echo '</form></div>';
   }
   
   /**
    * Register and add settings
    */
   public function sub_menu_page_init()
   {
       register_setting(
           'projects_archive', // Option group
           'rushhour_projects_archive', // Option name
           array( $this, 'sanitize' ) // Sanitize
           );
   
       add_settings_section(
           'header_settings_section', // ID
           __('Header Settings', 'rushhour'), // Title
           array( $this, 'print_section_info' ), // Callback
           'projects-archive-page' // Page
           );
   
       add_settings_field(
           'archive_description', // ID
           __('Archive Description', 'rushhour'), // Title
           array( $this, 'archive_description_callback' ), // Callback
           'projects-archive-page', // Page
           'header_settings_section' // Section
           );
   
       add_settings_field(
           'image_attachment_id',
           __('Header Background Image', 'rushhour'),
           array( $this, 'header_bg_image_callback' ),
           'projects-archive-page',
           'header_settings_section'
           );
   }
   
   /**
    * Sanitize each setting field as needed
    *
    * @param array $input Contains all settings fields as array keys
    */
   public function sanitize( $input )
   {
       $new_input = array();
   
       if( isset( $input['archive_description'] ) )
           $new_input['archive_description'] = sanitize_text_field( $input['archive_description'] );
   
       if( isset( $input['image_attachment_id'] ) )
           $new_input['image_attachment_id'] = absint( $input['image_attachment_id'] );
   
       return $new_input;
   }
   
   /**
    * Print the Section text
    */
   public function print_section_info()
   {
       print 'Select options for the archive page header.';
   }
   
   /**
    * Get the settings option array and print one of its values
    */
   public function archive_description_callback()
   {
       printf(
           '<input type="text" id="archive_description" name="rushhour_projects_archive[archive_description]" value="https://wordpress.stackexchange.com/questions/235088/%s" />',
           isset( $this->options['archive_description'] ) ? esc_attr( $this->options['archive_description']) : ''
           );
   }
   
   /**
    * Get the settings option array and print one of its values
    */
   public function header_bg_image_callback()
   {
       $attachment_id = $this->options['image_attachment_id'];
   
       // Image Preview
       printf('<div class="image-preview-wrapper"><img id="image-preview" src="https://wordpress.stackexchange.com/questions/235088/%s" ></div>', wp_get_attachment_url( $attachment_id ) );
   
       // Image Upload Button
       printf( '<input id="upload_image_button" type="button" class="button" value="https://wordpress.stackexchange.com/questions/235088/%s" />',
           __( 'Upload image', 'rushhour' ) );
   
       // Hidden field containing the value of the image attachment id
       printf( '<input type="hidden" name="rushhour_projects_archive[image_attachment_id]" id="image_attachment_id" value="https://wordpress.stackexchange.com/questions/235088/%s">',
           $attachment_id );
   }
   
   public function media_selector_scripts()
   {
       $my_saved_attachment_post_id = get_option( 'media_selector_attachment_id', 0 );
   
       wp_register_script( 'sub_menu_media_selector_scripts', get_template_directory_uri() . '/admin/js/media-selector.js', array('jquery'), false, true );
   
       $selector_data = array(
           'attachment_id' => get_option( 'media_selector_attachment_id', 0 )
           );
   
       wp_localize_script( 'sub_menu_media_selector_scripts', 'selector_data', $selector_data );
   
       wp_enqueue_script( 'sub_menu_media_selector_scripts' );
   }
   

   }

Then simply call the object on if is_admin() is true:

if ( is_admin() )
     $my_settings_page = new RushHourProjectArchivesAdminPage();