How to split chunk with ACF Flexible content

radicle
,
1

Hi,

How to split chunk with ACF Flexible content?
Actually I’m using this in my functions.php:

/**
 * Récupère la liste des noms de dossiers valides dans les répertoires views, scripts et styles.
 *
 * Un dossier est considéré comme valide si :
 * 1. Il a le même nom dans les répertoires views, scripts et styles.
 * 2. Il contient les fichiers requis : template.blade.php, script.js et style.scss.
 *
 * @return array La liste des noms de dossiers valides.
 */
function liste_sections(): array
{
    // Lister les noms des dossiers dans le dossier sections
    $viewsDir = resource_path('views/sections');
    $scriptsDir = resource_path('scripts/sections');
    $stylesDir = resource_path('styles/sections');

    // Récupérer les dossiers enfants de chaque répertoire
    $viewsDirectories = array_filter(glob($viewsDir . '/*'), 'is_dir');
    $scriptsDirectories = array_filter(glob($scriptsDir . '/*'), 'is_dir');
    $stylesDirectories = array_filter(glob($stylesDir . '/*'), 'is_dir');

    // Créer un tableau pour stocker les noms des dossiers valides
    $validDirectories = [];

    // Parcourir les dossiers enfants de views
    foreach ($viewsDirectories as $viewDir) {
        // Récupérer le nom du dossier enfant
        $basename = basename($viewDir);

        // Construire les chemins des dossiers enfants correspondants pour les scripts et les styles
        $scriptDir = $scriptsDir . '/' . $basename;
        $styleDir = $stylesDir . '/' . $basename;

        // Construire les chemins des fichiers requis dans chaque dossier enfant
        $viewFile = $viewDir . '/template.blade.php';
        $scriptFile = $scriptDir . '/script.js';
        $styleFile = $styleDir . '/style.scss';

        // Vérifier si les dossiers enfants correspondants existent dans les répertoires des scripts et des styles
        // et si les fichiers requis existent dans ces dossiers
        if (
            in_array($scriptDir, $scriptsDirectories, true) &&
            in_array($styleDir, $stylesDirectories, true) &&
            file_exists($viewFile) &&
            file_exists($scriptFile) &&
            file_exists($styleFile)
        ) {
            // Ajouter le nom du dossier valide au tableau des dossiers valides
            $validDirectories[] = $basename;
        }
    }

    // Retourner le tableau des noms des dossiers valides
    return $validDirectories;
}
foreach (liste_sections() as $file) {
    $file = basename($file);

    // Ajoute la miniature sur le layout ACF
    add_filter("acfe/flexible/thumbnail/layout=$file", function ($thumbnail, $field, $layout) use ($file) {
        return asset("images/sections/$file/miniature.png");
    }, 10, 3);

    // Ajoute le fichier JS
    add_action($file, function () use ($file) {
        bundle($file)->enqueue();
    }, 100);
}

In my resources/views/sections/exemple/template.blade.php:

@php
    do_action('exemple');
@endphp
<section class="exemple">
</section>

But it is possible to load chunk a better way?

Thanks.

2

Can you elaborate on what you’re trying to do? I’m not sure what you mean by split chunks given your example code.

Are you referring to splitting assets with Bud? If so I’d take a look at dynamic imports and conditionally import scripts for the field section depending on the existence of a selector.

Also no idea what you’re trying to do with do_action('exemple').

3

Thanks for your reply.

Here some explanations:

I want to load bundle($file)->enqueue(); only when the flexible layout is in the actual page.

add_action($file, function () use ($file) {
        bundle($file)->enqueue();
    }, 100);
}
do_action('exemple')

It’s create an action which enqueue the files register with bud.

For exemple:
I created a flexible layout named ‘exemple’, a view named sections/exemple/template.blade.php, a script named sections/exemple/script.js and a style named sections/exemple/style.scss.
I need to load script and style related only when sections.exemple.template is load in actual page via:

@if(have_rows('sections'))
        @while(have_rows('sections'))
            @php(the_row())
            @foreach (liste_sections() as $directory)
                @if (get_row_layout() === basename($directory))
                    @include('sections.' . basename($directory) . '.template')
                @endif
            @endforeach
        @endwhile
    @endif
4

For your styles/scripts, instead of trying to compile an individual file for each section and enqueueing it, take a look at the Bud Conditional CSS Docs – wrap your section in an identifiable class and check for its existence and import sections/exemple/script.js dynamically.

Not 100% sure if this works seamlessly with sass though. I’ve only used JS dynamic imports.

1 Like