Advanced Custom Fields Hidden Field

Question

I am utilizing ACF within a Wordpress site to configure some options for a custom post type, and using the ACF Unique ID plugin to generate a field that builds a unique ID for the field. It's configuration is extremely basic:

class acf_field_unique_id extends acf_field {

function __construct() {

    /*
    *  name (string) Single word, no spaces. Underscores allowed
    */

    $this->name = 'unique_id';


    /*
    *  label (string) Multiple words, can include spaces, visible when selecting a field type
    */

    $this->label = __('Unique ID', 'acf-unique_id');


    /*
    *  category (string) basic | content | choice | relational | jquery | layout | CUSTOM GROUP NAME
    */

    $this->category = 'layout';


    /*
    *  l10n (array) Array of strings that are used in JavaScript. This allows JS strings to be translated in PHP and loaded via:
    *  var message = acf._e('unique_id', 'error');
    */

    $this->l10n = array(
    );


    // do not delete!
    parent::__construct();

}


/*
*  render_field()
*
*  Create the HTML interface for your field
*
*  @param   $field (array) the $field being rendered
*
*  @type    action
*  @since   3.6
*  @date    23/01/13
*
*  @param   $field (array) the $field being edited
*  @return  n/a
*/
function render_field( $field ) {
    ?>
    <input type="text" readonly="readonly" name="<?php echo esc_attr($field['name']) ?>" value="<?php echo esc_attr($field['value']) ?>" />
    <?php
}
}

While all of this works great, the ID field is designed to be an internal ID marker and isn't something the end user needs to see inside Wordpress. Is there a way to hide the column associated with this field so I don't lose valuable screen real estate? The column spans 33% of the width, and since it's for a field that isn't necessary, it's taking up way too much space. I've tried hiding it in CSS and Javascript, but that makes the end columns (repeater row number and the +/- signs) much larger for some reason.

score 2 · Accepted Answer · answered Feb 27 '18 at 00:48

2

Have you tried changing it to input[type="hidden"]?

function render_field( $field ){
    echo '<input type="hidden" readonly="readonly" name="'. esc_attr( $field['name'] ) .'" value="'. esc_attr( $field['value'] ) .'" />';
}

answered Feb 27 '18 at 00:48

Xhynk

13,513
8
32
69

This probably would work _if you checked which field_ is being rendered with some conditional logic. This function appears to render _all_ fields, but only one of them should be hidden. – random_user_name Feb 27 '18 at 01:28
I assumed it only rendered the one field, being `readonly` and all. However it would be trivial to wrap it with `if( $field['name'] === 'desired name' )` if necessary – Xhynk Feb 27 '18 at 02:52
@Xhynk - yep, the table cell still gets rendered though so it just becomes a big, empty space. – Scott Salyer Feb 27 '18 at 20:56
It sounds like you'll need to hide it in whatever way you prefer (`type="hidden"`, `display: none;` etc.) and then apply some additional CSS for the other row elements. It's hard to give precise advice without having the code available however – Xhynk Feb 27 '18 at 21:02

Advanced Custom Fields Hidden Field

1 Answers1