1
|
ZEN DATAPORTAL THEME
|
2
|
----------------------
|
3
|
|
4
|
This zen based dataportal theme offers simple but efficient settings to adapt
|
5
|
the dataportal layout quickly to project needs so the layout can now be done
|
6
|
by users and developers are no longer required for these styling tasks.
|
7
|
|
8
|
Moreover it is no longer necessary to create subthemes for each project.
|
9
|
|
10
|
When you also utilize the delta module it is even possible to copy layouts from
|
11
|
one portal to a new one.
|
12
|
|
13
|
*** IMPORTANT INSTALLATION NOTE ***
|
14
|
*
|
15
|
* The folder polyfills must be made available at the webservers root, so that
|
16
|
* the files contained in this folder can be accesed at e.g.:
|
17
|
*
|
18
|
* http://my.server.net/polyfills/box-sizing-polyfill/boxsizing.htc
|
19
|
*
|
20
|
* For installing the folder in Drupal we recommend creating a symlink
|
21
|
* in the root of you Drupal installation.
|
22
|
*
|
23
|
|
24
|
History
|
25
|
......................
|
26
|
|
27
|
- The original zen_dataportal theme was developed based on the zen theme 7.x-5.1
|
28
|
- In April 2015 it has been upgraded to be now based on zen theme 7.x-5.5
|
29
|
|
30
|
==================== original zen readme below ============================
|
31
|
|
32
|
BUILD A THEME WITH ZEN
|
33
|
----------------------
|
34
|
|
35
|
The base Zen theme is designed to be easily extended by its sub-themes. You
|
36
|
shouldn't modify any of the CSS or PHP files in the zen/ folder; but instead you
|
37
|
should create a sub-theme of zen which is located in a folder outside of the
|
38
|
root zen/ folder. The examples below assume zen and your sub-theme will be
|
39
|
installed in sites/all/themes/, but any valid theme directory is acceptable
|
40
|
(read the sites/default/default.settings.php for more info.)
|
41
|
|
42
|
Why? To learn why you shouldn't modify any of the files in the zen/ folder,
|
43
|
see https://drupal.org/node/245802
|
44
|
|
45
|
|
46
|
*** IMPORTANT NOTE ***
|
47
|
*
|
48
|
* In Drupal 7, the theme system caches which template files and which theme
|
49
|
* functions should be called. This means that if you add a new theme,
|
50
|
* preprocess or process function to your template.php file or add a new template
|
51
|
* (.tpl.php) file to your sub-theme, you will need to rebuild the "theme
|
52
|
* registry." See https://drupal.org/node/173880#theme-registry
|
53
|
*
|
54
|
* Drupal 7 also stores a cache of the data in .info files. If you modify any
|
55
|
* lines in your sub-theme's .info file, you MUST refresh Drupal 7's cache by
|
56
|
* simply visiting the Appearance page at admin/appearance.
|
57
|
*
|
58
|
|
59
|
|
60
|
1. Setup the location for your new sub-theme.
|
61
|
|
62
|
Copy the STARTERKIT folder out of the zen/ folder and rename it to be your
|
63
|
new sub-theme. IMPORTANT: The name of your sub-theme must start with an
|
64
|
alphabetic character and can only contain lowercase letters, numbers and
|
65
|
underscores.
|
66
|
|
67
|
For example, copy the sites/all/themes/zen/STARTERKIT folder and rename it
|
68
|
as sites/all/themes/foo.
|
69
|
|
70
|
Why? Each theme should reside in its own folder. To make it easier to
|
71
|
upgrade Zen, sub-themes should reside in a folder separate from the base
|
72
|
theme.
|
73
|
|
74
|
2. Setup the basic information for your sub-theme.
|
75
|
|
76
|
In your new sub-theme folder, rename the STARTERKIT.info.txt file to include
|
77
|
the name of your new sub-theme and remove the ".txt" extension. Then edit
|
78
|
the .info file by editing the name and description field.
|
79
|
|
80
|
For example, rename the foo/STARTERKIT.info file to foo/foo.info. Edit the
|
81
|
foo.info file and change "name = Zen Sub-theme Starter Kit" to "name = Foo"
|
82
|
and "description = Read..." to "description = A Zen sub-theme".
|
83
|
|
84
|
Why? The .info file describes the basic things about your theme: its
|
85
|
name, description, features, template regions, CSS files, and JavaScript
|
86
|
files. See the Drupal 7 Theme Guide for more info:
|
87
|
https://drupal.org/node/171205
|
88
|
|
89
|
Then, visit your site's Appearance page at admin/appearance to refresh
|
90
|
Drupal 7's cache of .info file data.
|
91
|
|
92
|
3. Choose your preferred page layout method or grid system.
|
93
|
|
94
|
By default your new sub-theme is using a responsive layout. If you want a
|
95
|
fixed layout for your theme, delete the unneeded "responsive" and
|
96
|
"responsive-rtl" css/sass files and edit your sub-theme's styles.css
|
97
|
or styles.scss file and replace the reference to "responsive" with
|
98
|
"fixed".
|
99
|
|
100
|
For example, edit foo/sass/styles.scss and change this line:
|
101
|
@import "layouts/responsive";
|
102
|
to:
|
103
|
@import "layouts/fixed";
|
104
|
|
105
|
Alternatively, if you are more familiar with a different CSS layout method,
|
106
|
such as GridSetApp or 960.gs, etc., you can replace the
|
107
|
"layouts/responsive" line in your styles.scss file with a line
|
108
|
pointing at your choice of layout CSS file.
|
109
|
|
110
|
Then, visit your site's Appearance page at admin/appearance to refresh
|
111
|
Drupal 7's theme cache.
|
112
|
|
113
|
4. Edit your sub-theme to use the proper function names.
|
114
|
|
115
|
Edit the template.php and theme-settings.php files in your sub-theme's
|
116
|
folder; replace ALL occurrences of "STARTERKIT" with the name of your
|
117
|
sub-theme.
|
118
|
|
119
|
For example, edit foo/template.php and foo/theme-settings.php and replace
|
120
|
every occurrence of "STARTERKIT" with "foo".
|
121
|
|
122
|
It is recommended to use a text editing application with search and
|
123
|
"replace all" functionality.
|
124
|
|
125
|
5. Set your website's default theme.
|
126
|
|
127
|
Log in as an administrator on your Drupal site, go to the Appearance page at
|
128
|
admin/appearance and click the "Enable and set default" link next to your
|
129
|
new sub-theme.
|
130
|
|
131
|
|
132
|
Optional steps:
|
133
|
|
134
|
6. Modify the markup in Zen core's template files.
|
135
|
|
136
|
If you decide you want to modify any of the .tpl.php template files in the
|
137
|
zen folder, copy them to your sub-theme's folder before making any changes.
|
138
|
And then rebuild the theme registry.
|
139
|
|
140
|
For example, copy zen/templates/page.tpl.php to foo/templates/page.tpl.php.
|
141
|
|
142
|
7. Modify the markup in Drupal's search form.
|
143
|
|
144
|
Copy the search-block-form.tpl.php template file from the modules/search/
|
145
|
folder and place it in your sub-theme's template folder. And then rebuild
|
146
|
the theme registry.
|
147
|
|
148
|
You can find a full list of Drupal templates that you can override in the
|
149
|
templates/README.txt file or https://drupal.org/node/190815
|
150
|
|
151
|
Why? In Drupal 7 theming, if you want to modify a template included by a
|
152
|
module, you should copy the template file from the module's directory to
|
153
|
your sub-theme's template directory and then rebuild the theme registry.
|
154
|
See the Drupal 7 Theme Guide for more info: https://drupal.org/node/173880
|
155
|
|
156
|
8. Further extend your sub-theme.
|
157
|
|
158
|
Discover further ways to extend your sub-theme by reading Zen's
|
159
|
documentation online at:
|
160
|
https://drupal.org/documentation/theme/zen
|
161
|
and Drupal 7's Theme Guide online at:
|
162
|
https://drupal.org/theme-guide
|