• Resolved 61pixels

    (@61pixels)


    I’m using Dynamic previews for my Flexible Content fields. For every layout group in my output code I use something like id=”blocknum-<?php echo get_row_index();?>” to be able to apply dynamic styles/js inline when needed.

    This works and outputs everything correctly on the front-end. However I just noticed in the admin with Dynamic Previews, they simply all return a value of 1. So every single layout group on the backend, in the dynamic preview, it’s outputting id=”blocknum-1″. It’s making it tough for me to update the dynamic inline styles for those layouts on the backend. There are workarounds I can do, however this seems like either a bug, or something I’m missing?

Viewing 3 replies - 1 through 3 (of 3 total)
  • Plugin Author Konrad Chmielewski

    (@hwk-fr)

    Hello,

    Thanks for the feedback!

    The get_row_index() ACF function is a helper which only works paired with the have_rows(): the_row() logic. As you pointed out, this will work on the front-end, since the Flexible Content is displayed using it.

    In the back-end, ACF directly retrieve database values and render fields inputs using a classic foreach loop. However, ACF Extended generate a temporary have_rows(): the_row() with only 1 row individually for each Layout Preview (either when the page load, or during the ajax preview refresh). This is what allows the usage of get_sub_field() in your layout template for example. This is also why your get_row_index() always returns 1 in the admin.

    I made some tests, and managed to make the get_row_index() work in the preview using a trick with the row_index_offset ACF setting (see documentation). I’m adding this compatibility fix in the next patch. In the meantime, you can implement this fix following these steps:

    In the file /acf-extended/includes/fields/field-flexible-content-preview.php line:454, add the following code:

    acf_update_setting('row_index_offset', $offset);

    In the same file, line:441, add the following code:

    $i      = (int) $options['i'];
    $offset = (int) acf_get_setting('row_index_offset');
    acf_update_setting('row_index_offset', $i + $offset);

    The final code should look like:

    global $post;
    $_post = $post;

    $i = (int) $options['i'];
    $offset = (int) acf_get_setting('row_index_offset');
    acf_update_setting('row_index_offset', $i + $offset);

    // Deprecated
    // do_action_deprecated(...)
    // depreacted actions lines here...

    // Template
    acfe_flexible_render_layout_template($layout, $field);

    $post = $_post;
    acf_update_setting('row_index_offset', $offset);

    This will fix the get_row_index() usage in the Layout Preview in the back-end.

    Note: There is a small drawback by using the get_row_index() in the Admin Preview. When moving a layout, the preview is not refreshed, which means the index is not updated. You need to open/close the layout in order to refresh the preview and get the updated index.

    It’s also the same for other layouts which are not refreshed when a layout is moved. However, when the post is updated, and the page is reloaded, all indexes are showing the correct value (since all layouts are refreshed). You can see this behavior in this video demo here.

    In order to get a complete experience, all layouts must be refreshed every time a layout is moved to refresh all row indexes. This logic doesn’t exist in the Dynamic Preview at the moment. I prefer not to implement it by default, as it might be resource heavy depending on the website configuration (if a page has 50 layouts, it will trigger 50 ajax requests each time a user move a layout). But this could be an additional setting in the Flexible Content > Async settings, when indexes are important as in your use case. I’m adding it on my todo list, see if what can be done.

    Hope it helps!

    Have a nice day!

    Regards.

    Thread Starter 61pixels

    (@61pixels)

    Wow. Now THAT is support! That’s better support than I’ve received from premium products in the past. Extremely impressed!

    Thank you so much for a solution. It’s much appreciated! I honestly can’t believe I never really noticed it before until now. I think it’s because most use cases where I need to write inline code is when using JS solutions, and I always just disable that in my flexible previews with the is_preview() check to just output static html for the preview instead of loading the JS etc on the backend (could get messy I felt like with lots of blocks).

    The drawback you mention I completely understand and thankfully really isn’t an issue for me. It’s not important for the #’s to instantly change when dragging the order. I only use the row_index to target that specific block for CSS/JS changes that are needed inline (seemed easier than using a RNG). So long as they are different, dragging to a new order won’t affect anything even if it doesn’t update instantly.

    Thanks again so much!

    Plugin Author Konrad Chmielewski

    (@hwk-fr)

    Hello,

    I’m glad to hear it now works as expected!

    If you enjoy this plugin and its support, feel free to submit a review. I always helps, and it’s much appreciated ??

    Have a nice day!

    Regards.

Viewing 3 replies - 1 through 3 (of 3 total)
  • You must be logged in to reply to this topic.