From iThemes Codex
Jump to: navigation, search


Builder Child Air is a new foundational or starter child theme for iThemes Builder. Whether you're using the Builder Style Manager or writing your own CSS, we hope Air will be a great new place to start when creating your custom responsive-ready Builder child themes.

Builder child Air includes several convenient built-in features to help lay the groundwork for custom child theme creation.


Air 2013-04-12 09-33-58.png

Theme Demo

See Air in action on this live Demo

Builder Layout Export zip file - can be used to import the demo site's layout and settings.

Blog Announcement

Read the blog entry announcing the release of Air.


Purchase Air

Air Features

  • Built-in Mobile-Ready Menu Style
  • Fully Optimized for Style Manager
  • New Inset Module Styles
  • Full Window Image Style


How to Change the Appearance of Search


How to show Excerpts instead of full post content on Posts page

1. Duplicate (using a FTP client or cPanel file manager)




and edit content-excerpt.php.


<?php the_content( __( 'Read More →', 'it-l10n-BuilderChild-Air' ) ); ?>


<?php the_excerpt(); ?>

2. Edit Air's index.php and change

<?php get_template_part('post-formats/content', get_post_format()); ?>


<?php get_template_part('post-formats/content-excerpt', get_post_format()); ?>

That's it.

If you would like to do the same in other views like Archives or Search, edit the appropriate files.

How to have logo at left and navigation menu at right

WordPress Dev Site 2013-05-20 07-52-04.png

1. Create a HTML module and paste this code in the textarea:

<div id="logo"><a href="<?php bloginfo('url'); ?>"><img src="<?php bloginfo( 'stylesheet_directory' ); ?>/images/logo.png" alt="Home" /></a></div>

<div class="my-menu-container"><?php wp_nav_menu( array( 'menu' => 'Primary', 'menu_class' => 'builder-module-navigation') ); ?></div>

Set Enable PHP to Yes.

Screen Shot 2013-05-20 at 7.50.56 AM.png

Upload your logo to child theme's images directory and replace "logo.png" in the above code with the name of your logo image.

Also change "Primary" in the above code to the name of custom menu at Appearance -> Menus that you wish to appear in the nav bar.

2. Add the following at the end of child theme's style.css (WP dashboard -> Appearance -> Editor):

#logo {
	float: left;

.my-menu-container {
	float: right;

[Optional] Also add this CSS to reduce the extra space above and below the content of our HTML module:

.builder-module-2 {
	padding-top: 1em !important;

.builder-module-2 .builder-module-element {
	margin-bottom: 1em !important;

Change the number 2 in ".builder-module-2" above to the position of module from the top in layout.

← Back to Builder Codex Home