Settings page Tabs broken: Piklist 0.9.9.1 • Piklist Support

Tagged: Settings page tab

This topic has 12 replies, 3 voices, and was last updated 6 years, 4 months ago by Mehdi Salem.

Viewing 12 reply threads

Author

Posts

October 8, 2015 at 6:39 pm #4473

Mehdi Salem
Member

Hello Guys, so happy that Piklist is getting out beta soon!!!

Here is the glitch while testing version 0.9.9.1:
My Settings page tabs disappeared and my fields got all mixed pulled on the main…

My code is working fine with Piklist 0.9.5.v

Her is my code:
<?php

/**
*
* Register custom settings pages
*
*/

if( ! defined( ‘ABSPATH’ ) ) exit; // Exit if accessed directly

/**
* Allow Editors to customize some of the theme’s frontend appearance
*/
function hdev_piklist_theme_setting_pages($pages)
{
$pages[] = array(
‘page_title’ => __(‘Custom Theme Settings’, ‘piklist’)
,’menu_title’ => __(‘Settings’, ‘piklist’)
,’sub_menu’ => ‘themes.php’ //Under Appearance menu
,’capability’ => ‘moderate_comments’
,’menu_slug’ => ‘custom_theme_settings’
,’setting’ => ‘stopping_the_world_settings’
,’menu_icon’ => ‘dashicons-admin-settings’
,’page_icon’ => plugins_url(‘piklist/parts/img/piklist-page-icon-32.png’)
,’single_line’ => true
,’default_tab’ => ‘General’
,’save_text’ => ‘Save Theme Settings’
);
return $pages;
}
add_filter(‘piklist_admin_pages’, ‘hdev_piklist_theme_setting_pages’);
function hdev_custom_capability()
{
return ‘moderate_comments’; // allow users with the capability of “moderate_comments” to SAVE this page.
}
add_filter(‘option_page_capability_custom_theme_settings’, ‘hdev_custom_capability’);
?>

<?php
/*
Title: Theme Customization
Setting: stopping_the_world_settings
*/

