Custom Element Multi-Choose not respecting column settings

Hello.
We have some custom elements built following the guide provided (https://theme.co/apex/forum/t/cornerstone-content-builder-custom-elements/217).
Our element controls are ‘multi-choose’ and we’ve also tested them as ‘choose’
The ‘columns’ setting is not being honored. It will always output a number of columns equal to the number of options in the ‘choices’;

To test, we edited the Classic Recent Posts element’s orientation controls. We added a third option and maintained the column setting as ‘2’. The output was 3 columns.
.../themes/pro/cornerstone/includes/elements/classic/_alternate/recent-posts.php:75

$this->addControl( 'orientation', 'choose', __( 'Orientation!', 'cornerstone' ), __( 'Select the orientation or your Recent Posts.', 'cornerstone' ), 'horizontal', array( 'columns' => '2', 'choices' => array( array( 'value' => 'horizontal', 'label' => __( 'Horizontal', 'cornerstone' ), 'icon' => fa_entity( 'arrows-h' ) ), array( 'value' => 'vertical', 'label' => __( 'Vertical', 'cornerstone' ), 'icon' => fa_entity( 'arrows-v' ) ), array( 'value' => 'oblong', 'label' => __( 'oblong', 'cornerstone' ), 'icon' => fa_entity( 'flask' ) ) ) ) );

Is this a known issue? Is there a fix?
Thank you

Hi Rob,

I tried in my local test and it’s doing the same thing.
I will forward this to our web development team for review.

Thanks.

Hi @redpupmedia,

I’m sorry you’re running into this issue. I can certainly clarify here. Regretfully, we had to remove that option for enforcing a column count when we added V2 elements. When the Indpector is horizontal, there can be a max of 5 controls per group (box) and each control has a set height. You’ll also notice that the choices got smaller to accommodate this.

If you need more than five options or they start to feel cramped, you might want to consider using a select control instead.

Let us know if there’s anything else you need after updating!

Thanks @alexander and @paul.r

Understood.
We have about 37 and growing options (a custom post type) and an unlimited number can be selected for each instance of the element, so we do need another option. Our back up plan was to style the <ul> for those options. But our custom element’s style sheet is not being loaded. Would you please confirm if that part of the demo element should still be functional?

Thank you

The my-extension.css us loaded in my test site so that part is still working.

Thanks.

Ah. My mistake. I thought the stylesheet would allow me to style the element’s controls, not the on-page output.
Is there a method to add styles to the element control interface?

Thank you

I believe styling the controls is not allowed for design consistency but I’ll double check. Please stay tuned.

Thanks.

Hi @redpupmedia,

I’m sorry, I can confirm that no there isn’t a supported way we offer for styling the builder UI. I can help you with a workaround but please know we can’t really support these kind of modifications.

There is a hook called cornerstone_before_boot_app. In functions.php of a child theme, you could do something like this:

add_action('cornerstone_before_boot_app', function() {
  add_action('wp_enqueue_scripts', function() {
    // enqueue stylesheet here
  });
});

Just know that if you restyle that choose control to allow more options, it could start to break the layout of the inspector if the user switches to horizontal mode.

Understood.
Thank you for this hook!

You are most welcome. :slight_smile:

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.