| Mason extends the Advanced Custom Fields Plugin to manage predefined Flexible Content Blocks in a single directory. |
Noted That:
|
Start the Tips:1. First Download "mason.zip" Plugin to your Local Computer. (Click Download) 2. Then, Login to your "yourdomain.com/wp-admin" Dashboard.
3. Then, Click on "Plugins" + "Add New" from left sidemenu of Dashboard.
4. Now, Click on "Upload Plugin" button.
5. Now, Browse "mason.zip" Downloaded plugin from your computer, Where you downloaded mason.zip According to Step – 1 Above then, click on "Install Now"
6. Now, Click on "Active Plugin"
7. Then, See left sidemenu. "Mason" folder is added on left sidemenu. Now, Click on "Mason" folder. Noted that: If you do not see "Mason" folder on left sidemenu then, see at left sidemenu "Settings" or "Tools". 8. Now you configure yourself oR Watch video tutorial below about Mason Configurtions and Settings or How to work "Mason" in your WordPress site. oR After Activated Plugin According to Step-6 then,
 |
| Guide |
|---|
| The Module System in the Mason Plugin Mason uses a custom made module system. We found we were redesigning the same design and functionality for parts of websites over and over – like a full width background video, or a carousel, or a location map. We were rewriting the code for the same “block” a couple times in one website. And then we’d write the same code for a similar block for another website. There clearly had to be a better way. A way where we could reuse the code within a site and borrow it from other sites. So we built our modules system. A “module” to us is a block on a webpage that is used on multiple pages, or multiple places on the same page. Like a banner with a background image and an < h1> title tag. Or a two-column layout. A “module” is a section that has a very specific style and functionality. Some common modules we use are:
You can see the tutorial here for those: https://www.advancedcustomfields.com/resour The Mason Module System still uses the ACF plugin and the flexible content field, but we code it differently than you may have seen before. If you look in /Mason/includes/modules you’ll see a sub directory with the name ‘generic_content_test’. This a self-contained “module”, containing the same file structure:
Let’s review these files. module_layout_acf_def.php this is where you define your acf flexible content field. If you go into the ACF Plugin page in the admin section, you can create the acf fields you need there, and then from the admin->Custom Fields->Tools->Export Field Groups: you select the group you defined and click on the ‘Generate Export Code’ button. You can copy and paste from that output the fields you want to include. Please review an existing module_layout_acf_def.php file for the proper format. You are not adding the entire output from the Generate Export Code, but merely the flexible content definition. functions.php this, like a WordPress theme, is your custom functions location. Here, you only need to create a function that will query the acf fields (or other data) and create an array of values to pass to the module-view.php (the template). Again, see an example for how this is done. The main goal is to put as much of your “logic” in this file – so that the module-view.php file is mostly HTML and easier to read. If you have javascript associated with this module (which would be located in the module.js file in this subdirectory), you need to enqueue it here. module-view.php this is the template for your module. The available variables should be listed in the comments at the top of the file. It is permissible to write php logic here (and often necessary), but it should be as little as possible. Basically, only use php to check if the value exists before printing out the HTML. _modules.scss You will add your styling for this module here. |
| content, flexible, blocks, single, directory, predefined, manage, advanced, extends, custom, |
| Name |
|---|
Reffered: https://wordpress.org/