Builder Footer Module

(Difference between revisions)
Jump to: navigation, search
Line 1: Line 1:
The '''HTML Module''' adds a place for post or page content to render. It also supports the use of shortcodes and execution of PHP code.
+
The '''Footer Module''' adds a place for the site Footer to render. Most Layouts will have this Module at the bottom of the Layout, although a Layout does not require a Footer (even if a Layout does not have a Footer Module, the function calls that some plugins and features require that footers are responsible for will be handled automatically by Builder).
  
 
<br />
 
<br />
  
==Adding an HTML Module==
+
==Adding a Footer Module==
  
To add an HTML Module to your Layout, click '''Add Module''' and select the HTML Module from the list of available Modules.
+
To add an Footer Module to your Layout, click '''Add Module''' and select the Footer Module from the list of available Modules.
  
 
<br />
 
<br />
  
[[File:add-html-module.png|800px|link=]]
+
[[File:add-footer-module.png|800px|link=]]
  
 
<br />
 
<br />
  
==HTML Module Settings==
+
==Footer Module Settings==
  
Once the HTML Module has been selected and added to the Layout, the '''Modify HTML Module Settings''' box will appear. Customize the settings of the HTML Module by selecting from the following options.
+
Once the Footer Module has been selected and added to the Layout, the '''Modify Footer Module Settings''' box will appear. Customize the settings of the Footer Module by selecting from the following options.
  
 
<br />
 
<br />
  
[[File:Content-module-settings.png|800px|link=]]
+
[[File:footer-module-settings.png|800px|link=]]
  
 
<br />
 
<br />
  
'''Available Content Module settings include:'''
+
'''Available Footer Module settings include:'''
  
 
*'''Name''' - For widget identification purposes
 
*'''Name''' - For widget identification purposes
*'''HTML''' - Add your static HTML, shortcode or PHP code
 
 
*'''Sidebars''' - Widget areas to the left, right or on both sides of the HTML Module
 
*'''Sidebars''' - Widget areas to the left, right or on both sides of the HTML Module
 
