30th Jul '22
/
5 comments

Output HappyFiles Folders in Metabox Select-Field

This tutorial is part of a series where I’m gonna show you how to output custom HappyFiles Galleries and Sliders. Part one will cover a little Meta Box Integration, so you can also manage the galleries and sliders inside your Bricks’ single templates.

Bricks 1.5.0 will introduce the possibility to query against the post_type “attachment” which will bring the opportunity to query after HappyFiles folders. That’s the major reason for me to separate this tutorial in different steps as you would still need this step of the tutorial for outputting it dynamically to your single template.

Register the code first

First, you need to copy & paste the provided PHP Snippet to fetch all HappyFiles folders and output them in the correct format for MetaBox.

In case you don’t know where to place that snippet I recommend you to download & install the child theme from your Bricks account and paste the snippet in the functions.php file of it!

<?php
function get_happyfile_folders() {
    $outputChilds = true;
    $args = [
        "taxonomy" => "happyfiles_category",
        //"slug" => "downloads", // get Folder by slug
        "orderby" => "name",
        "order" => "ASC",
        "hide_empty" => false,
    ];

    $folders = get_terms( $args );

    $selectOptions = [];
    foreach ( $folders as $folder ) {
        if ( ! $outputChilds && $folder->parent != 0 ) {
            continue;
        }
        $selectOptions[$folder->term_id] = $folder->name;
    }
    return $selectOptions;
}
?>

From now on you have acces to the function get_happyfile_folders() which basically only looks for all HappyFiles folders and returns them in the needed format.

Parameters ($outputChild)

If you don’t want to have the option to select child folders then you should definitely switch $outputChilds to false.

Add your MetaBox Fields

Next, you have to add your Metabox fields. I normally use MetaBox for CPTs like Job Listings for all the stuff that can be standardized. I’ve developed the snippet above for a customer who sells Fences. So my CPT was about the different fence types and he could choose which HappyFiles gallery he wants to show on which post type and he is also able to easily keep the reference images up to date.

With that being said as a short demo use-case, you’ll need to register your MetaBox Fields. That snippet above works very well with the MetaBox ‘select’ field. But instead of passing your options you would need to provide the callback-function like so:

HF_MB-Integration

In clean words: callback: get_happyfile_folders

Validate the functionality

We haven’t created an output yet, but from now you should be able to choose a folder from your select-dropdown. You can test it out on your posts.

HF_MB-Integration(2)

How to get the corresponding Images/Files on Frontend (preview)

I’m gonna provide the steps on how to query after the Images/Files on Frontend. Feel free to use that code if you are, like me, impatient and can’t wait for the follow-up guides! 😉

function output_happyfiles() {
    // ENTER THE ID OF YOUR METABOX-FIELD HERE:
    $hf_id = rwmb_meta( 'ID-OF-YOUR-MB-FIELD-GOES-HERE' );
    $args = [
        "post_type" => "attachment",
       // "post_mime_type" => "image",
        "post_status" => "inherit",
        "posts_per_page" => -1,
        "tax_query" => [
            [
                "taxonomy" => "happyfiles_category",
                "field" => "ID",
                "terms" => $hf_id,
            ],
        ],
    ];

    $hf_query = new WP_Query( $args );
    
    // you could probably loop here through the resulsts and output the images!
    return $hf_query->posts;
}
Get access to all 610 Bricks code tutorials with BricksLabs Pro

5 comments

  • Travis Reason

    I'd love to be able to use this setup. How do we output the images in a gallery on the frontend? I can't find the rest of this series.

  • oli thompson

    Hi Sridhar, Hopefully this may be a clearer explanation...

    I am basically trying to copy this video tutorial by Nicholas Arce https://www.youtube.com/watch?v=7BDK16bxv3k&t=769s

    In this video he is trying to combine the an archive and category templates. Effectively I would just like to create just one archive page that shows category pages. These category pages are defined by the happyfiles folders in the media library (where the images are placed).

    > So the images are organised within a happyfiles media folders > In a custom post type the taxonomy field (category) is selected > The custom post type archive page queries to the following... ---> Category: Name / featured image

    My project looks like his although I haven't added any of the dynamic data queries.

  • oli thompson

    Hi Wolfgang,

    I was just following your great tutorial, which I want to adapt into my project. I was wondering if there is a way to go further to create some kind of taxonomy for media folders.

    My intended use case is to create an archive template for an artist website. On the website there is a commissions "archive" page (including paintings, drawings, sculptures and prints). Within each archive page item there is a separate gallery of images.

    If I am creating media folders for each "archive" page (including paintings, drawings, sculptures and prints) it seems that it could be simpler if I could set the taxonomy of the media folder and link that to my custom post type (so that I would not have to label and sort my media files and post type taxonomies separately.

    Would be really Interested to hear how to might approach this best, Many Thanks, Oli

Leave a Reply to Sridhar Katakam (Cancel Reply)

 

Related Tutorials..

Pro
Filtering posts by a group field’s true / false field sub field value with ACF or Meta Box in Bricks

Filtering posts by a group field’s true / false field sub field value with ACF or Meta Box in Bricks

This Pro tutorial covers how posts of a Bricks query loop can be filtered to show only the ones whose true / false or checkbox…
Categories:
Tags:
Color Custom Field as Section Background Color on Category/Term Archives in Bricks

Color Custom Field as Section Background Color on Category/Term Archives in Bricks

How to use a color from a taxonomy term custom field for as the hero section background color on archive pages.
Categories:
Tags:
Pro
Meta Box Related Project’s Featured Image URL on Single Reviews

Meta Box Related Project’s Featured Image URL on Single Reviews

Updated on 26 Jun 2025 In a recent website I worked on, a requirement was to get the URL of the featured image of a…
Download Area with HappyFiles

Download Area with HappyFiles

Aside from the series I'm currently writing on how to create custom galleries and sliders with HappyFiles, Metabox and Bricks, I have developed a snippet…
Categories:
Pro
Meta Box Group’s Number Sub Field Values Sum

Meta Box Group’s Number Sub Field Values Sum

In the Bricks Facebook group a user asked: We can define a custom function that takes a Meta Box group ID, the sub field ID…
Categories:
Tags:
Pro
Conditionally outputting an element in a Query Loop based on date-type custom field

Conditionally outputting an element in a Query Loop based on date-type custom field

This Pro tutorial shows how to output an element in a Bricks' query loop only if the value of a date-type of custom field for…
Categories: