Support

Account

Home Forums Add-ons Flexible Content Field Select2 for choosing Flexible Content Fields?

Helping

Select2 for choosing Flexible Content Fields?

  • I’m using Flexible Content Fields (FCF) as a sort of layout builder. Many folks are doing that.

    I purchased a ready-made HTML template and am progressively converting each of the “content blocks” that come with that, into template bits that are delivered via the FCF type.

    The problem I can foresee as I progress, is that the default approach to selecting a FCF is going to be problematic, if I end up with dozens of these template bits.

    Currently, FCF uses a “tooltip” selector which you go to add a new one onto the page.

    I would MUCH prefer a Select2 kind of interface, with an autocomplete/filter based on what I start typing in.

    Has anyone done that, or can they look at it??

    Would help me greatly and I think it would overall make more sense.

    Thoughts?

    A

  • Hi @alicam

    I’m afraid this is hard to achieve. You need advanced HTML and Javascript code to do it. If you don’t know how to code, you can always submit a feature request here or hire a developer to help you out with it.

    Basically, you can use the acf/render_field action to add the select2 field and then use the acf/input/admin_footer action to add the Javascript needed to monitor the clicks of the select2 field.

    When someone clicked the option, you need to add the flexible content just like when you clicked the Add Row button. You can emulate the click like this (you can try it on the JS console window):

    jQuery('.acf-field-1234567890abc .button-primary').click();
    jQuery('.acf-field-1234567890abc .acf-fc-popup [data-layout="flexible_layout_name"]').click();

    Where “acf-field-1234567890abc” is the field class (based on field key) and “flexible_layout_name” is the layout name.

    I hope this makes sense 🙂

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

The topic ‘Select2 for choosing Flexible Content Fields?’ is closed to new replies.