BuilderChild-Architect

(Difference between revisions)
Jump to: navigation, search
Line 8: Line 8:
 
This requires the following modifications/additions
 
This requires the following modifications/additions
 
==Left menu background images==
 
==Left menu background images==
 +
The left 3 tabs navigation requires 2 background images. If they do not exist in the BuilderChild-Architect/images folder, download the [http://ithemes.com/downloads/hp-black.png black] and [http://ithemes.com/downloads/hp-orange.png orange image], and copy these to your /images/ folder in the BuilderChild-Architect folder.
 +
http://ithemes.com/downloads/hp-black.png
 +
 
==a rotating images group==
 
==a rotating images group==
 +
The next step is to setup a [[Rotating_Images|Rotating Images]] group. The [http://pluginbuddy.com/purchase/rotating-images/ Rotating Images plugin] comes free with your purchase of Builder.
 +
 +
Upload the images you want to see in the area to the right, and make note of the following. The height of the RI group should be a fixed value of 254px. The width of the RI group depends on the width you have selected for your Builder layout.
 +
 +
Example, your Builder layout is 960px. We need to reserve space for padding, margins, and the left tabs (304px), so in this case, the RI group should be set to 656px wide.
 +
 +
Make a note of the shortcode for the Rotating Images group, e.g. <code>[it-rotate group="0"]</code>.
 +
 
==an HTML module==
 
==an HTML module==
 
==CSS code to style the section==
 
==CSS code to style the section==

Revision as of 08:42, September 22, 2011

Demo Site

Note: this article refers to the Builder Child theme Architect, which is based on the Classic Architect theme but not an exact duplicate.

Contents

How to create the homepage from Classic Architect

As can be seen on the Classic Architect demo page, the home page contains a 3 tabs vertical menu, and Rotating images next to it. This article will outline how you can achieve the same using the Builder child theme.

This requires the following modifications/additions

Left menu background images

The left 3 tabs navigation requires 2 background images. If they do not exist in the BuilderChild-Architect/images folder, download the black and orange image, and copy these to your /images/ folder in the BuilderChild-Architect folder. http://ithemes.com/downloads/hp-black.png

a rotating images group

The next step is to setup a Rotating Images group. The Rotating Images plugin comes free with your purchase of Builder.

Upload the images you want to see in the area to the right, and make note of the following. The height of the RI group should be a fixed value of 254px. The width of the RI group depends on the width you have selected for your Builder layout.

Example, your Builder layout is 960px. We need to reserve space for padding, margins, and the left tabs (304px), so in this case, the RI group should be set to 656px wide.

Make a note of the shortcode for the Rotating Images group, e.g. [it-rotate group="0"].

an HTML module

CSS code to style the section

Personal tools
Namespaces
Variants
Actions
iThemes Codex
Codex Navigation
Toolbox