Support for Drupal 7 is ending on 5 January 2025—it’s time to migrate to Drupal 10! Learn about the many benefits of Drupal 10 and find migration tools in our resource center.
Hi,
I'm new to omega 4, and i'm trying to build a custom subtheme with it's own layout.
here is my theme.info :
name = shaylen_omega
description = Please provide a description for your theme.
base theme = omega
screenshot = screenshot.png
engine = phptemplate
core = 7.x
; ========================================
; Stylesheets
; ========================================
stylesheets[all][] = css/shaylen-omega.normalize.css
stylesheets[all][] = css/shaylen-omega.hacks.css
stylesheets[all][] = css/shaylen-omega.styles.css
stylesheets[all][] = css/shaylen-omega.no-query.css
; ========================================
; Scripts
; ========================================
scripts[] = js/shaylen-omega.behaviors.js
; ========================================
; Regions
; ========================================
regions[header] = Header
regions[navigation] = Menu
regions[content_top] = Content Top
regions[sidebar_left] = Sidebar Left
regions[sidebar_center] = Sidebar Center
regions[sidebar_right] = Sidebar right
regions[left_column] = Left Column
regions[right_column] = Right Column
regions[content_bottom_first] = Content Bottom First
regions[content_bottom_second] = Content Bottom Second
regions[postscript_first] = Postscript First
regions[postscript_second] = Postscript Second
regions[postscript_third] = Postscript Third
regions[postscript_fourth] = Postscript Fourth
regions[footer_first] = Footer First
regions[footer_second] = Footer Second
and here is my page.tpl :
<div class="l-page">
<header class="l-header">
<div class="header">
<?php print render($page['header']); ?>
</div>
<div class="navigation">
<?php print render($page['navigation']); ?>
</div>
</header>
<div class="l-main">
<div class="l_content" role="main">
<?php print render($title_prefix); ?>
<?php print $messages; ?>
<?php print render($tabs); ?>
<?php print $feed_icons; ?>
</div>
<div class="content_top">
<?php print render($page['content_top']); ?>
</div>
<section class="sidebars">
<div class="sidebar_left">
<?php print render($page['sidebar_left']); ?>
</div>
<div class="sidebar_center">
<?php print render($page['sidebar_center']); ?>
</div>
<div class="sidebar_right">
<?php print render($page['sidebar_right']); ?>
</div>
</section>
<section class="columns">
<div class="left_column">
<?php print render($page['left_column']); ?>
</div>
<div class="right_column">
<?php print render($page['right_column']); ?>
</div>
</section>
<div class="content_bottom_first">
<?php print render($page['content_bottom_first']); ?>
</div>
<div class="content_bottom_second">
<?php print render($page['content_bottom_second']); ?>
</div>
<section class="postscripts">
<div class="postscript_first">
<?php print render($page['postscript_first']); ?>
</div>
<div class="postscript_second">
<?php print render($page['postscript_second']); ?>
</div>
<div class="postscript_third">
<?php print render($page['postscript_third']); ?>
</div>
<div class="postscript_fourth">
<?php print render($page['postscript_fourth']); ?>
</div>
</section>
</div>
<footer>
<div class="footer_first">
<?php print render($page['footer_first']); ?>
</div>
<div class="footer_second">
<?php print render($page['footer_second']); ?>
</div>
</footer>
</div>
and finally, my global scss :
@import "compass";
@import "breakpoint";
@import "singularitygs";
@import "toolkit-no-css";
@import "variables/**/*";
@import "abstractions/**/*";
@import "base/**/*";
@import "components/**/*";
img, media, table, thead, tbody, th, td, tr{
max-width: none;
@include breakpoint (0px $desktop){
max-width: 100%;
}
}
table, thead, tbody, th, td, tr {
@include breakpoint(0px $desktop){
display: block;
}
}
body {
background-image: url('../images/background.jpg');
background-repeat: repeat-x;
background-position: top left;
background-attachment: fixed;
.l-page {
background-color: white;
padding:5px;
margin:auto;
@include breakpoint($smartphone){
width:$smartphone;
}
@include breakpoint($tablet){
width:$tablet;
}
@include breakpoint($desktop){
width:$desktop;
}
.l-main {
@include clearfix;
.content_top {
@include grid-span(12,1);
}
.sidebars {
@include grid-span(12,1);
.sidebar_left {
@include grid-span(4,1);
@include breakpoint(0px $tablet) {
@include grid-span(12,1);
}
}
.sidebar_center {
@include grid-span(4,5);
@include breakpoint(0px $tablet) {
@include grid-span(12,1);
}
}
.sidebar_right {
@include grid-span(4,9);
@include breakpoint(0px $tablet) {
@include grid-span(12,1);
}
}
}
.columns {
@include grid-span(12,1);
.left_column {
@include grid-span(6,1);
}
.right_column {
@include grid-span(6,7);
}
}
.content_bottom_first {
@include grid-span(12,1);
}
.content_bottom_second {
@include grid-span(12,1);
}
.postscripts {
@include grid-span(12,1);
.postscript_first{
@include grid-span(3,1);
}
.postscript_second{
@include grid-span(3,4);
}
.postscript_third{
@include grid-span(3,7);
}
.postscript_fourth{
@include grid-span(3,10);
}
}
.footers {
@include grid-span(12,1);
.footer_first {
@include grid-span(6,1);
}
.footer_second {
@include grid-span(6,7);
}
}
}
}
}
with my _grid.scc variables :
$grids: 12;
$gutters: 1/3;
$desktop: 960px;
$tablet: 768px;
$smartphone: 480px;
And here is a screenshot of what the block demonstration shows : http://image.noelshack.com/fichiers/2014/09/1393618568-screenshot.png
So the postscripts and footers regions aren't working correctly. I spent a few hours testing everything that could come to my mind, without any success. What's wrong with my implementation? :/
Comments
Comment #1
Shaylen CreditAttribution: Shaylen commented