Theme Options Page Form Field Question

  • I recently upgraded to 6.0.3. I held out for more than a year because I knew it would break my custom theme that I started coding in 2010. I’ve gone through the due diligence of updating everything in my theme to ensure that it would work but I am stuck on one element related to the theme options page. I’m hoping someone can point me in the right direction.

    The options page includes a wp_editor form element, which worked perfectly. With the WP upgrade the options page now displays a broken Tiny MCE editor above the options page. Where the wp_editor is supposed to be displayed it is still displayed but it is broken, it doesn’t display anything in the editor.

    I’ve spent many hours googling and reading through articles (most are out of date) to no avail. I’m hoping someone can point me in the right direction for resolving this coding issue.

    I have the following code in my functions.php

    function x_theme_admin_styles() {
    wp_editor( "" , "main_text", array());
    wp_enqueue_script('word-count');
    wp_enqueue_script('post');
    wp_enqueue_script('editor');
    wp_enqueue_script('media-upload');
    wp_enqueue_script('jquery');
    wp_enqueue_script('thickbox');
    wp_enqueue_style('thickbox');
    }

    And this is how I am calling the wp_editor on the options page form:

    wp_editor($x_maincont_opt['x_main_text'], "main_text", array());

Viewing 15 replies - 1 through 15 (of 22 total)

  • Would you be able to provide more information about what you mean by it is broken?

    For example:
    * You can’t type inside the editor.
    * The editor’s options aren’t available.
    * It doesn’t save any data.

    Any other information or a screenshot of how the editor loads on your side would be helpful.

    Also, please check your browser console for any JavaScript errors when visiting the options page. Sometimes such errors prevent the editor from working properly. If there are any JavaScript errors, please share them with us.

    Thread Starter wlpdrpat

    (@wlpdrpat)

    @aatanasov Thanks for your reply. I created a short screencapture video to show you what is happening. https://www.awesomescreenshot.com/video/11449096?key=ba9807bc2c57983f1a0b61a120c66c50

    No js errors are in the console.

    @wlpdrpat, thank you for providing the video. It is helpful.

    Please remove this code:

    
wp_editor( "" , "main_text", array());

    from the x_theme_admin_styles function.

    I’m not sure why this code exists, but it isn’t required.

    Removing this code will fix the styling issue on the options admin page. (I’ve tested it locally to reproduce the issue.)

    Also, it would probably fix the issue with the other editors, but please let us know how the editors work after removing the unnecessary code line.

    • This reply was modified 2 years, 1 month ago by aatanasov.
    Thread Starter wlpdrpat

    (@wlpdrpat)

    @aatanasov I spoke too soon. The options page looks perfect now but when I save the page it throws a critical error. Thoughts on that? I’m guessing I need to turn on debug and see what errors are thrown.

    • This reply was modified 2 years, 1 month ago by wlpdrpat.

    Great, you’re welcome!

    Please feel free to mark this topic as resolved.

    Thread Starter wlpdrpat

    (@wlpdrpat)

    @aatanasov Here is the error log:

    [01-Oct-2022 20:40:57 UTC] PHP Fatal error:  Uncaught TypeError: stripcslashes(): Argument #1 ($string) must be of type string, array given in /var/web/site/public_html/wp-content/themes/x/maincontent.php:55
