Theming בדרופל הוא תמיד תענוג, כל עוד אנחנו זוכרים שלא להכניס Business Intelligence לתוך התמה. באמצעות שימוש נבון ב-template..php ובפונקציות ה-preprocess שלו, אנחנו יכולים לשנות דברים עיצוביים בדרופל בקלות.
אחד מהדברים שקל לעשות עם פונקצית preprocess היא להוסיף קבצי CSS וקבצי JavaScript. זה שימושי במיוחד אם מדובר בחלקים ב-CSS שרלוונטיים לעמוד מסוים/קבוצת עמודים שאנו לא מעוניינים להכניס אותם ל-CSS הכללי. אנו רוצים שיתווספו רק כאשר יש תנאים מסוימים. למשל עם ה-URL של העמוד הוא בכתובת מסוימת או ב-content type מוסים.
דרופל 6
בדרופל 6, אנו נחפש דווקא את preprocess_page, נפתח את template.php ונחפש את פונקציות YOURTHEME_preprocess_page:
/**
* Override or insert variables into the page templates.
*
* @param $vars
* An array of variables to pass to the theme template.
* @param $hook
* The name of the template being rendered ("page" in this case.)
*/
function MYTHEME_preprocess_page(&$vars, $hook) {
}
כאשר ה-MYTHEME זה שם התמה שלכם כמובן.
הפונקציה הזו רצה קצת לפני שהדף עצמו מרונדר ומודפס, כל המשתנים כבר אמורים להופיע והיא שימושית במיוחד לכל מני הוספות ותוספות – גם לתוספות CSS ו-JavaScript.
הנה הקוד המלא שמאפשר הוספת CSS ו-JS לכל דף שנרצה. במקרה הזה מדובר בהוספת קוד CSS ו-JavaScript לדפים שה-content type שלהם הוא מסוג Article.
/**
* Override or insert variables into the page templates.
*
* @param $vars
* An array of variables to pass to the theme template.
* @param $hook
* The name of the template being rendered ("page" in this case.)
*/
function launchpoker_preprocess_page(&$vars, $hook) {
if($vars['node']->type == 'Article') {
$my_script = path_to_theme().'/js/custom.js';
drupal_add_js($my_script, 'theme');
$vars['scripts'] = drupal_get_js();
$css = path_to_theme().'/css/custom.css';
$vars['styles'].=drupal_get_css(array('all' => $css));
}
}
דרופל 7
בדרופל 7 אנו נשתמש ב-preprocess שלא קיים בדרופל 6 ושמו הוא preprocess_html. הקוד הזה רץ לפני שה-HTML נטען ובו אנו יכולים להוסיף CSS ו-JavaScript באופן יותר אלגנטי:
* Override or insert variables into the template.
*
* @param $vars
* An array of variables to pass to the theme template.
*/
function bartik_preprocess_html(&$vars) {
if($vars['page']['content']['system_main']['nodes'][arg(1)]['#node']->type == 'article') {
$my_css = path_to_theme().'/css/inline_tab.css';
drupal_add_css($my_css, array('group' => CSS_THEME, 'preprocess' => FALSE));
$my_script = path_to_theme().'/js/custom.js';
drupal_add_js($my_script, array('group' => JS_THEME, 'preprocess' => FALSE));
}
}
אפשר לראות שהתחביר בדרופל 7 קצת שונה מזה של 6. אחד השינויים החשובים הוא שהמערך של ה-vars יותר מורכב (בין היתר בגלל ה-hook שאנו משתמשים בו) וכן תחביר ה-drupal_add_css ו-drupal_add_js שונה במקצת. השינוי הגדול ביותר הוא שאנו לא נאלצים בדרופל 7 לרנדר מחדש את משתנה ה-style ומשתנה ה-scripts.