API-ul de Setări WordPress, Implementarea Filelor pe Pagina de Meniu Personalizată
Am urmărit seria de tutoriale despre API-ul de Setări WordPress de la acest tip:
Până acum, am reușit să fac lucrurile de bază. Acum, când încerc să implementez file, am întâmpinat probleme.
Problema 1: Filele nu funcționează. Toate câmpurile sunt afișate pe ambele file. Secțiunea 1 ar trebui să apară pe Fila Unu și Secțiunea 2 pe Fila Doi.
Problema 2: Opțiunea 2 nu se salvează. Funcționa bine înainte de implementarea filelor.
Cod:
/* ----------------------------------------------------------------------------- */
/* Adăugare Pagină de Meniu */
/* ----------------------------------------------------------------------------- */
function add_my_menu() {
add_menu_page (
'Titlul Paginii', // titlul paginii
'Titlul Meniului', // titlul meniului
'manage_options', // capabilitate
'my-menu-slug', // slug-ul meniului
'my_menu_page', // funcția care va randa output-ul
get_template_directory_uri() . '/assets/ico/theme-option-menu-icon.png' // link către iconița care va fi afișată în bara laterală
//$position, // poziția opțiunii în meniu
);
}
add_action('admin_menu', 'add_my_menu');
function my_menu_page() {
?>
<?php
if( isset( $_GET[ 'tab' ] ) ) {
$active_tab = $_GET[ 'tab' ];
} else {
$active_tab = 'tab_one';
}
?>
<div class="wrap">
<h2>Titlul Paginii de Meniu</h2>
<div class="description">Aceasta este descrierea paginii.</div>
<?php settings_errors(); ?>
<h2 class="nav-tab-wrapper">
<a href="?page=my-menu-slug&tab=tab_one" class="nav-tab <?php echo $active_tab == 'tab_one' ? 'nav-tab-active' : ''; ?>">Fila Unu</a>
<a href="?page=my-menu-slug&tab=tab_two" class="nav-tab <?php echo $active_tab == 'tab_two' ? 'nav-tab-active' : ''; ?>">Fila Doi</a>
</h2>
<form method="post" action="options.php">
<?php
if( $active_tab == 'tab_one' ) {
settings_fields( 'setting-group-1' );
do_settings_sections( 'my-menu-slug' );
} elseif( $active_tab == 'tab_two' ) {
settings_fields( 'setting-group-2' );
do_settings_sections( 'my-menu-slug' );
}
?>
<?php submit_button(); ?>
</form>
</div>
<?php
}
/* ----------------------------------------------------------------------------- */
/* Secțiuni și Câmpuri de Setări */
/* ----------------------------------------------------------------------------- */
function sandbox_initialize_theme_options() {
add_settings_section(
'page_1_section', // ID folosit pentru a identifica această secțiune și cu care se înregistrează opțiunile
'Secțiunea 1', // Titlul care va fi afișat pe pagina de administrare
'page_1_section_callback', // Callback folosit pentru a randa descrierea secțiunii
'my-menu-slug' // Pagina pe care se adaugă această secțiune de opțiuni
);
add_settings_section(
'page_2_section', // ID
'Secțiunea 2', // Titlu
'page_2_section_callback', // Callback
'my-menu-slug' // Pagină
);
/* ----------------------------------------------------------------------------- */
/* Opțiunea 1 */
/* ----------------------------------------------------------------------------- */
add_settings_field (
'option_1', // ID
'Opțiunea 1', // Etichetă
'option_1_callback', // Numele funcției responsabile pentru randarea interfeței
'my-menu-slug', // Pagina
'page_1_section', // Numele secțiunii
array( // Argumentele pentru callback
'Aceasta este descrierea opțiunii 1',
)
);
register_setting(
'setting-group-1',
'option_1'
);
/* ----------------------------------------------------------------------------- */
/* Opțiunea 2 */
/* ----------------------------------------------------------------------------- */
add_settings_field (
'option_2', // ID
'Opțiunea 2', // Etichetă
'option_2_callback', // Callback
'my-menu-slug', // Pagină
'page_2_section', // Secțiune
array(
'Aceasta este descrierea opțiunii 2', // Descriere
)
);
register_setting(
'setting-group-2',
'option_2'
);
} // function sandbox_initialize_theme_options
add_action('admin_init', 'sandbox_initialize_theme_options');
function page_1_section_callback() {
echo '<p>Descrierea secțiunii aici</p>';
} // function page_1_section_callback
function page_2_section_callback() {
echo '<p>Descrierea secțiunii aici</p>';
} // function page_1_section_callback
/* ----------------------------------------------------------------------------- */
/* Funcții Callback pentru Câmpuri */
/* ----------------------------------------------------------------------------- */
function option_1_callback($args) {
?>
<input type="text" id="option_1" class="option_1" name="option_1" value="<?php echo get_option('option_1') ?>">
<p class="description option_1"> <?php echo $args[0] ?> </p>
<?php
} // end sandbox_toggle_header_callback
function option_2_callback($args) {
?>
<textarea id="option_2" class="option_2" name="option_2" rows="5" cols="50"><?php echo get_option('option_2') ?></textarea>
<p class="description option_2"> <?php echo $args[0] ?> </p>
<?php
} // end sandbox_toggle_header_callback

