29
1 The Scary Render Array donderdag 23 juni 2011
1
The Scary Render Array
donderdag 23 juni 2011
2
‣ What is the problem?
‣ The Render Array
‣ Case: Change the User Profile page
Outline
donderdag 23 juni 2011
Sutharsan @sutharsanSkilip @skilip
@wizzlernwww.wizzlern.nl
3
donderdag 23 juni 2011
4
What’s the problem?
donderdag 23 juni 2011
What’s the problem?
5
donderdag 23 juni 2011
The abstract problem
‣ HTML is generated by modules
‣ Theme layer receives fully build HTML
6
donderdag 23 juni 2011
The abstract problem
7
‣ Young Hahn (http://bitly.com/cIYWkt)Limitations of the Drupal Theme Layer:
‣ Move something out of its ‘vertical stack’
‣ Change the formatting of an element
donderdag 23 juni 2011
The abstract problem
‣ Parents knows little of their children
‣ Children know little of their parent (context)
‣ Siblings don’t know each other.
8
donderdag 23 juni 2011
How does Drupal 7 solve your problem?
9
donderdag 23 juni 2011
Render Array
10
donderdag 23 juni 2011
11 http://www.funnyanimalpictures.netdonderdag 23 juni 2011
The Render Array
12
donderdag 23 juni 2011
Render example
‣ Renderable element $user_profile from user-profile.tpl.php
‣ 2 elements: ‘user_picture’ and ‘summary’.
‣ #markup = HTML
13
Array ( [user_picture] => Array ( [#markup] => '<div class="user-picture"> ... </div>' [#weight] => -10 ) [summary] => Array ( ... ))
donderdag 23 juni 2011
Render example
‣ #type = Set of default properties. Defined in hook_element_info()
‣ #attributes, #weight, #title, #access: See FAPI
‣ Without ‘#’ = Children. Will be rendered too.
14
Array ( ... [summary] => Array ( [#type] => user_profile_category [#attributes] => Array ( ... ) [#weight] => 5 [#title] => History [member_for] => Array ( ... ) [#access] => 1 ))
donderdag 23 juni 2011
Render example
‣ Children rendered by drupal_render() recursively.
15
Array ( ... [summary] => Array ( ... [member_for] => Array ( [#type] => user_profile_item [#title] => Member for [#markup] => 2 weeks 5 days ) ))
donderdag 23 juni 2011
Advantages of Render Array
‣ Everything is possible in the theme layer
‣ Change theme function of a single item.
‣ Change field wrapper.
‣ Move (parts of) content to other region.
‣ Duplicate existing content.
‣ etc.
16
donderdag 23 juni 2011
More Drupal 7 goodies
‣ All theme functions have a preprocess.e.g. THEME_preprocess_item_list(&$variables)
‣ Template functions:render(&$element)show(&$element)hide(&$element)
‣ Crazy form/render array properties:#attached, #maxlength, #state, #theme_wrappers,
#title_display
17
donderdag 23 juni 2011
But still a bit scary ...
18
donderdag 23 juni 2011
The Render Process
19
donderdag 23 juni 2011
Drupal 7 Theme process
20
1. Bootstrap
2. Handle URL
3. Get page content
4. Return HTML?
5. Last call for changes
6. Render output
donderdag 23 juni 2011
Render process
21
‣ Traversing down from the page to the 'leaves'.
hook_page_build() // Last call to modules to ADD items to the page array.hook_page_alter() // For both modules and themes to alter the page array.THEME_preprocess_page() // $variables['page'] holds page render array + childrenTHEME_process_page() // Every ‘preprocess’ is followed by a ‘process’ function.page.tpl.phpTHEME_preprocess_node() // $variables['content'] holds node render array + childrennode.tpl.php// Next: comment-wrapper, comment, etc.
donderdag 23 juni 2011
Practice
22
donderdag 23 juni 2011
Practice
23
donderdag 23 juni 2011
(Pre)process functions
24
‣ template_preprocess
‣ $variables
‣ Attributes (#weight, #access, #attached)
donderdag 23 juni 2011
hook_form_FORMID_alter
25
‣ #states attribute
‣ Vertical tabs
‣ element_children(), render(), hide()
‣ #theme attribute
donderdag 23 juni 2011
Summary
26
donderdag 23 juni 2011
Summary
27
‣ Problems: Vertical stack, Content awareness
‣ Solutions:
‣ Render Array, hook_page_alter()
‣ render(), show(), hide(), form #properties
donderdag 23 juni 2011
28
Maby it was all just a bad dreamMaby it was all just a bad dream
donderdag 23 juni 2011
www.wizzlern.nl
This work is licensed under aCreative Commons Attribution 3.0 Unported License.
donderdag 23 juni 2011
