Drupal theme files details as follows:
.info — A required file which provides information about the theme,style,script,block region on the page, version etc
html.tpl.php—It displays the basic html structure of a single Drupal page
page.tpl.php — The main template that defines the content rendering block region html in the pages.
style.css — The CSS file that sets the CSS rules for the template.
node.tpl.php — This file defines the content style of the nodes.
block.tpl.php — It defines the content style in the blocks.
comment.tpl.php — It defines the content style in the comments.
region.tpl.php — It defines the block region.
maintenance-page.tpl.php — It defines the error information.
template.php—It can be used to hold preprocessors for generating variables before they are merged with the markup inside .tpl.php files.
theme-settings.php—You can modify the entire theme settings form.
logo.png — Your logo, if you are using one.
screenshot.png — This is a screenshot of your theme that is used in the admin panel and in the user account settings if you have enabled more than one theme so that visitors can choose which theme they want to use.
create a theme folder globepharma in the location:sites/all/themes/
create a file globepharma.info in the location:sites/all/themes/globepharma/ and add the following code:
name = globepharma
description = Framework is a blank canvas for theme developers. Use Framework as a starting point to facilitate your theme development.
package = Custom Theme
core = 7.x
engine = phptemplate
stylesheets[all][] = css/style-pharma.css
stylesheets[all][] = css/superfish.css
stylesheets[all][] = css/ie6.css
scripts[] = js/cufon-yui.js
scripts[] = js/droid-sans.cufonfonts.js
scripts[] = js/jquery.carouFredSel-5.5.0-packed.js
scripts[] = js/ie6PngFix.js
scripts[]= jquery.ui.accordion.js
scripts[]= jquery.ui.mouse.js
scripts[]= jquery.ui.resizable.js
scripts[]= jquery.ui.widget.js
regions[topmenu] = Top Menu
regions[wecare] = We Care
regions[main_menu] = Main Menu
regions[header_banner] = Header Banner
regions[sidebar_first] = First Sidebar
regions[sidebar_second] = Second Sidebar
regions[content] = Content
regions[product] = Product
regions[feature_product] = Feature Product
regions[gmap]= Map
regions[footer_right]= Footer
; Information added by drupal.org packaging script on 2011-08-28
version = "7.x-3.5"
core = "7.x"
project = "globepharma"
datestamp = "1314564416"
create a file html.tpl.php in the location:sites/all/themes/globepharma/ and add the following code:
< !DOCTYPE html>
< html lang="< ?php print $language->language; ?>" dir="< ?php print $language->dir; ?>">
< head>
< ?php print $head; ?>
< title> < ?php print $head_title; ?>< /title>
< ?php print $styles; ?>
< ?php print $scripts; ?>
< !--[if lt IE 9]>
< script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"> < /script>
< ![endif]-->
< /head>
< body class="< ?php print $classes; ?>" < ?php print $attributes;?>>
< ?php print $page_top; ?>
< ?php print $page; ?>
< ?php print $page_bottom; ?>
< /body>
< /html>
create a file page.tpl.php in the location:sites/all/themes/globepharma/ and add the following code:
< !DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
< html xmlns="http://www.w3.org/1999/xhtml">
< head>
< meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
< script type="text/javascript">
// initialise plugins
jQuery(function(){
jQuery('ul.sf-menu').superfish();
});
< /script>
< script type="text/javascript">
jQuery(function() {
jQuery( "#accordion" ).accordion({
fillSpace: true
});
});
jQuery(function() {
jQuery( "#accordionResizer" ).resizable({
minHeight: 140,
resize: function() {
jQuery( "#accordion" ).accordion( "resize" );
}
});
});
< /script>
< script type="text/javascript">
Cufon.replace('contentTitle.h1, #block-views-latest-news-block h2, #block-menu-menu-find-products h2,#block-views-feature-product-block h2, .welcomeBlock h1, #featureBlock h1, ', { fontFamily: 'Droid Sans', hover: true });
Cufon.replace('', { fontFamily: 'Droid Sans', hover: true });
< /script>
< script type="text/javascript">
DD_belatedPNG.fix('#worldMap img');
< /script>
< /head>
< body>
< div id="header">
< div id="Blocklogo">
< a href="< ?php print $base_path;?>">
< img src="< ?php print $logo;?>" alt="< ?php print t('home');?>" />
< /a>
< /div>
< div id="topRightMenu">
< ?php print render($page['topmenu']);?>
< /div>
< div class="wecare">
< ?php print render($page['wecare']);?>
< /div>
< div class="clr"> < /div>
< /div>
< div id="navigation">
< div id="navHolder">
< ?php print render($page['main_menu']);?>
< /div>
< /div>
< div id="mainContainer">
< div id="banner_wrapper">
< div id="banner_reflect">
< div id="bannerSlider">
< ?php print render($page['header_banner']);?>
< /div>
< div class="clr"> < /div>
< /div>
< /div>
< div class="clr"> < /div>
< div id="containerHolder">
< div id="latestNews" >
< ?php print render($page['sidebar_first']);?>
< /div>
< div class="welcomeBlock welcomeBlockFactory">
< div>
< ?php if($page['product']):?>
< ?php print render($page['product']); ?>
< ?php endif; ?>
< /div>
< /div>
< div class="findAll">
< ?php print render($page['sidebar_second']);?>
< /div>
< /div>
< div class="clr"> < /div>
< div class="homecontent">
< div class="blockDiv">
< div class="messageBox">
< section id="main" role="main" class="clearfix">
< ?php print $messages; ?>
< a id="main-content"> < /a>
< ?php print render($title_prefix); ?>
< ?php if ($title): ?>
< h1>
< ?php print $title; ?>
< /h1>
< ?php endif; ?>
< ?php print render($title_suffix); ?>
< ?php if (!empty($tabs['#primary'])): ?>
< ?php print render($page['help']); ?>
< ?php if ($action_links): ?>
< ul class="action-links">
< ?php print render($action_links); ?>
< /ul>
< ?php endif; ?>
< ?php print render($page['content']); ?>
< /section>
< /div>
< /div>
< /div>
< /div>
< div style="background: #34322f; padding: 5px 0 18px 0; border-top: 3px solid #100f0c;">
< div style="margin:auto; width: 903px; position: relative;">
< ?php print render($page['gmap']);?>
< div id="footerDiv">
< ?php print render($page['footer_right']);?>
< /div>
< div class="clr"> < /div>
< /div>
< /div>
< div id="mainContainerBtm"> < /div>
< /div>
< /body>
< /html>
create a file block.tpl.php in the location:sites/all/themes/globepharma/ and add the following code:
< section id="< ?php print $block_html_id; ?>" class="< ?php print $classes; ?>"< ?php print $attributes; ?>>
< ?php print render($title_prefix); ?>
< ?php if (!empty($block->subject)): ?>
< h2 < ?php print $title_attributes; ?>>
< ?php print $block->subject ?>
< /h2>
< ?php endif;?>
< ?php print render($title_suffix); ?>
< div class="content">
< ?php print $content ?>
< /div>
< /section>
create a file node.tpl.php in the location:sites/all/themes/globepharma/ and add the following code:
< ?php if (!$page): ?>
< article id="node-< ?php print $node->nid; ?>" class="< ?php print $classes; ?> clearfix"< ?php print $attributes; ?>>
< ?php endif; ?>
< ?php if ($user_picture || $display_submitted || !$page): ?>
< ?php if (!$page): ?>
< ?php endif; ?>
< ?php print $user_picture; ?>
< ?php print render($title_prefix); ?>
< ?php if (!$page): ?>
< h2< ?php print $title_attributes; ?>>
< a href="< ?php print $node_url; ?>"> < ?php print $title; ?>< /a>
< /h2>
< ?php endif; ?>
< ?php print render($title_suffix); ?>
< ?php if ($display_submitted): ?>
< ?php print $submitted; ?>< ?php endif; ?>
< ?php if (!$page): ?>
< /header>
< ?php endif; ?>
< ?php endif; ?>
< div class="content"< ?php print $content_attributes; ?>>
< ?php
// Hide comments, tags, and links now so that we can render them later.
hide($content['comments']);
hide($content['links']);
hide($content['field_tags']);
print render($content);
?>
< /div>
< ?php if (!empty($content['field_tags']) || !empty($content['links'])): ?>
< footer>
< ?php print render($content['field_tags']); ?>
< ?php print render($content['links']); ?>
< /footer>
< ?php endif; ?>
< ?php print render($content['comments']); ?>
< ?php if (!$page): ?>
< /article>
< ?php endif; ?>
create a file comment.tpl.php in the location:sites/all/themes/globepharma/ and add the following code:
< article class="< ?php print $classes . ' ' . $zebra; ?>"< ?php print $attributes; ?>>
< header>
< ?php print $picture ?>
< ?php print render($title_prefix); ?>
< h3< ?php print $title_attributes; ?>>
< ?php print $title ?>
< /h3>
< ?php print render($title_suffix); ?>
< ?php print $author; ?> - < ?php print $created; ?>< ?php if ($new): ?>
< span class="new">< ?php print $new ?>< /span>
< ?php endif; ?>
< /header>
< div class="content"< ?php print $content_attributes; ?>>
< ?php hide($content['links']); print render($content); ?>
< ?php if ($signature): ?>
< div class="user-signature clearfix">
< ?php print $signature ?>
< /div>
< ?php endif; ?>
< /div>
< ?php if (!empty($content['links'])): ?>
< footer>
< ?php print render($content['links']) ?>
< /footer>
< ?php endif; ?>
< /article>
create a file template.php in the location:sites/all/themes/globepharma/ and add the following code:
< ?php
/**
* Implements hook_html_head_alter().
* We are overwriting the default meta character type tag with HTML5 version.
*/
function framework_html_head_alter(&$head_elements) {
$head_elements['system_meta_content_type']['#attributes'] = array(
'charset' => 'utf-8'
);
}
/**
* Return a themed breadcrumb trail.
*
* @param $breadcrumb
* An array containing the breadcrumb links.
* @return a string containing the breadcrumb output.
*/
function framework_breadcrumb($variables) {
$breadcrumb = $variables['breadcrumb'];
if (!empty($breadcrumb)) {
// Provide a navigational heading to give context for breadcrumb links to
// screen-reader users. Make the heading invisible with .element-invisible.
$output = '< h2 class="element-invisible"> ' . t('You are here') . '< /h2> ';
// Uncomment to add current page to breadcrumb
// $breadcrumb[] = drupal_get_title();
$output .= '' . implode(' » ', $breadcrumb) . ' ';
return $output;
}
}
/**
* Override or insert variables into the page template.
*/
function framework_preprocess_page(&$vars) {
if (isset($vars['main_menu'])) {
$vars['main_menu'] = theme('links__system_main_menu', array(
'links' => $vars['main_menu'],
'attributes' => array(
'class' => array('links', 'main-menu', 'clearfix'),
),
'heading' => array(
'text' => t('Main menu'),
'level' => 'h2',
'class' => array('element-invisible'),
)
));
}
else {
$vars['main_menu'] = FALSE;
}
if (isset($vars['secondary_menu'])) {
$vars['secondary_menu'] = theme('links__system_secondary_menu', array(
'links' => $vars['secondary_menu'],
'attributes' => array(
'class' => array('links', 'secondary-menu', 'clearfix'),
),
'heading' => array(
'text' => t('Secondary menu'),
'level' => 'h2',
'class' => array('element-invisible'),
)
));
}
else {
$vars['secondary_menu'] = FALSE;
}
}
/**
* Duplicate of theme_menu_local_tasks() but adds clearfix to tabs.
*/
function framework_menu_local_tasks(&$variables) {
$output = '';
if (!empty($variables['primary'])) {
$variables['primary']['#prefix'] = '< h2 class="element-invisible"> ' . t('Primary tabs') . '< /h2> ';
$variables['primary']['#prefix'] .= '< ul class="tabs primary clearfix"> ';
$variables['primary']['#suffix'] = '< /ul> ';
$output .= drupal_render($variables['primary']);
}
if (!empty($variables['secondary'])) {
$variables['secondary']['#prefix'] = '< h2 class="element-invisible"> ' . t('Secondary tabs') . '< /h2> ';
$variables['secondary']['#prefix'] .= '< ul class="tabs secondary clearfix"> ';
$variables['secondary']['#suffix'] = '< /ul> ';
$output .= drupal_render($variables['secondary']);
}
return $output;
}
/**
* Override or insert variables into the node template.
*/
function framework_preprocess_node(&$variables) {
$variables['submitted'] = t('Published by !username on !datetime', array('!username' => $variables['name'], '!datetime' => $variables['date']));
if ($variables['view_mode'] == 'full' && node_is_page($variables['node'])) {
$variables['classes_array'][] = 'node-full';
}
}
/**
* Changes the search form to use the "search" input element of HTML5.
*/
function framework_preprocess_search_block_form(&$vars) {
$vars['search_form'] = str_replace('type="text"', 'type="search"', $vars['search_form']);
}
create a file region.tpl.php in the location:sites/all/themes/globepharma/ and add the following code:
< ?php if (!empty($content)): ?>
< div class="< ?php print $classes; ?>">
< ?php print $content; ?>
< /div>
< ?php endif; ?>
create a file maintenance-page.tpl.php in the location:sites/all/themes/globepharma/ and add the following code:
< !DOCTYPE html>
< html lang="< ?php print $language->language; ?>" dir="< ?php print $language->dir; ?>">
< head>
< ?php print $head; ?>
< title> < /title>
< ?php print $styles; ?>
< ?php print $scripts; ?>
< !--[if lt IE 9]>
< script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"> < /script>
< ![endif]-->
< /head>
< body class="< ?php print $classes; ?>" < ?php print $attributes;?>>
< div id="wrapper" class="clearfix">
< div id="skip-link">
< a href="#main-content" class="element-invisible element-focusable"> < ?php print t('Skip to main content'); ?>< /a>
< /div>
< header id="header" role="banner" class="clearfix">
< ?php if ($logo): ?>
< a href="< ?php print $front_page; ?>" title="< ?php print t('Home'); ?>" id="logo">
< img src="< ?php print $logo; ?>" alt="< ?php print t('Home'); ?>" />
< /a>
< ?php endif; ?>
< ?php if ($site_name || $site_slogan): ?>
< div id="site-name-slogan">
< ?php if ($site_name): ?>
< ?php if ($title): ?>
< div id="site-name"> < strong>
< a href="< ?php print $front_page; ?>" title="< ?php print t('Home'); ?>">< ?php print $site_name; ?>< /a>
< /strong> < /div>
< ?php else: /* Use h1 when the content title is empty */ ?>
< h1 id="site-name">
< a href="< ?php print $front_page; ?>" title="< ?php print t('Home'); ?>"> < ?php print $site_name; ?>< /a>
< /h1>
< ?php endif; ?>
< ?php endif; ?>
< ?php if ($site_slogan): ?>
< div id="site-slogan">< ?php print $site_slogan; ?>< /div>
< ?php endif; ?>
< /div>
< ?php endif; ?>
< ?php print render($page['header']); ?>
< /header>
< section id="main" role="main" class="clearfix">
< ?php print $messages; ?>
< a id="main-content"> < /a>
< ?php if ($title): ?>< h1 class="title" id="page-title"> < ?php print $title; ?>< /h1> < ?php endif; ?>
< ?php print $content; ?>
< /section>
< /div>
< /body>
< /html>
add a file logo.png in the location:sites/all/themes/globepharma/
add a file screenshot.png in the location:sites/all/themes/globepharma/
create a file style.css in the location:sites/all/themes/globepharma/ and add the following code
/* Drupal 7 Framework - Created by André Griffin
@import "reset.css";
/**
* 1.GLOBAL
*/
body {
background: #fff;
color: #222;
font-family: Lucida Grande, Verdana, Arial, sans-serif;
font-size: 0.8125em;
line-height: 1.5385;
margin: 0;
padding: 0;
}
h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
font-family: Arial, Helvetica, sans-serif;
font-style: normal;
font-weight: normal;
}
h1, .h1 {
font-size: 2em;
line-height: 1.5385;
margin-top: 0.7692em;
}
h2, .h2 {
font-size: 1.5385em;
line-height: 2;
margin-top: 1em;
}
h3, .h3 {
font-size: 1.2308em;
line-height: 1.25;
margin-top: 1.25em;
}
h4, h5, h6, .h4, .h5, .h6 {
font-size: 1em;
font-weight: bold;
line-height: 1.5385;
margin-top: 1.5385em;
}
p {
font-size: 1em;
line-height: 1.5385;
margin: 0 0 1.5385em 0;
}
p a:link {
text-decoration: underline;
}
a:link, a:visited {
color: #069;
outline: none;
text-decoration: none;
}
a:focus {
outline: 1px dotted;
}
a:hover, a:active, li a.active {
color: #069;
outline: none;
text-decoration: underline;
}
img {
display: block;
}
/* apply common styling after reset.css */
li ul, li ol { margin: 0; }
ul, ol { margin: 0 1.5385em 1.5385em 0; padding-left: 1.5385em; }
ul { list-style-type: disc; }
ol { list-style-type: decimal; }
dl { margin: 0 0 1.5385em 0; }
dl dt { font-weight: bold; }
dd { margin-left: 1.5385em; }
hr { background: #666; border: none; clear: both; float: none; height: 1px; margin: 0 0 1.4615em; width: 100%; }
fieldset { border: 1px solid #ccc; margin: 0 0 1.4615em; padding: 1.5385em; }
table { margin-bottom: 1.5385em; width: 100%; }
th, tr, td { vertical-align: middle; }
.sticky-header th, .sticky-table th { border-bottom: 3px solid #ccc; padding-right: 1em; text-align: left; }
/**
* 2.LAYOUT
*/
#wrapper {
margin: 0 auto;
padding: 0 10px;
width: 940px;
}
/* add this class to div#wrapper in page.tpl to show grid */
.showgrid {
background: url(images/grid.png) repeat-y;
}
/**
* 3.MAIN
*/
/* 1 column: global values*/
#main {
display: inline;
margin: 0;
}
/* 3 columns */
body.two-sidebars #main {
float: left;
margin: 0 0 0 240px;
padding: 0;
width: 460px;
}
/* 2 columns: sidebar-first */
body.sidebar-first #main {
float: right;
margin: 0;
padding: 0;
width: 700px;
}
/* 2 columns: sidebar-second */
body.sidebar-second #main {
float: left;
margin: 0;
padding: 0;
width: 700px;
}
/**
* 4.SIDEBARS
*/
/* 3 columns: sidebar-first */
body.two-sidebars #sidebar-first {
float: left;
margin: 0 0 0 -700px;
padding: 0;
width: 220px;
}
/* 3 columns: sidebar-second */
body.two-sidebars #sidebar-second {
float: right;
margin: 0;
padding: 0;
width: 220px;
}
body.sidebar-first #sidebar-first {
float: left;
margin: 0;
padding: 0;
width: 220px;
}
body.sidebar-second #sidebar-second {
float: right;
margin: 0;
padding: 0;
width: 220px;
}
#header {
margin: 0;
padding: 3.0769em 0 0;
position: relative;
}
#header #site-name-slogan {
float: left;
margin: 0 0 1.5385em;
}
#header #site-slogan {
margin: 0;
}
#header #site-name {
font-family: Arial, Helvetica, sans-serif;
font-size: 2.7692em;
font-weight: 700;
line-height: 1.1111;
margin: 0;
}
#header #site-name a:hover {
text-decoration: none;
}
#header #logo {
float: left;
margin: 0 1em 1.5385em 0;
}
#navigation {
clear: both;
margin: 0 0 1.5385em;
padding: 0;
}
#navigation ul.main-menu {
margin: 0;
padding: 0;
}
#navigation ul.main-menu li {
float: left;
margin: 0;
padding: 0;
}
#navigation ul.main-menu li a {
display: block;
padding: 0 2em 0 0;
}
#navigation ul.secondary-menu {
margin: 0;
padding: 0;
}
#navigation ul.secondary-menu li {
float: left;
margin: 0;
padding: 0;
}
#navigation ul.secondary-menu li a {
display: block;
padding: 0 2em 0 0;
}
.breadcrumb {
padding-bottom: 0;
}
#skip-link {
position: absolute;
}
.item-list ul {
margin: 0;
padding: 0 0 0 1.5385em;
}
.item-list ul li {
margin: 0;
padding: 0;
}
ul.menu li {
margin: 0;
padding: 0;
}
ul.inline {
clear: both;
}
ul.inline li {
margin: 0;
padding: 0 1em 0 0;
}
.tabs-wrapper {
border-bottom: 1px solid #333;
margin: 0 0 1.4615em;
}
ul.primary {
border: none;
margin: 0;
padding: 0;
}
ul.primary li a {
background: none;
border: none;
display: block;
float: left;
line-height: 1.5385em;
margin: 0;
padding: 0 1em;
}
ul.primary li a:hover, ul.primary li a.active {
background: #666;
border: none;
color: #fff;
}
ul.primary li a:hover {
background: #888;
text-decoration: none;
}
ul.secondary {
background: #666;
border-bottom: none;
clear: both;
margin: 0;
padding: 0;
}
ul.secondary li {
border-right: none;
}
ul.secondary li a, ul.secondary li a:link {
border: none;
color: #ccc;
display: block;
float: left;
line-height: 1.5385em;
padding: 0 1em;
}
ul.secondary li a:hover, ul.secondary li a.active {
background: #888;
color: #fff;
text-decoration: none;
}
ul.secondary a.active {
border-bottom: none;
}
.node {
margin-bottom: 1.5385em;
}
.field-name-field-tags {
margin: 0 0 1.5385em;
}
.field-name-field-tags .field-item {
margin: 0 1em 0 0;
}
.field-name-field-tags div {
display: inline;
}
.profile {
margin: 1.5385em 0;
}
.profile dd {
margin-bottom: 1.5385em;
}
.profile h3 {
border: none;
}
.profile dt {
margin-bottom: 0;
}
.password-parent {
width: 36em;
}
#comments {
clear: both;
margin-top: 1.5385em;
}
.comment {
margin-bottom: 1.5385em;
}
.comment .new {
color: red;
text-transform: capitalize;
margin-left: 1em;
}
.block {
margin-bottom: 1.5385em;
}
#footer {
clear: both;
padding: 1.5385em 0;
position: relative;
}
#footer a.feed-icon {
position: absolute;
right: 0;
top: 1.6667em;
}
add a favicon.ico in the location:sites/all/themes/globepharma/
create a folder css in the location:sites/all/themes/globepharma/ and add assential file within
create a folder js in the location:sites/all/themes/globepharma/ and add assential file within
create a folder images in the location:sites/all/themes/globepharma/ and add assential file within