Iată cum fac eu, atenție, postarea este amplă.
/* Adăugare Meniuri
-----------------------------------------------------------------*/
add_action('admin_menu', 'ch_essentials_admin');
function ch_essentials_admin() {
/* Meniu de Bază */
add_menu_page(
'Tema Essentials',
'Tema Essentials',
'manage_options',
'ch-essentials-options',
'ch_essentials_index');
}
Acum pentru câmpurile mele de setări, câmpurile suplimentare au fost eliminate, doar ca exemplu.
Aceasta este pentru 'Setările Paginii de Start' și 'Tab-ul Paginii de Start'
add_action('admin_init', 'ch_essentials_options');
function ch_essentials_options() {
/* Secțiunea Opțiuni Pagină de Start */
add_settings_section(
'ch_essentials_front_page',
'Opțiuni Pagină de Start Essentials',
'ch_essentials_front_page_callback',
'ch_essentials_front_page_option'
);
add_settings_field(
'featured_post',
'Post Recomandat',
'ch_essentials_featured_post_callback',
'ch_essentials_front_page_option',
'ch_essentials_front_page'
);
Aceasta este pentru opțiunile header-ului, care este tab-ul 'opțiuni header'
/* Secțiunea Opțiuni Header */
add_settings_section(
'ch_essentials_header',
'Opțiuni Header Essentials',
'ch_essentials_header_callback',
'ch_essentials_header_option'
);
add_settings_field(
'header_type',
'Tip Header',
'ch_essentials_textbox_callback',
'ch_essentials_header_option',
'ch_essentials_header',
array(
'header_type'
)
);
Înregistrare Setări
register_setting('ch_essentials_front_page_option', 'ch_essentials_front_page_option');
register_setting('ch_essentials_header_option', 'ch_essentials_header_option');
Toate acestea sunt incluse într-o singură funcție, apoi executate cu un admin_init
/* Opțiuni
-----------------------------------------------------------------*/
add_action('admin_init', 'ch_essentials_options');
function ch_essentials_options() {
/* Codul afișat mai sus */
}
Funcții de Apel:
/* Funcții de Apel
-----------------------------------------------------------------*/
function ch_essentials_front_page_callback() {
echo '<p>Opțiuni de Afișare Pagină de Start:</p>';
}
function ch_essentials_header_callback() {
echo '<p>Opțiuni de Afișare Header:</p>';
}
function ch_essentials_textbox_callback($args) {
$options = get_option('ch_essentials_header_option');
echo '<input type="text" id="' . $args[0] . '" name="ch_essentials_header_option[' . $args[0] . ']" value="' . $options['' . $args[0] . ''] . '"></input>';
}
function ch_essentials_featured_post_callback($args) {
$options = get_option('ch_essentials_front_page_option');
query_posts( $args );
echo '<select id="featured_post" name="ch_essentials_front_page_option[featured_post]">';
while ( have_posts() ) : the_post();
$selected = selected($options['featured_post'], get_the_id(), false);
printf('<option value="%s" %s>%s</option>', get_the_id(), $selected, get_the_title());
endwhile;
echo '</select>';
}
Acum aceasta este partea de afișare, cu tab-urile..
Dacă ai secțiunile și câmpurile de setări făcute exact așa, atunci vei putea implementa tab-urile fără probleme.
/* Pagina de Afișare
-----------------------------------------------------------------*/
function ch_essentials_index() {
?>
<div class="wrap">
<div id="icon-themes" class="icon32"></div>
<h2>Opțiuni Tema Essentials</h2>
<?php settings_errors(); ?>
<?php
$active_tab = isset( $_GET[ 'tab' ] ) ? $_GET[ 'tab' ] : 'front_page_options';
?>
<h2 class="nav-tab-wrapper">
<a href="?page=ch-essentials-options&tab=front_page_options" class="nav-tab <?php echo $active_tab == 'front_page_options' ? 'nav-tab-active' : ''; ?>">Opțiuni Pagină de Start</a>
<a href="?page=ch-essentials-options&tab=header_options" class="nav-tab <?php echo $active_tab == 'header_options' ? 'nav-tab-active' : ''; ?>">Opțiuni Header</a>
</h2>
<form method="post" action="options.php">
<?php
if( $active_tab == 'front_page_options' ) {
settings_fields( 'ch_essentials_front_page_option' );
do_settings_sections( 'ch_essentials_front_page_option' );
} else if( $active_tab == 'header_options' ) {
settings_fields( 'ch_essentials_header_option' );
do_settings_sections( 'ch_essentials_header_option' );
}
?>
<?php submit_button(); ?>
</form>
</div>
<?php
}
-----EDITARE-----
și am observat în postarea ta că ai 'elseif' și nu 'else if' pe pagina ta reală de afișare la secțiunea de tab-uri

Aceasta a fost destul de utilă pentru mine. Aveam probleme în a converti o singură pagină într-o pagină cu file. Singurele lucruri pe care le-am adăugat au fost o verificare empty() pe array-ul $option pentru fiecare câmp de intrare. Altfel, primeam o eroare când valoarea nu era setată. De asemenea, am adăugat un al treilea argument la register_settings(). Acesta acceptă un array opțional pentru a configura lucruri precum sanitizarea. În general, acesta a fost un post foarte bun cu cod de calitate.

Codarea asta a funcționat pentru mine:
<?php
/* ----------------------------------------------------------------------------- */
/* Adăugare Pagină de Meniu */
/* ----------------------------------------------------------------------------- */
function add_my_menu() {
add_menu_page (
'Titlul Paginii', // titlul paginii
'Titlul Meniului', // titlul meniului
'manage_options', // capabilitate
'my-menu-slug', // slug meniu
'my_menu_page', // funcție care va afișa conținutul
get_template_directory_uri() . '/assets/ico/theme-option-menu-icon.png' // link către iconița care va fi afișată în bara laterală
//$position, // poziția opțiunii în meniu
);
}
add_action('admin_menu', 'add_my_menu');
function my_menu_page() {
?>
<?php
if( isset( $_GET[ 'tab' ] ) ) {
$active_tab = $_GET[ 'tab' ];
} else {
$active_tab = 'tab_one';
}
?>
<div class="wrap">
<h2>Titlul Paginii de Meniu</h2>
<div class="description">Aceasta este descrierea paginii.</div>
<?php settings_errors(); ?>
<h2 class="nav-tab-wrapper">
<a href="?page=my-menu-slug&tab=tab_one" class="nav-tab <?php echo $active_tab == 'tab_one' ? 'nav-tab-active' : ''; ?>">Tab Unu</a>
<a href="?page=my-menu-slug&tab=tab_two" class="nav-tab <?php echo $active_tab == 'tab_two' ? 'nav-tab-active' : ''; ?>">Tab Doi</a>
</h2>
<form method="post" action="options.php">
<?php
if( $active_tab == 'tab_one' ) {
settings_fields( 'setting-group-1' );
do_settings_sections( 'my-menu-slug-1' );
} else if( $active_tab == 'tab_two' ) {
settings_fields( 'setting-group-2' );
do_settings_sections( 'my-menu-slug-2' );
}
?>
<?php submit_button(); ?>
</form>
</div>
<?php
}
/* ----------------------------------------------------------------------------- */
/* Secțiuni și Câmpuri de Setări */
/* ----------------------------------------------------------------------------- */
function sandbox_initialize_theme_options() {
add_settings_section(
'page_1_section', // ID folosit pentru identificarea secțiunii și înregistrarea opțiunilor
'Secțiunea 1', // Titlul afișat pe pagina de administrare
'page_1_section_callback', // Funcția callback pentru afișarea descrierii secțiunii
'my-menu-slug-1' // Pagina pe care se adaugă această secțiune
);
add_settings_section(
'page_2_section', // ID
'Secțiunea 2', // Titlu
'page_2_section_callback', // Callback
'my-menu-slug-2' // Pagină
);
/* ----------------------------------------------------------------------------- */
/* Opțiunea 1 */
/* ----------------------------------------------------------------------------- */
add_settings_field (
'option_1', // ID
'Opțiunea 1', // Etichetă
'option_1_callback', // Callback
'my-menu-slug-1', // Pagină
'page_1_section', // Secțiune
array( // Argumente adiționale
'Aceasta este descrierea opțiunii 1',
)
);
register_setting(
'setting-group-1',
'option_1'
);
/* ----------------------------------------------------------------------------- */
/* Opțiunea 2 */
/* ----------------------------------------------------------------------------- */
add_settings_field (
'option_2', // ID
'Opțiunea 2', // Etichetă
'option_2_callback', // Callback
'my-menu-slug-2', // Pagină
'page_2_section', // Secțiune
array(
'Aceasta este descrierea opțiunii 2',
)
);
register_setting(
'setting-group-2',
'option_2'
);
} // sfârșit funcție sandbox_initialize_theme_options
add_action('admin_init', 'sandbox_initialize_theme_options');
function page_1_section_callback() {
echo '<p>Descrierea secțiunii aici</p>';
} // sfârșit funcție page_1_section_callback
function page_2_section_callback() {
echo '<p>Descrierea secțiunii aici</p>';
} // sfârșit funcție page_1_section_callback
/* ----------------------------------------------------------------------------- */
/* Funcții Callback pentru Câmpuri */
/* ----------------------------------------------------------------------------- */
function option_1_callback($args) {
?>
<input type="text" id="option_1" class="option_1" name="option_1" value="<?php echo get_option('option_1') ?>">
<p class="description option_1"> <?php echo $args[0] ?> </p>
<?php
} // sfârșit funcție option_1_callback
function option_2_callback($args) {
?>
<textarea id="option_2" class="option_2" name="option_2" rows="5" cols="50"><?php echo get_option('option_2') ?></textarea>
<p class="description option_2"> <?php echo $args[0] ?> </p>
<?php
} // sfârșit funcție option_2_callback
?>

<form method="post" action="options.php">
<?php
if( $active_tab == 'tab_one' ) {
settings_fields( 'setting-group-1' );
do_settings_sections( 'my-menu-slug-1' );
} elseif( $active_tab == 'tab_two' ) {
settings_fields( 'setting-group-2' );
do_settings_sections( 'my-menu-slug-2' );
}
?>
Schimbă my-menu-slug
în my-menu-slug-1
și my-menu-slug-2