*'''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.  
*'''Enable PHP''' - "No" or "Yes" – Enabling this option allows for processing of PHP code inside the module. Always review PHP code if taken from a third party, as it could pose a serious security threat.
 
*'''Remove Wrapper Div''' - "No" or "Yes" – Enabling this option is only recommended for advanced users as this can cause layout issues if not properly handled. When Builder renders Modules, it wraps the output in a series of divs to keep the Layout structure properly intact and to allow the styling to be properly applied. The HTML 0odule is unique in allowing the output to be removed from these containing div wrappers. If the "Remove Wrapper Div" option is enabled, the output entered in the HTML input will be output without the wrappers, allowing you to create complex output that breaks out of the Layout structure. It is for this reason that it should only be used by advanced users.
 
  
 
<br />
 
<br />
  
Click the '''Save''' button to save the HTML Module Settings. You'll now see the HTML Module added to your Layout, denoting the configuration of sidebars (if applicable).
+
Click the '''Save''' button to save the Footer Module Settings. You'll now see the Footer Module added to your Layout, denoting the configuration of sidebars (if applicable).
  
 
<br />
 
<br />
  
[[File:HTML-Module-in-layout.png|800px|link=]]
+
[[File:footer-module-added.png|800px|link=]]
  
==Advanced Note==
+
==Generic CSS Class==
 +
 
 +
<code>.builder-module-footer</code>
 +
 
 +
==Advanced Note: Editing the Footer Module==
 +
 
 +
=== Method 1 ===
 +
 
 +
Make a copy of ''footer.php'' from parent Builder directory, edit it and place in your child theme's (active theme) directory.
 +
 
 +
[http://ithemes.com/builder-tip-how-to-edit-footer/ Video and detailed instructions]
 +
 
 +
Examples of customized footer.php: [http://d.pr/MwxJ 1]
 +
 
 +
'''If you would like to have a footer.php that looks like the screenshot below as starting point to use as is or further customize''', download [http://cl.ly/0z1C1X32243A30462F1q this] zip file, extract it and upload footer.php to your child theme directory.
 +
 
 +
[[File:Custom-footer.png|800px|thumb|none|Screenshot showing customized footer - Click to enlarge]]
 +
 
 +
This is the code in footer.php just in case the download link does not work:
 +
 
 +
<pre class="brush:php;">
 +
<?php
 +
 
 +
 
 +
function render_footer() {
 +
?>
 +
<!-- Begin changes -->
 +
<div class="alignmiddle">
 +
<p><a href="<?php bloginfo('url'); ?>">Home</a> | <a href="<?php bloginfo('url'); ?>/privacy-policy/">Privacy Policy</a> | <a href="<?php bloginfo('url'); ?>/terms-conditions/">Terms &amp; Conditions</a></p>
 +
<p><?php echo date( 'Y' ); ?> - Copyright &copy; All Rights Reserved</p>
 +
</div>
 +
<!-- End changes -->
 +
 
 +
<?php wp_footer(); ?>
 +
<?php
 +
 
 +
}
 +
 
 +
 
 +
add_action( 'builder_layout_engine_render_footer', 'render_footer' );
 +
 
 +
 
 +
?>
 +
</pre>
 +
 
 +
In the above replace &amp; with '''& a m p ;''' without spaces and © with '''& c o p y ;''' without the spaces.
 +
 
 +
Add the following at the end of child theme's style.css:
 +
 
 +
<pre class="brush:css;">
 +
.alignmiddle {
 +
text-align: center;
 +
}
 +
</pre>
 +
 
 +
=== Method 2 ===
 +
 
 +
To remove the credit to iThemes Builder (but leave the standard copyright notice, powered by WordPress etc.) you could also include this function in your child theme's functions.php:
 +
 
 +
<pre class="brush:php;">
 +
add_filter( 'builder_footer_credit', 'custom_builder_footer_credit' );
 +
 
 +
function custom_builder_footer_credit( $footer_credit ) {
 +
    $footer_credit = 'Powered by <a href="http://wordpress.org">WordPress</a><br />Customized by <a href="http://me.com/">Myself!</a>';
 +
   
 +
    return $footer_credit;
 +
}
 +
</pre>
 +
 
 +
Ensure that line numbers are not present in the code in functions.php.
 +
 
 +
See http://www.screencast.com/t/R2hJBzCRk and http://www.screencast.com/t/ZajvGiQGo
 +
 
 +
Source: http://ithemes.com/forum/index.php?/topic/12687-edit-footer/#p59955
  
The HTML Module isn't limited to just static HTML content. You can also use shortcodes and PHP code to add generated content. PHP support must first be activated with the Enable PHP option below.
 
  
Using shortcodes is preferred over PHP code as allowing PHP code has security risks.
 
  
==Generic CSS Class==
 
  
<code>.builder-module-html</code>
 
  
 
==See also==
 
==See also==

Revision as of 12:49, July 24, 2013

The Footer Module adds a place for the site Footer to render. Most Layouts will have this Module at the bottom of the Layout, although a Layout does not require a Footer (even if a Layout does not have a Footer Module, the function calls that some plugins and features require that footers are responsible for will be handled automatically by Builder).


Contents

Adding a Footer Module

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


Add-footer-module.png


Footer Module Settings

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


Footer-module-settings.png


Available Footer Module settings include:

  • Name - For widget identification purposes
  • Sidebars - Widget areas to the left, right or on both sides of the HTML Module
  • 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 Footer Module Settings. You'll now see the Footer Module added to your Layout, denoting the configuration of sidebars (if applicable).


Footer-module-added.png

Generic CSS Class

.builder-module-footer

Advanced Note: Editing the Footer Module

Method 1

Make a copy of footer.php from parent Builder directory, edit it and place in your child theme's (active theme) directory.

Video and detailed instructions

Examples of customized footer.php: 1

If you would like to have a footer.php that looks like the screenshot below as starting point to use as is or further customize, download this zip file, extract it and upload footer.php to your child theme directory.

Screenshot showing customized footer - Click to enlarge

This is the code in footer.php just in case the download link does not work:

<?php


function render_footer() {
?>
	<!-- Begin changes -->
	<div class="alignmiddle">
		<p><a href="<?php bloginfo('url'); ?>">Home</a> | <a href="<?php bloginfo('url'); ?>/privacy-policy/">Privacy Policy</a> | <a href="<?php bloginfo('url'); ?>/terms-conditions/">Terms & Conditions</a></p>
		<p><?php echo date( 'Y' ); ?> - Copyright © All Rights Reserved</p>
	</div>
	<!-- End changes -->

	<?php wp_footer(); ?>
<?php

}


add_action( 'builder_layout_engine_render_footer', 'render_footer' );


?>

In the above replace & with & a m p ; without spaces and © with & c o p y ; without the spaces.

Add the following at the end of child theme's style.css:

.alignmiddle {
	text-align: center;
}

Method 2

To remove the credit to iThemes Builder (but leave the standard copyright notice, powered by WordPress etc.) you could also include this function in your child theme's functions.php:

add_filter( 'builder_footer_credit', 'custom_builder_footer_credit' );

function custom_builder_footer_credit( $footer_credit ) {
    $footer_credit = 'Powered by <a href="http://wordpress.org">WordPress</a><br />Customized by <a href="http://me.com/">Myself!</a>';
    
    return $footer_credit;
}

Ensure that line numbers are not present in the code in functions.php.

See http://www.screencast.com/t/R2hJBzCRk and http://www.screencast.com/t/ZajvGiQGo

Source: http://ithemes.com/forum/index.php?/topic/12687-edit-footer/#p59955



See also



← Back to Builder Codex Home

Personal tools
Namespaces
Variants
Actions
iThemes Codex
Codex Navigation
Toolbox