Builder Image Module

From IThemes Codex
(Difference between revisions)
Jump to: navigation, search
 
(3 intermediate revisions by one user not shown)
Line 31: Line 31:
 
*'''Sidebars''' - Widget areas to the left, right or on both sides of the image
 
*'''Sidebars''' - Widget areas to the left, right or on both sides of the image
 
*'''Style''' - **Varies by child theme** - If the active child theme (theme design) provides [[Builder_Modules:_Alternate_Module_Styles|Alternate Module Style]] options for this module, select the desired style.  
 
*'''Style''' - **Varies by child theme** - If the active child theme (theme design) provides [[Builder_Modules:_Alternate_Module_Styles|Alternate Module Style]] options for this module, select the desired style.  
 
==Full Window and No Spacing Image Module Styles==
 
 
Builder 4.0 now supports new '''Full Window''' and '''No Spacing''' Image Module Styles.
 
  
 
<br />
 
<br />
Line 44: Line 40:
 
[[File:Image-Module-in-Layout.png|800px|link=]]
 
[[File:Image-Module-in-Layout.png|800px|link=]]
  
==CSS Class==
+
<br />
 +
 
 +
==Full Window and No Spacing Image Module Styles==
 +
 
 +
Some Builder 4.0 child themes now supports new '''Full Window''' and '''No Spacing''' Image Module Styles.
 +
 
 +
*'''Full Window''' Image Module Style - adds a full-width image to the Layout
 +
*'''No Spacing''' Image Module Style - inserts an image without padding
 +
 
 +
 
 +
==Generic CSS Class==
  
 
<code>.builder-module-image</code>
 
<code>.builder-module-image</code>

Latest revision as of 12:04, July 25, 2013

The Image Module can be used to add a static image to your Layout.


Contents

Adding an Image Module

To add an Image Module to your Layout, click Add Module and select the Image Module from the list of available Modules.


Add-Image-Module.png


Image Module Settings

Once the Image Module has been selected and added to the Layout, the Modify Image Module Settings box will appear. Customize the settings of the Image Module by selecting from the following options.


Image-Module-Settings.png


Available Image Module settings include:

  • Name - To help identify widget locations
  • Upload Image - Choose the location of your image file
  • Height - “Automatic,” “Use a height that preserves the image’s aspect ratio” or “Manual, select a height manually” (to set your own image height)
  • Link URL - Where the image will link
  • Sidebars - Widget areas to the left, right or on both sides of the image
  • Style - **Varies by child theme** - If the active child theme (theme design) provides Alternate Module Style options for this module, select the desired style.


Click the Save button to save the Navigation Module Settings. You'll now see the Navigation Module added to your Layout, denoting the type of navigation used by the Module.


Image-Module-in-Layout.png


Full Window and No Spacing Image Module Styles

Some Builder 4.0 child themes now supports new Full Window and No Spacing Image Module Styles.

  • Full Window Image Module Style - adds a full-width image to the Layout
  • No Spacing Image Module Style - inserts an image without padding


Generic CSS Class

.builder-module-image

See also



← Back to Builder Codex Home

Personal tools
Namespaces
Variants
Actions
iThemes Codex
Codex Navigation
Toolbox