View source for Hooks/Action Reference/builder module render

==Description==
This [[Action Reference|action]] hook is run by the [[Hooks/Action Reference/builder_layout_engine_render_modules|builder_layout_engine_render_modules]] action and calls the module-specific rendering action, [[Hooks/Action Reference/builder_module_render_MODULE|builder_module_render_MODULE]], based upon the [[Fields Variable|<nowiki>$fields['module']</nowiki>]] value which contains the current [[Module Variables|module variable]].

==Possible Uses==
This action is useful if every module on the site is to be modified in the same way. Using this action to add elements before and after each module will be its most common use. It could also be used to override the default action of calling the module-specific rendering process, thus allowing custom modules to be used in specific situations.

== Default Attached Functions ==
* [[Priority]] 10 - Runs [[Hooks/Action Reference/builder_module_render_MODULE|builder_module_render_MODULE]] using [[Fields Variable|<nowiki>$fields['module']</nowiki>]] in place of MODULE.

==Parameters==
{{Parameter|[[Fields Variable|$fields]]|array|Contains data necessary to render a module.}}

==Example Use==
This example is the same as the one given for [[Hooks/Action Reference/builder_module_render_MODULE|builder_module_render_MODULE]] with the exception of it now will apply the rounded corners to all modules rather than just the Image module.

This example shows how to implement the [http://www.search-this.com/2007/02/12/css-liquid-round-corners/ CSS Liquid Round Corners] technique on all modules. A zip file for an extension that includes the code, images, and styling needed to fully implement this concept is below, but first, here is how the action was used to implement this example:
<pre class="brush:php;">
add_action( 'builder_module_filter_widths', 'filter_module_widths' );
add_action( 'builder_module_render', 'open_module_border', 0 );
add_action( 'builder_module_render', 'close_module_border', 20 );

// Sorry about the z-index nastiness. It fixes an IE7 and IE8 bug.
global $z_index_count;
$z_index_count = 999;

function filter_module_widths( $fields ) { 
    $fields['widths']['container_width'] -= 50; 
    $fields['widths']['content_width'] -= 50; 
    
    return $fields;
}

function open_module_border( $fields ) { 
    global $z_index_count;
    
?>
    
        
        
<?php
    
    $z_index_count--;
}

function close_module_border( $fields ) { 
    
?>
        
        
    
<?php
    
}</pre>

[[File:module-rounded-corners.png|thumb|Example Screenshot]]

Note that the [[Hooks/Action Reference/builder_module_filter_widths|builder_module_filter_widths]] action is also used in order to shrink the module size down. This is to allow the styling to pad the module inside the rounded corners box.

The key to getting the opening and closing elements in the right place is by using the 0 and 20 inside the add_action function calls. For more details on how this works, read the [[priorities]] page.

Since this type of solution uses solid images, HTML structure, and CSS, it is cross-browser compatible and doesn't require JavaScript. However, it will not adapt to just any style. If a different background color or rounded corner box colors are wanted, the images will need to be recolored by hand in a image editor.

[http://codex.ithemesbuilder.com/module-rounded-corners.zip Download the example extension]

Other rounded corner solutions may better fit your project. This solution was used since it is popular and has the most flexibility since the size of the box is not limited in either dimension. The goal of this example is to show how Builder is flexible enough to allow for any type of solution while showing how such a solution can be implemented.

----
Back to [[Builder_Hooks|Builder Hooks]]