Stack trace:
#0 /var/web/site/public_html/wp-content/themes/x/maincontent.php(55): stripcslashes(Array)
#1 /var/web/site/public_html/wp-content/themes/chiro/functions.php(1031): require('/var/web/site/p...')
#2 /var/web/site/public_html/wp-includes/class-wp-hook.php(307): chiro_main_content_page('')
#3 /var/web/site/public_html/wp-includes/class-wp-hook.php(331): WP_Hook->apply_filters('', Array)
#4 /var/web/site/public_html/wp-includes/plugin.php(476): WP_Hook->do_action(Array)
#5 /var/web/site/public_html/wp-admin/admin.php(259): do_action('appearance_page...')
#6 /var/web/site/public_html/wp-admin/themes.php(10): require_once('/var/web/site/p...')
#7 {main}
  thrown in /var/web/site/public_html/wp-content/themes/x/maincontent.php on line 55

    Here is the code from lines 49-61:

    $x_maincont_details = array();
  foreach($x_maincont_opt as $key=>$val)
  {
    $optkey = str_replace('x_','',$key);
    if(isset($_POST[$optkey]))
    {
        $x_maincont_details[$key] = stripcslashes($_POST[$optkey]);    
    }
    else
    {
        $x_maincont_details[$key] = '';
    }
  }

    I’ve just noticed that you edited your message, and thank you for sending the error. It looks like an easy fix, but let us first debug the issue.

    Can you please add these code lines:

    
print_r( $_POST[$optkey] );
exit();

    before:

    
$x_maincont_details[$key] = stripcslashes($_POST[$optkey]);

    After that, please test saving the page again and provide the information printed from $_POST[$optkey].

    • This reply was modified 2 years, 1 month ago by aatanasov.
    • This reply was modified 2 years, 1 month ago by aatanasov.
    Thread Starter wlpdrpat

    (@wlpdrpat)

    @aatanasov I added the code as follows:

    $x_maincont_details = array();
  foreach($x_maincont_opt as $key=>$val)
  {
    $optkey = str_replace('x_','',$key);
    if(isset($_POST[$optkey]))
    {
        print_r( $_POST[$optkey] );
        exit();
        $x_maincont_details[$key] = stripcslashes($_POST[$optkey]);    
    }
    else
    {
        $x_maincont_details[$key] = '';
    }
  }

    When I save the page I get a blank page with no error message on the page or in the error log. Should I be looking somewhere specific for the information printed from $_POST[$optkey]

    I see, please remove the exit(); line, so all the code is executed until the error message appears.

    That means, only keep print_r( $_POST[$optkey] ); from the 2 lines I sent in my previous message.

    Thread Starter wlpdrpat

    (@wlpdrpat)

    @aatanasov The page shows this:

    0Array ( [0] => 9 [1] => 8 )
    There has been a critical error on this website.

    Learn more about troubleshooting WordPress.

    Thanks, more information will be needed.

    Can you please add print_r( $optkey ); before print_r( $_POST[$optkey] );? I’d like to see which these options are.

    After that, if you can provide the actual data that is added to these $optkeys on the options page that would be great.

    Thread Starter wlpdrpat

    (@wlpdrpat)

    @aatanasov Here is what prints:

    footer_promo_textcustom_clinic_detailscheckup_customqualificationspecialty_display0specialty_1specialty_2specialty_3specialty_4specialty_5specialty_6specialty_7specialty_8specialty_9omit_pagesArray ( [0] => 9 [1] => 8 )

    The page has 3 wp_editor, 3 textarea, 19 text, 8 checkbox, 1 multiselect, 2 select.

    Thanks, please follow the below steps.

    1. Remove the test code I sent.

    2. Change:

    $x_maincont_details[$key] = stripcslashes($_POST[$optkey]);

    to:

    
if( array( $_POST[ $optkey ] ) ) {
	$x_maincont_details[ $key ] = $_POST[ $optkey ];
} else {
	$x_maincont_details[ $key ] = stripcslashes( $_POST[ $optkey ] );	
}

    Not the cleanest way, but I’d like to avoid refactoring everything.

    Doing that, there might be an issue with the checkbox options (which will need to be tested) because arrays will probably be serialized into the database (it isn’t clear how the theme works with array options).

    3. Test the page if there are any errors.

    4. Test whether the text options such as main_text work after saving the options page.

    5. Test if there are any issues with options that have checkboxes, multiselects, and selects after saving the options page.

    After that, please let us know what has happened.

    Thread Starter wlpdrpat

    (@wlpdrpat)

    @aatanasov all options are now blank and nothing saves. Error log shows: Undefined array key for each option that should have been saved.

    Thread Starter wlpdrpat

    (@wlpdrpat)

    @aatanasov Here is the code that builds the options and array for this options page (I’ve removed the identical options formats from the array):

    $x_maincont_opt = get_option('x_main_content');