// Set default Values
$content_bg = <<<‘EOD’
background: #dbdbdb;
background: -moz-radial-gradient(center, ellipse cover, #dbdbdb 0%, #dbdbdb 25%, #808080 100%);
background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%, #dbdbdb), color-stop(25%, #dbdbdb), color-stop(100%, #808080));
background: -webkit-radial-gradient(center, ellipse cover, #dbdbdb 0%, #dbdbdb 25%, #808080 100%);
background: -o-radial-gradient(center, ellipse cover, #dbdbdb 0%, #dbdbdb 25%, #808080 100%);
background: -ms-radial-gradient(center, ellipse cover, #dbdbdb 0%, #dbdbdb 25%, #808080 100%);
background: radial-gradient(ellipse at center, #dbdbdb 0%, #dbdbdb 25%, #808080 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr=’#dbdbdb’, endColorstr=’#808080′, GradientType=1 );
EOD;

// Register HTML background color picker field
piklist(‘field’, array(
‘type’ => ‘colorpicker’
,’field’ => ‘html_bg’
,’label’ => ‘html background’
,’value’ => ‘#262626′
,’description’ => ‘Click in the box to select a color.’
,’help’ => ‘Sets the HTML css background color.’
,’attributes’ => array(
‘class’ => ‘html-bg’
,’placeholder’ => ‘#262626’
)
));

// Register site-container-inner class background gradient color
piklist(‘field’, array(
‘type’ => ‘textarea’
,’field’ => ‘content_bg’
,’label’ => ‘Content background’
,’description’ => ‘ Enter any valid background css color or gradient code here, or generate one using this great online tool: http://www.cssmatic.com/gradient-generator‘
,’help’ => ‘Sets the content css gradient background.’
,’value’ => $content_bg
,’attributes’ => array(
‘rows’ => 10
,’cols’ => 120
,’class’ => ‘content-bg’
,’placeholder’ => $content_bg
)
));
?>

<?php
/*
Title: Customize the Galleries Menu pages
Setting: stopping_the_world_settings
Tab: Galleries
Tab Order: 10
*/

// Set default Values
$folder_info_box_bg = <<<‘EOD’
background: #ededed;
background: -moz-radial-gradient(center, ellipse cover, #ededed 0%, #ededed 1%, #e6e6e6 41%, #cccccc 100%);
background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%, #ededed), color-stop(1%, #ededed), color-stop(41%, #e6e6e6), color-stop(100%, #cccccc));
background: -webkit-radial-gradient(center, ellipse cover, #ededed 0%, #ededed 1%, #e6e6e6 41%, #cccccc 100%);
background: -o-radial-gradient(center, ellipse cover, #ededed 0%, #ededed 1%, #e6e6e6 41%, #cccccc 100%);
background: -ms-radial-gradient(center, ellipse cover, #ededed 0%, #ededed 1%, #e6e6e6 41%, #cccccc 100%);
background: radial-gradient(ellipse at center, #ededed 0%, #ededed 1%, #e6e6e6 41%, #cccccc 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr=’#ededed’, endColorstr=’#cccccc’, GradientType=1 );
EOD;

// Register the folder info box field group
piklist(‘field’, array(
‘type’ => ‘group’
,’field’ => ‘folder_info_box’
,’label’ => __(‘Folder Info Box’,’stopping-the-world-admin’)
,’fields’ => array(
array( // Register the info spacing field
‘type’ => ‘text’
,’field’ => ‘folder_info_spacing’
,’label’ => __(‘Spacing between the Title and the Description’, ‘stopping-the-world-admin’)
,’help’ => __(‘Sets the space between the Folder Title and its Description which appear next to the folder\’s Cover Photo on the Galleries Menu pages. The margin CSS unit used here will be a percentage of the width of the containing box to ensure mobile responsiveness.’, ‘stopping-the-world-admin’)
,’value’ => ‘1’
,’attributes’ => array(
‘class’ => ‘number’
,’placeholder’ => ‘1.000’
)
,’validate’ => array(
array(
‘type’ => ‘integer’
,’options’ => array(
‘decimals’ => 3
)
)
,array(
‘type’ => ‘range’
,’options’ => array(
‘min’ => 0
,’max’ => 25
)
)
)
)
,array( // Register the info background field
‘type’ => ‘textarea’
,’field’ => ‘folder_info_box_bg’
,’label’ => __(‘Background’, ‘stopping-the-world-admin’)
,’help’ => __(‘Sets the listed gallery folders\’ css gradient background.’, ‘stopping-the-world-admin’)
,’value’ => $folder_info_box_bg
,’attributes’ => array(
‘rows’ => 10
,’cols’ => 120
,’class’ => ‘gallery-folder-bg’
,’placeholder’ => $folder_info_box_bg
)
)
)
));

// Register the folder title field group
piklist(‘field’, array(
‘type’ => ‘group’
,’field’ => ‘folder_title’
,’label’ => __(‘Folder Title’,’stopping-the-world-admin’)
,’fields’ => array(
array( // Register the title font size field
‘type’ => ‘text’
,’field’ => ‘font_size’
,’label’ => __(‘Font Size (3 decimals max.)’, ‘stopping-the-world-admin’)
,’help’ => ‘Sets the font size of the Folder Title which appear next to the folder\’s Cover Photo on the Galleries Menu pages. The CSS unit used here will be in \’em\’ and thus will depend on the parent element font size.’
,’value’ => ‘1.89’
,’columns’ => 4
,’attributes’ => array(
‘class’ => ‘number’
,’placeholder’ => ‘1.890’
)
,’validate’ => array(
array(
‘type’ => ‘integer’
,’options’ => array(
‘decimals’ => 3
)
)
,array(
‘type’ => ‘range’
,’options’ => array(
‘min’ => 0
,’max’ => 25
)
)
)
)
,array( // Register the title line height field
‘type’ => ‘text’
,’field’ => ‘line_height’
,’label’ => __(‘Line Height (3 decimals max.)’, ‘stopping-the-world-admin’)
,’help’ => ‘Sets the line height of the Folder Title which appear next to the folder\’s Cover Photo on the Galleries Menu pages. No CSS unit is used here.’
,’value’ => ‘1.5’
,’columns’ => 4
,’attributes’ => array(
‘class’ => ‘number’
,’placeholder’ => ‘1.500’
)
,’validate’ => array(
array(
‘type’ => ‘integer’
,’options’ => array(
‘decimals’ => 3
)
)
,array(
‘type’ => ‘range’
,’options’ => array(
‘min’ => 0
,’max’ => 25
)
)
)
)
,array( // Register the title letter spacing field
‘type’ => ‘text’
,’field’ => ‘letter_spacing’
,’label’ => __(‘Letter spacing (3 decimals max.)’, ‘stopping-the-world-admin’)
,’help’ => ‘Sets the letter spacing of the Folder Title which appear next to the folder\’s Cover Photo on the Galleries Menu pages. The CSS unit used here will be in \’em\’ and thus will depend on the parent element font size.’
,’value’ => ‘.24′
,’columns’ => 4
,’attributes’ => array(
‘class’ => ‘number’
,’placeholder’ => ‘.240′
)
,’validate’ => array(
array(
‘type’ => ‘integer’
,’options’ => array(
‘decimals’ => 3
)
)
,array(
‘type’ => ‘range’
,’options’ => array(
‘min’ => 0
,’max’ => 10
)
)
)
)
)
));

// Register the folder description field group
piklist(‘field’, array(
‘type’ => ‘group’
,’field’ => ‘folder_desc’
,’label’ => __(‘Folder Description’,’stopping-the-world-admin’)
,’fields’ => array(
array( // Register the description font size field
‘type’ => ‘text’
,’field’ => ‘font_size’
,’label’ => __(‘Font Size (3 decimals max.)’, ‘stopping-the-world-admin’)
,’help’ => ‘Sets the font size of the Folder description which appear next to the folder\’s Cover Photo on the Galleries Menu pages. The CSS unit used here will be in \’em\’ and thus will depend on the parent element font size.’
,’value’ => ‘1.09’
,’columns’ => 4
,’attributes’ => array(
‘class’ => ‘number’
,’placeholder’ => ‘1.090’
)
,’validate’ => array(
array(
‘type’ => ‘integer’
,’options’ => array(
‘decimals’ => 3
)
)
,array(
‘type’ => ‘range’
,’options’ => array(
‘min’ => 0
,’max’ => 25
)
)
)
)
,array( // Register the description line height field
‘type’ => ‘text’
,’field’ => ‘line_height’
,’label’ => __(‘Line Height (3 decimals max.)’, ‘stopping-the-world-admin’)
,’help’ => ‘Sets the line height of the Folder description which appear next to the folder\’s Cover Photo on the Galleries Menu pages. No CSS unit is used here.’
,’value’ => ‘1.5’
,’columns’ => 4
,’attributes’ => array(
‘class’ => ‘number’
,’placeholder’ => ‘1.500’
)
,’validate’ => array(
array(
‘type’ => ‘integer’
,’options’ => array(
‘decimals’ => 3
)
)
,array(
‘type’ => ‘range’
,’options’ => array(
‘min’ => 0
,’max’ => 25
)
)
)
)
,array( // Register the description letter spacing field
‘type’ => ‘text’
,’field’ => ‘letter_spacing’
,’label’ => __(‘Letter spacing (3 decimals max.)’, ‘stopping-the-world-admin’)
,’help’ => ‘Sets the letter spacing of the Folder description which appear next to the folder\’s Cover Photo on the Galleries Menu pages. The CSS unit used here will be in \’em\’ and thus will depend on the parent element font size.’
,’value’ => ‘.1′
,’columns’ => 4
,’attributes’ => array(
‘class’ => ‘number’
,’placeholder’ => ‘.100′
)
,’validate’ => array(
array(
‘type’ => ‘integer’
,’options’ => array(
‘decimals’ => 3
)
)
,array(
‘type’ => ‘range’
,’options’ => array(
‘min’ => 0
,’max’ => 10
)
)
)
)
)
));
?>

<?php
/*
Title: Customize the Gallery Viewer pages
Setting: stopping_the_world_settings
Tab: Gallery
Tab Order: 20
*/

// Register the Gallery Viewer Slider Photo field group
piklist(‘field’, array(
‘type’ => ‘group’
,’field’ => ‘slider_photo’
,’label’ => __(‘Slider Photo’,’stopping-the-world-admin’)
,’fields’ => array(
array(
‘type’ => ‘group’
,’field’ => ‘box_shadow’
,’label’ => __(‘Outer Glow’,’stopping-the-world-admin’)
,’add_more’ => TRUE
,’fields’ => array(
array( // Register the outer glow field
‘type’ => ‘text’
,’field’ => ‘h_shadow’
,’label’ => __(‘h-shadow’, ‘stopping-the-world-admin’)
,’help’ => ‘Required. The position of the horizontal shadow. Negative values are allowed. The default value is 0px if left empty.’
,’value’ => ‘0px’
,’columns’ => 2
,’attributes’ => array(
‘class’ => ‘box-shadow-h-shadow’
,’placeholder’ => ‘0px’
)
)
,array( // Register the outer glow field
‘type’ => ‘text’
,’field’ => ‘v_shadow’
,’label’ => __(‘v-shadow’, ‘stopping-the-world-admin’)
,’help’ => ‘Required. The position of the vertical shadow. Negative values are allowed. The default value is 0px if left empty.’
,’value’ => ‘0px’
,’columns’ => 2
,’attributes’ => array(
‘class’ => ‘box-shadow-v-shadow’
,’placeholder’ => ‘0px’
)
)
,array( // Register the outer glow field
‘type’ => ‘text’
,’field’ => ‘blur’
,’label’ => __(‘blur’, ‘stopping-the-world-admin’)
,’help’ => ‘Optional. The blur distance. The default value is 25px if left empty.’
,’value’ => ’50px’
,’columns’ => 2
,’attributes’ => array(
‘class’ => ‘box-shadow-blur’
,’placeholder’ => ’50px’
)
)
,array( // Register the outer glow field
‘type’ => ‘text’
,’field’ => ‘spread’
,’label’ => __(‘spread’, ‘stopping-the-world-admin’)
,’help’ => ‘Optional. The size of shadow. Negative values are allowed. The default value is 5px if left empty.’
,’value’ => ‘5px’
,’columns’ => 2
,’attributes’ => array(
‘class’ => ‘box-shadow-spread’
,’placeholder’ => ‘5px’
)
)
,array( // Register the outer glow field
‘type’ => ‘colorpicker’
,’field’ => ‘color’
,’label’ => __(‘color’, ‘stopping-the-world-admin’)
,’help’ => ‘Optional. The color of the shadow. The default value is white if left empty. Look at CSS Color Values for a complete list of possible color values.’
,’value’ => ‘#ffffff’
,’columns’ => 2
,’attributes’ => array(
‘class’ => ‘box-shadow-color’
,’placeholder’ => ‘#ffffff’
)
)
)
)
)
));

// Register the Gallery Viewer Thumbnail Photo field group
piklist(‘field’, array(
‘type’ => ‘group’
,’field’ => ‘thumb_photo’
,’label’ => __(‘Thumbnail Photo’,’stopping-the-world-admin’)
,’fields’ => array(
array(
‘type’ => ‘group’
,’field’ => ‘box_shadow’
,’label’ => __(‘Outer Glow’,’stopping-the-world-admin’)
,’add_more’ => TRUE
,’fields’ => array(
array( // Register the outer glow field
‘type’ => ‘text’
,’field’ => ‘h_shadow’
,’label’ => __(‘h-shadow’, ‘stopping-the-world-admin’)
,’help’ => ‘Required. The position of the horizontal shadow. Negative values are allowed. The default value is 0px if left empty.’
,’value’ => ‘0px’
,’columns’ => 2
,’attributes’ => array(
‘class’ => ‘box-shadow-h-shadow’
,’placeholder’ => ‘0px’
)
)
,array( // Register the outer glow field
‘type’ => ‘text’
,’field’ => ‘v_shadow’
,’label’ => __(‘v-shadow’, ‘stopping-the-world-admin’)
,’help’ => ‘Required. The position of the vertical shadow. Negative values are allowed. The default value is 0px if left empty.’
,’value’ => ‘0px’
,’columns’ => 2
,’attributes’ => array(
‘class’ => ‘box-shadow-v-shadow’
,’placeholder’ => ‘0px’
)
)
,array( // Register the outer glow field
‘type’ => ‘text’
,’field’ => ‘blur’
,’label’ => __(‘blur’, ‘stopping-the-world-admin’)
,’help’ => ‘Optional. The blur distance. The default value is 50px if left empty.’
,’value’ => ’25px’
,’columns’ => 2
,’attributes’ => array(
‘class’ => ‘box-shadow-blur’
,’placeholder’ => ’25px’
)
)
,array( // Register the outer glow field
‘type’ => ‘text’
,’field’ => ‘spread’
,’label’ => __(‘spread’, ‘stopping-the-world-admin’)
,’help’ => ‘Optional. The size of shadow. Negative values are allowed. The default value is 5px if left empty.’
,’value’ => ‘5px’
,’columns’ => 2
,’attributes’ => array(
‘class’ => ‘box-shadow-spread’
,’placeholder’ => ‘5px’
)
)
,array( // Register the outer glow field
‘type’ => ‘colorpicker’
,’field’ => ‘color’
,’label’ => __(‘color’, ‘stopping-the-world-admin’)
,’help’ => ‘Optional. The color of the shadow. The default value is white if left empty. Look at CSS Color Values for a complete list of possible color values.’
,’value’ => ‘#ffffff’
,’columns’ => 2
,’attributes’ => array(
‘class’ => ‘box-shadow-color’
,’placeholder’ => ‘#ffffff’
)
)
)
)
)
));
?>

Attachments:
You must be logged in to view attached files.

October 8, 2015 at 6:41 pm #4476

Mehdi Salem

Member

Sorry… here is the code in a proper format:

Hello Guys, so happy that Piklist is getting out beta soon!!!

Here is the glitch while testing version 0.9.9.1:
My Settings page tabs disappeared and my fields got all mixed pulled on the main...

My code is working fine with Piklist 0.9.5.v

Her is my code:
<?php

/**
 *
 * Register custom settings pages
 *
 */

if( ! defined( 'ABSPATH' ) ) exit; // Exit if accessed directly

/**
 * Allow Editors to customize some of the theme's frontend appearance
 */
function hdev_piklist_theme_setting_pages($pages)
{
   $pages[] = array(
         'page_title' => __('Custom Theme Settings', 'piklist')
   ,'menu_title' => __('Settings', 'piklist')
   ,'sub_menu' => 'themes.php' //Under Appearance menu
   ,'capability' => 'moderate_comments'
   ,'menu_slug' => 'custom_theme_settings'
   ,'setting' => 'stopping_the_world_settings'
   ,'menu_icon' => 'dashicons-admin-settings'
   ,'page_icon' => plugins_url('piklist/parts/img/piklist-page-icon-32.png')
   ,'single_line' => true
   ,'default_tab' => 'General'
   ,'save_text' => 'Save Theme Settings'
   );
   return $pages;
}
add_filter('piklist_admin_pages', 'hdev_piklist_theme_setting_pages');
function hdev_custom_capability()
{
   return 'moderate_comments'; // allow users with the capability of "moderate_comments" to SAVE this page.
}
add_filter('option_page_capability_custom_theme_settings', 'hdev_custom_capability');
?>

<?php
/*
Title: <br /><span class="hdev-setting-tab-inner-title">Theme Customization</span>
Setting: stopping_the_world_settings
*/

// Set default Values
$content_bg = <<<'EOD'
background: #dbdbdb;
background: -moz-radial-gradient(center, ellipse cover, #dbdbdb 0%, #dbdbdb 25%, #808080 100%);
background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%, #dbdbdb), color-stop(25%, #dbdbdb), color-stop(100%, #808080));
background: -webkit-radial-gradient(center, ellipse cover, #dbdbdb 0%, #dbdbdb 25%, #808080 100%);
background: -o-radial-gradient(center, ellipse cover, #dbdbdb 0%, #dbdbdb 25%, #808080 100%);
background: -ms-radial-gradient(center, ellipse cover, #dbdbdb 0%, #dbdbdb 25%, #808080 100%);
background: radial-gradient(ellipse at center, #dbdbdb 0%, #dbdbdb 25%, #808080 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#dbdbdb', endColorstr='#808080', GradientType=1 );
EOD;

// Register HTML background color picker field
piklist('field', array(
      'type' => 'colorpicker'
,'field' => 'html_bg'
,'label' => 'html background'
,'value' => '#262626'
,'description' => '<span class="hdev-desc-top">Click in the box to select a color.</span>'
,'help' => 'Sets the HTML css background color.'
,'attributes' => array(
            'class' => 'html-bg'
            ,'placeholder' => '#262626'
      )
));

// Register site-container-inner class background gradient color
piklist('field', array(
      'type' => 'textarea'
,'field' => 'content_bg'
,'label' => 'Content background'
,'description' => '<br />&nbsp;&nbsp;Enter any valid background css color or gradient code here, or generate one using this great online tool: <a title="Background Generator Tool" alt="Online Background Generator Tool" href="http://www.cssmatic.com/gradient-generator">http://www.cssmatic.com/gradient-generator</a>'
,'help' => 'Sets the content css gradient background.'
,'value' => $content_bg
,'attributes' => array(
      'rows' => 10
      ,'cols' => 120
      ,'class' => 'content-bg'
      ,'placeholder' => $content_bg
      )
));
?>

<?php
/*
Title: <br /><span class="hdev-setting-tab-inner-title">Customize the Galleries Menu pages</span>
Setting: stopping_the_world_settings
Tab: Galleries
Tab Order: 10
*/

// Set default Values
$folder_info_box_bg = <<<'EOD'
background: #ededed;
background: -moz-radial-gradient(center, ellipse cover, #ededed 0%, #ededed 1%, #e6e6e6 41%, #cccccc 100%);
background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%, #ededed), color-stop(1%, #ededed), color-stop(41%, #e6e6e6), color-stop(100%, #cccccc));
background: -webkit-radial-gradient(center, ellipse cover, #ededed 0%, #ededed 1%, #e6e6e6 41%, #cccccc 100%);
background: -o-radial-gradient(center, ellipse cover, #ededed 0%, #ededed 1%, #e6e6e6 41%, #cccccc 100%);
background: -ms-radial-gradient(center, ellipse cover, #ededed 0%, #ededed 1%, #e6e6e6 41%, #cccccc 100%);
background: radial-gradient(ellipse at center, #ededed 0%, #ededed 1%, #e6e6e6 41%, #cccccc 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ededed', endColorstr='#cccccc', GradientType=1 );
EOD;

// Register the folder info box field group
piklist('field', array(
      'type' => 'group'
,'field' => 'folder_info_box'
,'label' => __('Folder Info Box','stopping-the-world-admin')
,'fields' => array(
            array( // Register the info spacing field
                  'type' => 'text'
            ,'field' => 'folder_info_spacing'
            ,'label' => __('Spacing between the Title and the Description', 'stopping-the-world-admin')
            ,'help' => __('Sets the space between the Folder Title and its Description which appear next to the folder\'s Cover Photo on the Galleries Menu pages. The margin CSS unit used here will be a percentage of the width of the containing box to ensure mobile responsiveness.', 'stopping-the-world-admin')
            ,'value' => '1'
            ,'attributes' => array(
                  'class' => 'number'
            ,'placeholder' => '1.000'
            )
            ,'validate' => array(
                  array(
                        'type' => 'integer'
                  ,'options' => array(
                        'decimals' => 3
                  )
                  )
            ,array(
                        'type' => 'range'
                  ,'options' => array(
                              'min' => 0
                        ,'max' => 25
                        )
                  )
            )
            )
      ,array( // Register the info background field
                  'type' => 'textarea'
            ,'field' => 'folder_info_box_bg'
            ,'label' => __('Background', 'stopping-the-world-admin')
            ,'help' => __('Sets the listed gallery folders\' css gradient background.', 'stopping-the-world-admin')
            ,'value' => $folder_info_box_bg
            ,'attributes' => array(
                        'rows' => 10
                  ,'cols' => 120
                  ,'class' => 'gallery-folder-bg'
                  ,'placeholder' => $folder_info_box_bg
                  )
            )
      )
));

// Register the folder title field group
piklist('field', array(
      'type' => 'group'
      ,'field' => 'folder_title'
      ,'label' => __('Folder Title','stopping-the-world-admin')
      ,'fields' => array(
            array( // Register the title font size field
                  'type' => 'text'
               ,'field' => 'font_size'
               ,'label' => __('Font Size <span class="hdev-label-comment">(3 decimals max.)</span>', 'stopping-the-world-admin')
               ,'help' => 'Sets the font size of the Folder Title which appear next to the folder\'s Cover Photo on the Galleries Menu pages. The CSS unit used here will be in \'em\' and thus will depend on the parent element font size.'
               ,'value' => '1.89'
               ,'columns' => 4
               ,'attributes' => array(
                     'class' => 'number'
                     ,'placeholder' => '1.890'
               )
               ,'validate' => array(
                     array(
                        'type' => 'integer'
                        ,'options' => array(
                           'decimals' => 3
                        )
                     )
                     ,array(
                           'type' => 'range'
                           ,'options' => array(
                                 'min' => 0
                                 ,'max' => 25
                           )
                     )
               )
            )
            ,array( // Register the title line height field
                        'type' => 'text'
                  ,'field' => 'line_height'
                  ,'label' => __('Line Height <span class="hdev-label-comment">(3 decimals max.)</span>', 'stopping-the-world-admin')
                  ,'help' => 'Sets the line height of the Folder Title which appear next to the folder\'s Cover Photo on the Galleries Menu pages. No CSS unit is used here.'
                  ,'value' => '1.5'
                  ,'columns' => 4
                  ,'attributes' => array(
                              'class' => 'number'
                        ,'placeholder' => '1.500'
                  )
                  ,'validate' => array(
                        array(
                                 'type' => 'integer'
                           ,'options' => array(
                                 'decimals' => 3
                           )
                        )
                        ,array(
                                    'type' => 'range'
                              ,'options' => array(
                                          'min' => 0
                                    ,'max' => 25
                              )
                        )
                  )
            )
            ,array( // Register the title letter spacing field
                  'type' => 'text'
            ,'field' => 'letter_spacing'
            ,'label' => __('Letter spacing <span class="hdev-label-comment">(3 decimals max.)</span>', 'stopping-the-world-admin')
            ,'help' => 'Sets the letter spacing of the Folder Title which appear next to the folder\'s Cover Photo on the Galleries Menu pages. The CSS unit used here will be in \'em\' and thus will depend on the parent element font size.'
            ,'value' => '.24'
            ,'columns' => 4
            ,'attributes' => array(
                        'class' => 'number'
                  ,'placeholder' => '.240'
                  )
            ,'validate' => array(
                        array(
                              'type' => 'integer'
                        ,'options' => array(
                              'decimals' => 3
                        )
                        )
                  ,array(
                              'type' => 'range'
                        ,'options' => array(
                                    'min' => 0
                              ,'max' => 10
                              )
                        )
                  )
            )
      )
));

// Register the folder description field group
piklist('field', array(
      'type' => 'group'
,'field' => 'folder_desc'
,'label' => __('Folder Description','stopping-the-world-admin')
,'fields' => array(
            array( // Register the description font size field
                  'type' => 'text'
            ,'field' => 'font_size'
            ,'label' => __('Font Size <span class="hdev-label-comment">(3 decimals max.)</span>', 'stopping-the-world-admin')
            ,'help' => 'Sets the font size of the Folder description which appear next to the folder\'s Cover Photo on the Galleries Menu pages. The CSS unit used here will be in \'em\' and thus will depend on the parent element font size.'
            ,'value' => '1.09'
            ,'columns' => 4
            ,'attributes' => array(
                  'class' => 'number'
            ,'placeholder' => '1.090'
            )
            ,'validate' => array(
                  array(
                        'type' => 'integer'
                  ,'options' => array(
                        'decimals' => 3
                  )
                  )
            ,array(
                        'type' => 'range'
                  ,'options' => array(
                              'min' => 0
                        ,'max' => 25
                        )
                  )
            )
            )
      ,array( // Register the description line height field
                  'type' => 'text'
            ,'field' => 'line_height'
            ,'label' => __('Line Height <span class="hdev-label-comment">(3 decimals max.)</span>', 'stopping-the-world-admin')
            ,'help' => 'Sets the line height of the Folder description which appear next to the folder\'s Cover Photo on the Galleries Menu pages. No CSS unit is used here.'
            ,'value' => '1.5'
            ,'columns' => 4
            ,'attributes' => array(
                        'class' => 'number'
                  ,'placeholder' => '1.500'
                  )
            ,'validate' => array(
                        array(
                              'type' => 'integer'
                        ,'options' => array(
                              'decimals' => 3
                        )
                        )
                  ,array(
                              'type' => 'range'
                        ,'options' => array(
                                    'min' => 0
                              ,'max' => 25
                              )
                        )
                  )
            )
      ,array( // Register the description letter spacing field
                  'type' => 'text'
            ,'field' => 'letter_spacing'
            ,'label' => __('Letter spacing <span class="hdev-label-comment">(3 decimals max.)</span>', 'stopping-the-world-admin')
            ,'help' => 'Sets the letter spacing of the Folder description which appear next to the folder\'s Cover Photo on the Galleries Menu pages. The CSS unit used here will be in \'em\' and thus will depend on the parent element font size.'
            ,'value' => '.1'
            ,'columns' => 4
            ,'attributes' => array(
                        'class' => 'number'
                  ,'placeholder' => '.100'
                  )
            ,'validate' => array(
                        array(
                              'type' => 'integer'
                        ,'options' => array(
                              'decimals' => 3
                        )
                        )
                  ,array(
                              'type' => 'range'
                        ,'options' => array(
                                    'min' => 0
                              ,'max' => 10
                              )
                        )
                  )
            )
      )
));
?>

<?php
/*
Title: <br /><span class="hdev-setting-tab-inner-title">Customize the Gallery Viewer pages</span>
Setting: stopping_the_world_settings
Tab: Gallery
Tab Order: 20
*/

// Register the Gallery Viewer Slider Photo field group
piklist('field', array(
      'type' => 'group'
      ,'field' => 'slider_photo'
      ,'label' => __('Slider Photo','stopping-the-world-admin')
      ,'fields' => array(
               array(
                     'type' => 'group'
                  ,'field' => 'box_shadow'
                  ,'label' => __('Outer Glow','stopping-the-world-admin')
                  ,'add_more' => TRUE
                  ,'fields' => array(
                        array( // Register the outer glow field
                              'type' => 'text'
                           ,'field' => 'h_shadow'
                           ,'label' => __('h-shadow', 'stopping-the-world-admin')
                           ,'help' => 'Required. The position of the horizontal shadow. Negative values are allowed. The default value is 0px if left empty.'
                           ,'value' => '0px'
                           ,'columns' => 2
                           ,'attributes' => array(
                              'class' => 'box-shadow-h-shadow'
                              ,'placeholder' => '0px'
                           )
                        )
                        ,array( // Register the outer glow field
                           'type' => 'text'
                           ,'field' => 'v_shadow'
                           ,'label' => __('v-shadow', 'stopping-the-world-admin')
                           ,'help' => 'Required. The position of the vertical shadow. Negative values are allowed. The default value is 0px if left empty.'
                           ,'value' => '0px'
                           ,'columns' => 2
                           ,'attributes' => array(
                              'class' => 'box-shadow-v-shadow'
                              ,'placeholder' => '0px'
                           )
                        )
                        ,array( // Register the outer glow field
                           'type' => 'text'
                           ,'field' => 'blur'
                           ,'label' => __('blur', 'stopping-the-world-admin')
                           ,'help' => 'Optional. The blur distance. The default value is 25px if left empty.'
                           ,'value' => '50px'
                           ,'columns' => 2
                           ,'attributes' => array(
                              'class' => 'box-shadow-blur'
                              ,'placeholder' => '50px'
                           )
                        )
                        ,array( // Register the outer glow field
                           'type' => 'text'
                           ,'field' => 'spread'
                           ,'label' => __('spread', 'stopping-the-world-admin')
                           ,'help' => 'Optional. The size of shadow. Negative values are allowed. The default value is 5px if left empty.'
                           ,'value' => '5px'
                           ,'columns' => 2
                           ,'attributes' => array(
                              'class' => 'box-shadow-spread'
                              ,'placeholder' => '5px'
                           )
                        )
                        ,array( // Register the outer glow field
                           'type' => 'colorpicker'
                           ,'field' => 'color'
                           ,'label' => __('color', 'stopping-the-world-admin')
                           ,'help' => 'Optional. The color of the shadow. The default value is white if left empty. Look at CSS Color Values for a complete list of possible color values.'
                           ,'value' => '#ffffff'
                           ,'columns' => 2
                           ,'attributes' => array(
                              'class' => 'box-shadow-color'
                              ,'placeholder' => '#ffffff'
                           )
                        )
                  )
               )
      )
));

// Register the Gallery Viewer Thumbnail Photo field group
piklist('field', array(
      'type' => 'group'
,'field' => 'thumb_photo'
,'label' => __('Thumbnail Photo','stopping-the-world-admin')
,'fields' => array(
            array(
                  'type' => 'group'
            ,'field' => 'box_shadow'
            ,'label' => __('Outer Glow','stopping-the-world-admin')
            ,'add_more' => TRUE
            ,'fields' => array(
                  array( // Register the outer glow field
                        'type' => 'text'
                  ,'field' => 'h_shadow'
                  ,'label' => __('h-shadow', 'stopping-the-world-admin')
                  ,'help' => 'Required. The position of the horizontal shadow. Negative values are allowed. The default value is 0px if left empty.'
                  ,'value' => '0px'
                  ,'columns' => 2
                  ,'attributes' => array(
                        'class' => 'box-shadow-h-shadow'
                  ,'placeholder' => '0px'
                  )
                  )
            ,array( // Register the outer glow field
                        'type' => 'text'
                  ,'field' => 'v_shadow'
                  ,'label' => __('v-shadow', 'stopping-the-world-admin')
                  ,'help' => 'Required. The position of the vertical shadow. Negative values are allowed. The default value is 0px if left empty.'
                  ,'value' => '0px'
                  ,'columns' => 2
                  ,'attributes' => array(
                              'class' => 'box-shadow-v-shadow'
                        ,'placeholder' => '0px'
                        )
                  )
            ,array( // Register the outer glow field
                        'type' => 'text'
                  ,'field' => 'blur'
                  ,'label' => __('blur', 'stopping-the-world-admin')
                  ,'help' => 'Optional. The blur distance. The default value is 50px if left empty.'
                  ,'value' => '25px'
                  ,'columns' => 2
                  ,'attributes' => array(
                              'class' => 'box-shadow-blur'
                        ,'placeholder' => '25px'
                        )
                  )
            ,array( // Register the outer glow field
                        'type' => 'text'
                  ,'field' => 'spread'
                  ,'label' => __('spread', 'stopping-the-world-admin')
                  ,'help' => 'Optional. The size of shadow. Negative values are allowed. The default value is 5px if left empty.'
                  ,'value' => '5px'
                  ,'columns' => 2
                  ,'attributes' => array(
                              'class' => 'box-shadow-spread'
                        ,'placeholder' => '5px'
                        )
                  )
            ,array( // Register the outer glow field
                        'type' => 'colorpicker'
                  ,'field' => 'color'
                  ,'label' => __('color', 'stopping-the-world-admin')
                  ,'help' => 'Optional. The color of the shadow. The default value is white if left empty. Look at CSS Color Values for a complete list of possible color values.'
                  ,'value' => '#ffffff'
                  ,'columns' => 2
                  ,'attributes' => array(
                              'class' => 'box-shadow-color'
                        ,'placeholder' => '#ffffff'
                        )
                  )
            )
            )
      )
));
?>

October 8, 2015 at 10:25 pm #4483

Steve
Keymaster

@mnlearth– Welcome to the Piklist Community!

Thank you for testing the beta.

Would you be able to zip up your plugin and email to [email protected] ? It would be much easier to debug.
October 9, 2015 at 12:26 am #4489

Mehdi Salem
Member

Sure I understand, I did not realize the code was SO LONG 🙂

Here is it…

I use this code in my Genesis custom child theme, not sure if I’m doing anything wrong but for sure it is working with the Piklist version 0.9.5.v you sent me last time and that I’m using for all my work since then…

Thank you Steve!
October 9, 2015 at 10:15 am #4494

Steve
Keymaster

@mnlearth– You cannot upload zip files on this site. You need to email to [email protected]
October 9, 2015 at 12:25 pm #4497

Mehdi Salem
Member

Ouch…! Will do 🙂
October 9, 2015 at 12:55 pm #4498

Mehdi Salem
Member

Ok Steve, I just emailed you my code as a zipped plugin.

Please confirm that you received it this time

Thanks!
October 9, 2015 at 1:38 pm #4499

rcreators
Member

Hello,

Yes setting tabs are broken in 0.9.9.1 which was working in older version. i just updated piklist beta 0.9.9.1 and my old tabs gone, everything is on main page.
October 9, 2015 at 4:08 pm #4502

Steve
Keymaster

In Piklist v0.9.9 we changed the way Workflow tabs were built. Settings tabs were supposed to be backwards compatible, but apparently they are not. We will work on a fix, but will not have it released until Monday.

The easiest way to fix your tabs is to build them using the new Workflow process. It’s very easy, and documented here. You will need to follow all the steps, but honestly it should be very quick.

I just pushed an update to WP Helpers so you can use that as a guide as well.

Let us know if you have any questions.
October 10, 2015 at 1:51 am #4511

Mehdi Salem
Member

Thanks Steve,

I did re-build my tabs using the new Workflow process.
All seems to be displaying okay now on 0.9.9.2, did not have time to test if fields are saving okay and other functionalities of my custom theme but I will do soon and keep you posted if any pray jumps out of the bushes.

Looking forward to testing the backward compatibility when ready

ps: one visual thing I miss though in this new version: the “+” button to add fields for add_more used to be blue… but it has no background anymore in Piklist version 0.9.9.2 — of course I can style it but it feels to me that it should be standard 🙂

Keep up the impeccable work guys.
Cheers!
October 10, 2015 at 6:32 am #4514

Mehdi Salem
Member

Hi Steve,

I started testing and I found some issues with image and limit validation.

Since in my view it seems to be related to add_more or group fields rather this topic’s issue, I will open a new thread and post some solutions.

Thaks
October 10, 2015 at 10:42 pm #4525

Steve
Keymaster

@mnlearth– We changed the buttons because we thought they were too distracting. Would love to hear what others think.

Saw your other tickets… both are great catches. We’ll look into a fix.
October 12, 2015 at 1:21 am #4532

Mehdi Salem
Member

Makes sense, I agree it is quite distracting after all

Author

Posts

Viewing 12 reply threads

The topic ‘Settings page Tabs broken: Piklist 0.9.9.1’ is closed to new replies.

Topic: [Resolved]Settings page Tabs broken: Piklist 0.9.9.1

Attachments:

Piklist v0.9.9.8 is now available

Piklist is now on HackerOne

Topic: [Resolved]Settings page Tabs broken: Piklist 0.9.9.1

Attachments:

Stay up-to-date with Piklist