Getting started with Awesome Studio Framework

Awesome Studio framework for WordPress is made up of two things Awesome Dev Platform and Awesome Studio. 

Once you have installed Awesome studio and the theme Monomyth, you will need to grant yourself developer capabilities by editing your profile.
.

developer-access

Once you have granted yourself developer access, you will start seeing Awesome  Dev menu both on the admin bar at top and side menu bar.

 

awesome-dev-overview

Awesome Dev Platform

Awesome Dev menu will show following sections:

  1. Awesome Pages
  2. Awesome Modules
  3. Awesome Queries
  4. Awesome Data
  5. Awesome Hooks
  6. Awesome Core

Awesome Pages

This is used to hold the various unique layouts of site template/pages, it is primarily a collection of Awesome Modules assembled together in a desired layout. You write your HTML inside awesome pages and then call it inside WordPress page using aw2_page shortcode.

To create/design single page template of a custom post type, just create an awesome page with slug as “<post-type-slug>-single” and Monomyth theme will automatically pick this page while displaying the single page. Within single page you can access current post values using aw2_value shortcode.

To create/design archive pages you can create an awesome page with slug “<post-type-slug>-archive” and it will be picked up by Monomyth when showing archive pages. You can use aw2_loop to access data without any specific ID.

By default “Core” section has a catch all for archive and single pages.

Awesome Modules

Awesome Module is the building block of awesome studio framework and makes it the most reusable framework for WordPress. This is where we write all our HTML, CSS and JavaScripts, by putting all the dependencies of a module in one place, we make the future enchantments and manageability easier.code-complete

Modules are called using aw2_module, you can call another module inside a module. Our editor supports code autocomplete, so that you don’t have to remember everything

Awesome Queries

If you are building complex web applications you write you data queries here. This ensures that all queries are in one location thus making our queries reusable. We use aw2_query_posts to create the queries and Awesome queries are used by calling aw2_query.

Awesome Data

This is where we keep our static aka hard coded data, this comes in very handy when you are creating newsletters and landing pages where the data may not fit anywhere else. It allows us to keep our modules clean, making then truly reusable.

Awesome Hooks

Awesome hooks allows us to execute code blocks at various WordPress action and filter hooks. We set hooks using aw2_set_hook. If you need to do some activity at init, register custom post types, load SPA libraries etc, this is where you write them.

Awesome Core

This is required for working of Monomyth theme. It is shipped along with global header and footer modules, and fallbacks for single, archive and 404 pages.

“global-js-definitions” module withing ‘core’ is used to keep quick SPA definitions.

front-editor

Once you start checking the website, logged in as administrator, you see ‘Editor’ button at the bottom, which will show you list of all the modules used on that page, with one click access to edit it, just in case you need to quickly change something.

Awesome Studio

Awesome Studio is the second component of our Awesome Studio Framework, which makes assembling of websites and web applications a breeze.

parts-catalog

 

It gives you access to our parts catalog, that are ready to use modules. You can add and call them within your awesome pages, and it works. Using parts reduces your development efforts by at-least 50%, and the best part is you can edit them without worrying about they getting overwritten in the next upgrade of the plugin 😉

You can easily check all the installed parts and how to use them.

parts-list