Documentation / Guide

Getting started with Awesome Studio Platform

# Install Awesome Studio Platform Plugin

The quickest way to install Awesome Studio plugin is by going to our 'Install' page, and specifying URL where you want to install. In case that option does not work, you can download the plugin directly from WordPress.org, and follow the detailed instructions for manually installing Awesome Studio.
Was this helpful? Yes No

Suggest Edit

Steps to create new guide of Install Awesome Studio Platform Plugin

# Install Monomyth Theme (optional)

Monomyth Theme for Awesome Studio platform
To get most out of Awesome Studio, you will need to download and install Monomyth theme, you can find the detailed instruction for installation in "Installing monomyth theme" tutorial. Along with Monomyth zip file, you will also need to Import aw2_core posts xml, which is required for Monomyth to function normally. While, installing Monomyth is optional for usage of Awesome Studio platform, it is strongly recommended. It makes Awesome Studio even more powerful and takes your development to next level for creating websites and application in WordPress. Most importantly it does not blot you website by loading unnecessary scripts and styles.
Was this helpful? Yes No

Suggest Edit

Steps to create new guide of Install Monomyth Theme (optional)

# Enable Dev Mode

Once Awesome Studio platform plugin is installed, you need to go to your edit profile page and give your self developer access by selecting the checkbox. Only administrators with developer access will be able to create, edit or delete modules and app within awesome studio, even editing or creating new core module for Monomyth theme requires developer access.
Dev mode for using Awesome Studio
Was this helpful? Yes No

Suggest Edit

Steps to create new guide of Enable Dev Mode

# Quick Overview of Platform

Overview of Awesome Studio
Awesome Studio platform is made up of core shortcodes library, custom shortcodes, modules and triggers. Modules & Triggers are also grouped together to form Apps.

Awesome Modules

Awesome Module is the building block of awesome studio platform 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. A module can be called inside another module or page using aw2.module shortcode.
Awsome Modules
Awesome Triggers

Awesome Triggers

Awesome triggers are special modules that are executed during various WordPress action and filter hooks. If you need to do some activity at init like register custom post types, load SPA libraries etc, this is where you write them. Currently on  small number of useful WordPress hooks are supported.

Awesome Shortcodes

This is another special type of module that allows you to wrap commonly used workflows within a project as shortcode. This allows us to use them as easy as we use other core shortcodes of awesome studio platform. These shortcodes can only be used within an awesome modules. For more details see aw2.shortcode.
Awesome Shortcodes
Awesome Apps

Awesome Apps

Awesome Apps takes over a slug to create custom workflows easily. The slug you create is taken over by awesome studio to give you custom flow. It has it's own set of modules and triggers. By using Awesome Apps you can package custom workflows neatly, and at the same time make future maintenance super simple.

Awesome Core

Awesome Core modules are used by Monomyth theme to create global headers, footers and custom post layouts. These core modules can not be used by any other modules. but they can call and use global modules within them. It allows you to create custom post type and archive layouts quickly using existing modules.
Awesome Core
awesome-studio-catalogue

Awesome Catalogue

Awesome catalogue is list of ready to use modules, triggers, shortcodes and apps that you can install within your website in just one click and use. As our catalogue grows it will reduce development time further, as you can just install the module, include within your page and be done.
Was this helpful? Yes No

Suggest Edit

Steps to create new guide of Quick Overview of Platform

# Creating Your First Awesome Module

Awesome Modules are the basic building blocks of a page within Awesome Studio platform. Within a website we first identify all the modules we need then we create/install them for use. We then use these ready modules to quickly assemble new layouts for our pages. Here is how you can create and use a module.
  1. create a global module :
    1. Click on 'Awesome Studio'  in the left panel and then click on 'Global Modules'.
    2. Click on 'Add Awesome Module'
    3. Let's Give our module a title, 'hello-awesome', we generally write the title in small letters and without spaces to ensure that the slug and title for the module are same making it easier to remember the slug of a module. We use the slug to refer these modules.
    4. [aw2.set module.post_class='{{aw2.get module.slug}}_post' module.post_unique_class='{token}' /]
[aw2.client less]
  .[aw2.get module.post_unique_class /]{
    border: 1px dotted [aw2.get module.border-color /];
  }
  
  .[aw2.get module.post_class /] {
    .section-title{
		background-color:#000;
		color:#fff;
	}
	.intro{
		color:#000;
		border: 1px solid red;
		margin:2px;
	}
     
  }
[/aw2.client]
 
<div class="[aw2.get module.post_unique_class /] [aw2.get module.post_class /] [aw2.get module.class /]">
	<section title='[aw2.get module.slug /]'>  
	  <h2 class='section-title'>[aw2.get module.section_title /]</h2>
	  <p class='intro'>[aw2.get module.introduction /]</p>
	</section>	
</div>
       
    5. Click the publish button, you can also use 'crtl+s' to save the modules
  2. calling it within a page
    1. Now you have a published module that can be used within page or another module. let's see how to use awesome module.
    2. Click on pages -> add new page on the left panel.
    3. Give it a title "Test Awesome Module"
    4. In  the content area type following 
      [aw2.module slug="hello-awesome"]
	[aw2.this module.section_title="Hello Awesome" /]
	[aw2.this module.introduction]
	 By creating a awesome module, you keeep all the dependecy of module in one place making it easier to maintain and change in future.
	[/aw2.this]
[/aw2.module]
       
    5. By using aw2.module you call a module, and by using aw2.this within aw2.module you can set the parameters of the module.
    6. Save the page, and view this page.
    7. Now let's call this module again within the same page
    8. [aw2.module slug="hello-awesome"]
	[aw2.this module.section_title="Hello Awesome" /]
	[aw2.this module.introduction]
	 By creating a awesome module, you keeep all the dependecy of module in one place making it easier to maintain and change in future.
	[/aw2.this]
[/aw2.module]

[aw2.module slug="hello-awesome"]
[aw2.this module.border-color="#00ee00"]	
[aw2.this module.section_title="Awesome Again" /]
	[aw2.this module.introduction]
	This is same awesome module, called again within the page
	[/aw2.this]
[/aw2.module]
       
    9. Save the page and check again. This is how we create and use a awesome module.
  3. calling it within another module
Was this helpful? Yes No

Suggest Edit

Steps to create new guide of Creating Your First Awesome Module

# Creating Your First Awesome App

  1. Register your App (better install blank app from catalouge)
  2. Create App specific module
  3. Call them inside the App specific pages.
  4. Visit the App URL to see it working
Was this helpful? Yes No

Suggest Edit

Steps to create new guide of Creating Your First Awesome App