The most exciting part of using ACF with ignition is that you can add your own sections! This is extremely useful when creating a custom site that needs it’s own special blocks. Or you have a very difficult section that requires a lot of code.
If you know how to use ACF this is quite easy.
Firstopen the field group sections (or header sections if youradding a header).
- Open the
- Here you can duplicate or add a new layout.
- Make sure you set the name of your new layout.
- This will create a new section. You can put whatever fields you want inside. This section will now show up for clients when selecting sections on an edit page screen.
Special field Settings
When making new fields you may notice there are two special settings. these only affect the back end of WordPress when creating pages and posts.
Admin Only Setting
The Admin only setting will make the field only show up on the back end only if an administrator is logged in.
Set Value as Class
This cool field will only work on text fields. On the edit page, it will take the value of the field and add it as a class to a selector of your choosing. It is helpful for setting the layout of acf fields on the backend.
For instance in the text sections field which comes with ignition, there is a grid class field under the advanced tab, where the user can add a class to be used to hold the repeated text sections. This field is set to take it’s value and apply it as a class to another field with the class .grid-class. This is how the text sections are able to show as a grid on the back end as well as the front.
This is very useful when trying to get the back end to match the front end. You can dynamically add classes to the ACF output on the back end so it shows up and changes appropriately.
Adding the section template file
Once a section is added, you will want to add a php file that corresponds to it. You can find all the other sections under template/parts/acf-blocks. Here you can add your own file, named after the sections layout name. So if you created a new section called grandmas kittens, the name is probably grandmas_kittens.php.
You can then put whatever you want in this file and it will magically show up whenever that section is used! Check out the other files to see how they are output so you can get an idea on how to make your own sections.
Outputting Sections Fields
Remember that you will need to use get_sub_field() to get any fields for that section as opposed to get_field(). These php files are actually inside a big conditional statement that is set to output a ACF Layout. It finds the layout and looks for a file with the same name. You can see how it works by openening the file sections.php within the blocks folder.
Because we are inside a big flexible field you must use get_sub_field().
Ignition outputs each section in an actual section tag. This tag typically has an ID attribute with
$section_hash which gives your section a unique ID. This variable is available in all section files and comes from the sections.php file. This way if you want to send a user to that page and scroll to that section you can.
There is also usually a class output with
get_row_layout() so that this section can be styled with CSS.
It also might be a full width section, in which case it has the CSS class
alignfull. There are a few blocks that come with ACF to begin with.