Home Forums Add-ons Flexible Content Field Hide Layout Option in Flexible Content Reply To: Hide Layout Option in Flexible Content

  • Hi jrstaatsiii,

    Here’s an example what i’ve done. I’ve added some comments in the code.

    Basically, I’m using acf/input/admin_head to add some css and js in the head-tag.

    My ACF layouts are named block__text-img, block__quote and block__list. I use javascript to add a class to the body tag (”has-template-X), then i use css to hide layout options.

    function acf_admin_head_layout() {
        <style type="text/css">
            /* Remove borders on li since we not removing li's  */
            .acf-fc-popup li {
                border:0 !important;
            /* WordPress Template "home"
             * - hide ACF layouts named "block__quote", "block__text-img" and "block__list"
            .has-template-home .acf-fc-popup a[data-layout="block__quote"],     
            .has-template-home .acf-fc-popup a[data-layout="block__text-img"],  
            .has-template-home .acf-fc-popup a[data-layout="block__list"] {     
                display: none;
            /* WordPress default template
             * - hide ACF layout named "block__text-img"
            .has-template-default .acf-fc-popup a[data-layout="block__text-img"] {
                display: none;
        <script type="text/javascript">
            (function($) {
                    global $post;
                    // Set a javascript variabel "$template_name" based on selected template in WP
                    // The variable is then used in window.UpdateACFView to add a CSS class
                    // name to the body-tag. Since standard/custom post types doesn't have 
                    // page templates we need to set this variable on the first page load
                    if ($post->post_type == "faq") : // set 'post' for standard post
                        echo 'var $template_name = "post-type/faq";';                   
                    else :
                        // Just get the template name
                        echo 'var $template_name = $("#page_template").val();';
                    // Add classes to body 
                    window.UpdateACFView = function($template_name) {
                        if ($template_name == "pages/home.php") {   
                        if ($template_name == "default") {   
                // When a user change the template in the dropdown we need to remove all our custom classes on the body-tag
                // and then, when ajax is completed, trigger window.UpdateACFView in order to set the correct body-class
                $(document).on('change', '#page_template', function(){
                    var $template_name = $('#page_template').val();
                    $(document).on('ajaxComplete', function(){
                        $('body').removeClass('has-template-home has-template-default'); // Clear all custom classes
    add_action('acf/input/admin_head', 'acf_admin_head_layout');