Can you please consider adjusting the Quick CSS section? - Support

Tagged: Admin, CSS, quick css, theme-settings

Viewing 5 posts - 1 through 5 (of 5 total)

Author

Posts

June 5, 2025 at 5:04 pm #1485117

I use the Quick CSS section extensively, especially when designing and developing, before pushing back out to a child theme css file. But, during the design/development phase, I am constantly having to scroll through a narrow window, even if I do extend it, it is incredibly wasteful on screen real estate.

Would you consider either putting the section description at the top or the bottom and allowing the text area to spread across the entire width?

Huge bonus points if you would consider giving this whole section an upgrade like many other css editors. It is definitely not worth it holding the full-width changes, though.

June 5, 2025 at 6:53 pm #1485118

Guenni007

Participant

can you put this to your child-theme functions.php:


function admin_head_mod() {
echo '<style type="text/css">
  #avia_quick_css .avia_description {float: none;margin-bottom: 20px !important;padding-left: 0 !important;width: 98%}
  #avia_quick_css .avia_control {float: left;max-width: 98% !important;width: 98% !important}
  .avia_footer_links li {float: left;padding-right: 20px}
  .avia_footer .avia_footer_save {float: left}
  .avia_reset {display: none !important } 
  #avia_options_page { max-width: 3000px!important}
  #avia_options_page textarea {border: 3px solid #2271b1;min-height: 500px; height: unset}
</style>';
}
add_action('admin_head', 'admin_head_mod');

i think there is now an option to hide the reset button – but it is inside this code too.

June 5, 2025 at 7:32 pm #1485120

Guenni007

Participant

maybe a mod knows a better way to shift the quick css input field to top of the styling options section.
(I was familiar with that filter because I had used it before to place a new input field for Apple Touch icons behind the favicon.)

/**
 * Custom function to reorder Enfold theme options.
 * Moves the 'Quick CSS' input field above the 'Color Scheme' selector.
 * Assumes both 'quick_css' and 'color_scheme' elements are always present.
 */

function custom_enfold_reorder_styling_options($avia_elements) {
    $quick_css_option = null;
    $color_scheme_option_index = -1;
    $quick_css_option_index = -1;

    // Find the 'quick_css' and 'color_scheme' options and their original indices.
    foreach ($avia_elements as $index => $element) {
        if (isset($element['id']) && $element['id'] === 'quick_css') {
            $quick_css_option = $element;
            $quick_css_option_index = $index;
        }
        if (isset($element['id']) && $element['id'] === 'color_scheme') {
            $color_scheme_option_index = $index;
        }
    }

    if ($quick_css_option_index > $color_scheme_option_index) {
        // Remove the 'quick_css' option from its original position.
        array_splice($avia_elements, $quick_css_option_index, 1);
        array_splice($avia_elements, $color_scheme_option_index, 0, [$quick_css_option]);
    }

    // Return the modified array of theme options.
    return $avia_elements;
}

// Hook into Enfold's option page data initialization filter.
add_filter('avf_option_page_data_init', 'custom_enfold_reorder_styling_options', 10, 1);

June 5, 2025 at 9:50 pm #1485125

Guenni007

Participant