1 |
85ad3d82
|
Assos Assos
|
|
2 |
|
|
# Panels Layouts
|
3 |
|
|
|
4 |
|
|
Adaptivetheme includes these 14 layouts for use with the Panels module.
|
5 |
|
|
|
6 |
|
|
http://drupal.org/project/panels
|
7 |
|
|
|
8 |
|
|
All layouts are responsive and are controlled via theme settings in your
|
9 |
|
|
sub-theme. You can select layout options for each device group - this means
|
10 |
74f6bef0
|
Assos Assos
|
the layout of the panel can change for tablets or smalltouchs to better
|
11 |
85ad3d82
|
Assos Assos
|
suit the smaller size of those screens.
|
12 |
|
|
|
13 |
|
|
Note: regular Panels layouts or those supplied by another theme or module,
|
14 |
|
|
such as Panels Extra Layouts, will not be responsive with this theme, only
|
15 |
|
|
the Panels layouts supplied with Adaptivetheme are responsive.
|
16 |
|
|
|
17 |
|
|
# Gpanels
|
18 |
|
|
|
19 |
|
|
These same 14 layouts are avaialbe as Gpanels (layout snippets) for use in
|
20 |
|
|
your page.tpl.php files. Use Gpanels if you prefer to hold your layout in code
|
21 |
|
|
inside templates rather than using the Panels module. The priciple difference,
|
22 |
|
|
apart from using Panels, Ctools and Page Manager, is that Gpanels do not have
|
23 |
|
|
context avaialbe to them - only what block visibility can provide, unless you
|
24 |
|
|
use the Context module, or Mini Panels.
|
25 |
|
|
|
26 |
|
|
# CSS
|
27 |
|
|
|
28 |
|
|
Each of the layouts includes an admin CSS file, however the CSS for the front
|
29 |
|
|
end view of the panel comes from Adaptivetheme core and is generated when
|
30 |
|
|
you save the theme settings. This is the main trick in making responsive
|
31 |
|
|
panels work inside this theme - by omitting front end CSS from the actual
|
32 |
|
|
layout plugin and instead wrangling all CSS inside the theme.
|
33 |
|
|
|
34 |
|
|
# Markup
|
35 |
|
|
|
36 |
|
|
The markup is different from normal Panels layouts. Instead of using the regular
|
37 |
|
|
panels type markup and classes I opted to mimic regular regions. This was done
|
38 |
|
|
to make them identical to Gpanels, so we only need one set of CSS files to
|
39 |
|
|
control both Panels and Gpanel layouts.
|
40 |
|
|
|
41 |
|
|
# Usage
|
42 |
|
|
|
43 |
|
|
The layouts will appear inside Panels when you select the layout for the Panel
|
44 |
|
|
you are creating, simply choose one of the AT Responsive Panel options.
|
45 |
|
|
|
46 |
|
|
You will notice the icons are orange and blue compared to Panels module plain
|
47 |
|
|
grey icons. The orange regions are optional (collapsible) but the blue ones are
|
48 |
|
|
not - they will not collapse if not used.
|
49 |
|
|
|
50 |
|
|
Most of the layouts are "stacked" meaning they have top and bottom regions - all
|
51 |
|
|
top and bottom regions are collapsible.
|
52 |
|
|
|
53 |
|
|
# Developer Info
|
54 |
|
|
|
55 |
|
|
Please see the five_5x20 plugin inc file for exstensive docs on the plugin structure
|
56 |
|
|
and various other details you will need to make your own plugin.
|
57 |
|
|
|
58 |
|
|
|