Drupal theme Program SCRATCH

Creating a Theme From Scratch in Drupal Theming 101 Drupal Theme Structure Modules, Themes, and Core Why to theme… • Themes allow you to change the interface of your system without affecting the business logic or code that is providing the system functionality Think of PAC and MVC design, the theme is the view or presentation layer of a web application Step – Create a Design • Create a working design in HTML and CSS Step - Create a Theme Folder • Create a theme folder and place it in your drupal site’s theme folder – E.g default/themes/example_theme Step 3a – Create a info file • Create a a info file for your theme and save it into the theme folder you created – E.g example_theme.info Step 3b – Fill in info required information • Add the following information to the info file: Step • Create a page.tpl.php file & dump your html code into the page and save it into the theme folder you created Step • Create a style.css file and place all of your CSS code into that file and save it into the theme folder you created Step • Remove all of your CSS code from the page.tpl.php file and remove all the information / text between the …. tags Step • Place this code between the tags, this will print out all of your styles, java script, page titles, etc… Step • At this point, you will need to place the following code, where your main content display area is in your design This will print out page content and local menus that appear as tabs Step 10 • In your theme, you should have an area for primary and secondary links defined Replace the HTML code that you are using for these with this: Step 11a • You will need to define “Regions” that will display “Blocks” of content By default you have the following regions: • regions[left] = Left sidebar regions[right] = Right sidebar regions[content] = Content regions[header] = Header regions[footer] = Footer 11b – Add regions to info 11c – Print the content of the region in you page.tpl.php file, locate it where you want the content to be placed Congratulations! You just made a theme! template.php • Functions included in this file can be called in your theme To override a function in Drupal such as the theme(…) function, you can copy the code for the theme function from http://api.drupal.org and then paste it into your template.php file You will need to append the name of your theme to the function and then modify it’s code to suit your purposes node.tpl.php • Default node theme node-story.tpl.php • Custom template theme for a specific content type block.tpl.php • You can create custom themes for each block page-front.tpl.php • Custom Front Page Overrides ... your drupal site’s theme folder – E.g default/themes/example _theme Step 3a – Create a info file • Create a a info file for your theme and save it into the theme folder you created – E.g example _theme. info.. .Drupal Theme Structure Modules, Themes, and Core Why to theme • Themes allow you to change the interface of your system without... made a theme! template.php • Functions included in this file can be called in your theme To override a function in Drupal such as the theme( …) function, you can copy the code for the theme function