if (!$x_maincont_opt)
{
  $x_maincont_opt = array( //there are 37 options in this array each takes one of these 3 formats
    'x_specialty_display'=>trim(get_option('x_specialty_display')) ? x_specialty_display : '0',
    'x_specialty_1'=>trim(get_option('x_specialty_1')),
    'x_youtube_multi_display'=>trim(get_option('x_youtube_multi_display')) ? trim(get_option('x_youtube_multi_display')) : 'checked'
  );
}
if(isset($_POST['sales_update']))
{
  $x_maincont_details = array();
  foreach($x_maincont_opt as $key=>$val)
  {
    $optkey = str_replace('x_','',$key);
    if(isset($_POST[$optkey]))
    {
        if( array( $_POST[ $optkey ] ) ) {
	$x_maincont_details[ $key ] = $_POST[ $optkey ];
} else {
	$x_maincont_details[ $key ] = stripcslashes( $_POST[ $optkey ] );	
}    
    }
    else
    {
        $x_maincont_details[$key] = '';
    }
  }
  $page = (isset($_POST['omit_pages'])) ? join(',', $_POST['omit_pages']) : '';
  $x_maincont_details['x_omit_pages'] = $page;
  
  update_option('x_invite_display',stripcslashes($_POST['invite_display']));
  update_option('x_invite',stripcslashes($_POST['invite']));
  
  $invite_display = (isset($_POST['invite_display'])) ? stripcslashes($_POST['invite_display']) : '';
  $invite = (isset($_POST['invite'])) ? stripcslashes($_POST['invite']) : '';
  update_option('x_invite_display',$invite_display);
  update_option('x_invite',$invite);
  
  $x_maincont_details['x_mobilemain_text_display'] = (isset($_POST['mobilemain_text_display'])) ? stripcslashes($_POST['mobilemain_text_display']) : '';
  $x_maincont_details['x_mobilemain_text'] = (isset($_POST['mobilemain_text'])) ? stripcslashes($_POST['mobilemain_text']) : '';
  
  $x_maincont_details['x_home_page_custom_tagline'] = (isset($_POST['home_page_custom_tagline'])) ? stripcslashes($_POST['home_page_custom_tagline']) : '';
  
  
  update_option('x_main_content',$x_maincont_details);
  $x_maincont_opt = get_option('x_main_content');
}

    After that code is the html to build the options page. Here are a few examples (textarea, checkbox, text):

    <form enctype="multipart/form-data" action="" method="post">
  <table class="sales_table">
          <tr>
            <th>Footer Promo Text<br />
              <small>(displayed above social image links)<br />
              Enter code in textarea to display</small><br />
              
            </th>
            <td colspan="4"><textarea name="footer_promo_text" cols="40" rows="3"><?php echo $x_maincont_opt['x_footer_promo_text']?></textarea></td>
          </tr>
    <tr>
            <th>Hide Multi-clinic<br />
              <small>blockquote displayed at bottom of page<br />
              Check to hide</small><br />
              
            </th>
            <td colspan="4"><input type="checkbox" name="footer_promo_text_display"
          <?php if($x_maincont_opt['x_footer_promo_text_display'] != ""){?>
          checked="checked"
          <?php } ?>
          ></td>
          </tr>
          <tr>
            <th>Custom Specialty 1:</th>
            <td><input style="width:400px" type="text" name="specialty_1" value="<?php echo $x_maincont_opt['x_specialty_1']?>" /></td>
          </tr>
          <tr>

    Any further thoughts would be greatly appreciated.

Viewing 15 replies - 1 through 15 (of 22 total)
  • The topic ‘Theme Options Page Form Field Question’ is closed to new replies.

Tags