I have produced a new module for a site I am working on and would like to share it with the Drupal community. While not quit ready for release it is usable and I would appreciate feedback on how it fits into Drupal, what is extra and what might be added.

An example of this in use can be found at http://test.wnpj.org (This is a test site)
zip file attached with module, mysql file, default css file, support.inc and installation instructions.

The module allows for breaking a page into sections similiar to the sections module but with a finer control on content.
With it you can define one or more layout pages, each layout page is then referenced by the name layout/pagename (pagename is something you assign). For example, on the test site the layout page is called frontpage and
under administer -> settings I have set

Each layout page is broken into sections. A layout page can be layed out as either weighted rows (each section is one row in the output, order is determined by weight) or in a grid, placing each section in a row/column. In grid mode a section can span rows/columns. A section can have an optional "tab" which is used to label the section on output.

Each section can be broken into layout blocks which are layed out in a row within the section. Each layout block can contain a 1) Drupal block (add block)
2) a Drupal node (add node)
3) a mixes list of Drupal nodes (add node)
4) a list of Drupal nodes of a given type. (add list)

The difference between a "node" and a "list" is the degree of control you have. When adding a node you can specify a single node or list of nodes but the content is only changed by editing the list (or the node).
With a list you can specify a table to join with (say event), specify the sort order and add a customer where clause. So with a list you can make a layout block that contains the list of events for the current week.

So before looking at each of the parts in more detail, lets look at the common features.

A layout page, section and block can be viewed by any one, only people not logged in, only people logged in or people with a specified permission. For a page, if it can not be views the user sees the "Access Denied" page. For layout sections and blocks no output is produced.

For layout sections and blocks you can specify a ccs class that can be used to control the look of the section or block. So for example on test.wnpj.org, Alerts have a css class specified for the section to allow for a different color scheme than the rest.

Details for layout pages, sections and blocks. Items with a * have a common footnote below on formatting control.

Layout page
Has a page name, used to access/display the page with the path layout/pagename
Can specify a css file to include to control appearance of the page.
Layout choice (weighted rows, grid)
Permission controls

Layout section
*An optional "tab" header. Appearance controlled through css
A description (defaults to tab header). Used in adminstative interface
An enable flag (only enabled sections show in the output)
Optional width (can be used to control the width of the section, also can be done is css)
If weight row layout, a weight for the section.
If grid layout, a row, column, row span and column span.
(Note, if you change page layout type, existing data is retained so if you switch back the old values are used)
Optional css class
Permission controls
Optional section header (if content). If specified and the section has content, placed above the layout blocks.
Optional section header (if no content). If specified and the section does not have content, the specified html is used
(Note: Can be used to make a section with fixed content like a welcome message without making a node)
Optional section footer. If specified and the section has content, placed below the layout blocks.
Hide if no content flag, if set and section has no content, "if not content header" is ignored and section produces no output.

Layout block, common
Description - Used in admin interface to identify block
Weight - Determines order in section.
Enable flag (only enabled blocks show in output)
Optional width
css class

Layout block, type: Drupal block
Source block - drop down list of available blocks
Display control - Content of block only or title and content.

Layout block, type: Node (or list of nodes)
Node path list - a list of comma seperated nodes or path aliases (ex: 1,2,TaskForce,node/4)
Display control
Title
Content Only
Title and content
Full Node (display by node type)
Full Node with teaser (teaser instead of full body)
*Title source, used if 'title' or 'title and content' picked for display, default @title@
*Content source, used if 'content' or 'title and content' picked for display, default @body@
Limit Content, used if 'content' or 'title and content' picked for display, default 0 (don't limit)
If set, only used specified number of characters from content.

Layout block, type: List
Source module - used to select type of node that will be displayed
Display control
Title
Content Only
Title and content
Full Node (display by node type)
Full Node with teaser (teaser instead of full body)
*Title source, used if 'title' or 'title and content' picked for display, default @title@
*Content source, used if 'content' or 'title and content' picked for display, default @body@
Limit Content, used if 'content' or 'title and content' picked for display, default 0 (don't limit)
If set, only used specified number of characters from content.
'Sort by Sticky' flag, if set sticky items show at top of list.
Ablity to select on node status, promote (frontpage) and sticky (each can be don't care, on, or off)
WARNING - the following options require some internal knowledge of the selected source module
Optional join table, example for the event module this would be event
Allows limiting and sorting based on fields in the join table
*Optional custom sort: example for event module: "start"
Note: if 'sort by sticky' is set this appended to that.
Optional where clause: see 'formatting' header for example

Formatting tab header text, title, content and where clause
The basic forms are
text - just plain text, shows as entered
@field_name@ - field in node table and for list in join table (does not apply to tab header)
Ex: @title@ uses the title field of node
{php code} - Output of php code is used

These can be combined, here are some examples from test.wnpj.org

event tab: Events for week of {layout_this_week_range(); }
See support.inc for layout_this_week_range()
event listing title: {event_format_date_range($node);}
{event_city($node, true);} - @title@
event_format_date_range() and event_city() are custom functions.
Note: There is a variable $node is scope at the time the function is called
This contains the current node ( and for list the joined table )
event list where clause: {layout_sql_this_week();}
See support.inc for layout_sql_this_week()

Special note: By the time formatting happens title has been modified to be inclosed in a link to the actual node.

Support.inc (preliminary)
Contains functions that can be used in formatting

layout_this_week($dow=1, $week_offset=0, $format = "")
dow - dow of week to use for date, defaults to monday
week_offset - can get date for week relative to this week
format - valid format to date function
if set, layout_this_week returns formatted date string
else layout_this_week returns a date

layout_this_week_range($week_offset=0, $format = "")
Returns a string in format "Start date - End Date"
week_offset - can get date for week relative to this week
format - If sepecified, start date and end date are formatted as specifed
Otherwise if start and end date are in same year 'M j' is used the format
Otherwise if in different years 'M j Y' is used for the format

layout_sql_this_week($clip=false)
clip - not yet implemented, purpose is to limit dates for today to end of week
For use with event module, returns sql where clause that selected entries only for current week.

layout_mixed_type($node) - EXAMPLE
Shows how one could format the title based on node type.

Output appearance
Fair degree of control in ouput controlled by css and theme functions
(Current version is preliminary and subject to change)

Using:
After installing the module and adding the tables to the database
Enable the module under administer -> module
This will add a new entry under administer called layout
From layout you add layout pages, sections and blocks
Once you add a page you can add sections.
Once you add a section you can add blocks

CommentFileSizeAuthor
#22 layout_0.zip46.14 KBnevets
layout.zip16.93 KBnevets
Support from Acquia helps fund testing for Drupal Acquia logo

Comments

Dublin Drupaller’s picture

Category: task » support

this looks superb.

Have downloaded and installed the module...but am slight confused how to implement a simple test.

Can you outline step by step how to create a layout page test?

Cheers

Dub

nevets’s picture

How to setup a simple test.

First using just some nodes and blocks. You can either use existing nodes or make some test ones, you need to know either their node id or path alias (if path is enabled)

Lets say the nodes are number 10, 12 and 23 (Your nodes are likely to be different)

Go to administer -> layout
Click on 'add layout page', give the page a name (probably should not have spaces) and set the other options you want.
Save the layout page.

Now you can add a section to to the page.
Lets give it a tab, say 'Test layout', Fill in the other values as you wish just make sure that enable is checked.
Save the section

Now you can add layout blocks to the section.
Lets add a node, click 'add node' (to right of section description)
Give it a descriptive name, select what you want to display (you can come back and change this later)
Now set node path list, for now just type one of your node ids (or a path alias)
For now leave the other options as their defaults
Save the layout block.

To test what you have so far, go to administer -> settings
Record what the value is for 'default front page' so you can set it back later.
Change the value to layout/pagename where pagename is the name you assigned to the layout page.
Save the settiings and go to the front page.

Your should see a single tabbed section with the text 'Test layout' or what ever you typed.
The contents should be from the node you selected displayed by you choice when setting up the node.
(Note the default tabs are pretty boring)

Now if you go back to administer -> layout you can add new pages, new sections and/or new blocks.
Lets add a block to the existing section, click 'add block'
Give the block a descriptive name, pick a block to display (normally I would pick one related to the node).
Set the weight negative to position the block to the left of the node content, positive to position it to the right (This assumes you left the weight for the node block at 0).
Save the block.

Now lets add another section and then add a node block
This time instead of single node type a comma separated list (ex 10,23,12 or TaskForce,23,Members).
Nodes will be listed in the order given.
Save the node

If you have layout set to 'weighted rows' for the page the order of the sections will be determined by the weight.

Now lets add another section this time NOT setting the tab header and placing text in the 'Section header (if no content)' text box.
If using weighted rows set weight to -10 and save the section.
The section can now act as a welcome block on the page.

For the node blocks you can play around with display option and see how they change the contents of the sections.

That covers everything but the list blocks. A simple example if you have the event module enable is add a list block to a new section.

Set source module to 'event'
Set display to your choice
Set join table to 'event'
Set custom sort to 'start'
Set custom where to '{sql_this_week();}'

Save the list block, this should give you a listing of events sorted by date for the current week.
If you keep 'sort by sticky' set and any events for the week have it set they will 'float' to the top of the listing.
You can also play with the statat, promote and stick value options.

While the list block is very flexable, it useful to know something about the details of the node type to take advantage of the flexability.

Hope this helps.
Steve Ringwood

nevets’s picture

Title: New layout module, looking for feedback » Correction to above post

this_week_range(); s/b layout_this_week_range();

and

sql_this_week(); s/b layout_sql_this_week();

(Sorry about that, I had cut and paste from an earlier installation)

Steve Ringwood

ax’s picture

Title: Correction to above post » New layout module, looking for feedback
Category: support » task
Boris Mann’s picture

nevets -- the description sounds very interesting. It would be great if you were to apply for a CVS-account and check your code in.

Steven’s picture

Doesn't this module do what collimator.module does?

steffen’s picture

This is truly a promising contribution, nevets!

1) How do I make a page only show the title and the excerpt for the assigned node?

2) I specify one page with grids and add two sections. In one section I put a node, and in the other I put a list.

In the node I have specified 1 row, 1 rowspan, 1 column and 3 colspans.

In the list I have specified 3 rows, 1 rowspan, 3 columns and 1 colspan.

The result is that I get one long list, with the node on the top, and the list vertically underneath. Shouldn't the result be one node on the top, and a list in a 3x3 grid underneath?

nevets’s picture

If by 'How do I make a page only show the title and the excerpt for the assigned node?' when you say excerpt you mean teaser, set display type to 'title and content' and set content source to '@teaser@'

For the second question and the section for the list you wrote: 'In the list I have specified 3 rows, 1 rowspan, 3 columns and 1 colspan.' and ask 'Shouldn't the result be one node on the top, and a list in a 3x3 grid underneath?'

Only if you set rowspan to 3, the row variable specifies the starting row, the row span the number of rows.

Note the end result will effectively be a grid with 2 rows (node section and list section) and one column since they both span 3 columns.

nevets’s picture

Regarding the collimator module, though you could probably reproduce part of the behaviour with the layout module (it will not make the multiple page) they do serve a different purpose.

The layout module will allow a more arbitrary layout of content in the page and allows for combining the output from a single node, list of different node types, lists of nodes of a given type and also the content of blocks,
When listing nodes of a given type you have control on how to filter them (the where clause) and how to order them.

ramdak5000@www.drupal.org’s picture

I haven't tested the module, but, going by your description, it sounds great and what many people have been asking for, including myself.

Can the module reference the taxonomy? We had a discussion (http://drupal.org/node/16426) where we wanted a kind of an index page automatically set for a vocabulary and grids on that page to automatically pulled in and displayed content from the vocab terms (not on the left and right side blocks). On urbanvancouver.com, for example, that index page would be 'neighbourhoods', with grids or whatever to display direct links to content posted under each neighbourhood category.

Addditionally, some of us suggested that the breadcrumb trail automatically reflect this hierarchical structure.

Fool2’s picture

Doing taxonomy might be possible with the table join function, but I haven't figured it out yet. My website is organized according to taxonomy, so this is a big thing.

steffen’s picture

Another issue regarding this very promising module:

When listing nodes from a taxonomy, the module doesn't separate between the languages. So that if you have nodes in three different languages, every node will be listed three times, in three different languages.

jasonwhat’s picture

Title: New layout module, looking for feedback » How do I set blogs as list?
Category: task » support

This does look great. I see how to set "events" as a list, but the, blog nodetype doesn't have its own list. How do I set blogs as the type for a list, i.e.-"Featured Blogs"? Controlling by taxonomy would be great also.

chx’s picture

Title: How do I set blogs as list? » New layout module, looking for feedback
Category: support » task

Fixed the various fields: title, category and version.

jasonwhat’s picture

where is the "fixed" version? Does database need updated for this or just the .module file? thanks.

chx’s picture

jason, I fixed the fields of the issue, not the module itself.

jasonwhat’s picture

Title: New layout module, looking for feedback » Anybody have this working?

Does anybody have this working on their site?

ixis.dylan’s picture

Title: Anybody have this working? » 4.6

I'm interested in testing this, because it looks very interesting. Is there any chance of it being "fixed" to work with 4.6's new SQL functions?

ixis.dylan’s picture

Title: 4.6 » New layout module, looking for feedback » Anybody have this working

Sorry, I changed the title by mistake.

JonBob’s picture

Title: New layout module, looking for feedback » Anybody have this working » New layout module, looking for feedback
chrismessina’s picture

Can we see a sandbox version to play with? Or perhaps even screenshots?

I'm working on this too and would like to see how you've approached the workflow.

nevets’s picture

Title: New layout module, looking for feedback » Update - fix to support news blocks
FileSize
46.14 KB

New zip file to support more block types, a fix so blocks work under phptemplates (thanks to Owen) and a fix to the default css to correct a problem under IE.

(I will be adding this to CVS as soon as I can get the code to conform to the coding standards)

heydg’s picture

can steffen or someone please demonstrate how list nodes by taxonomy using this module?

actually i would appreciate any and all list examples w/ exact mysql syntax. interesting in sorting and/or limiting by date (ex: only items from the most recent day). i know about the daily module but i am interested specifically in displaying flexinode externally-linking news items in a variety of ways. thx

heydg’s picture

Category: task » support

i would also be very grateful for any help w/ regard to the functions in support.inc...

does anybody now layout_sql_this_week has been implemented and is usable for a 4.5.2 site? could it provide the foundation for limiting to a day, and using other nodes beside events?

kvarnelis’s picture

so i can't really tell from this thread... does this work on 4.6 yet?

nevets’s picture

Not yet, I plan to port it to 4.6 when I get a chance.
Currently not sure when that will be though

bomarmonk’s picture

I'm looking forward to trying this with 4.6! Thanks for your work on this feature!

bomarmonk’s picture

Testing in 4.6 -- so far everything works! Does this even need to be ported? Any known problems with 4.6?

bomarmonk’s picture

I would like to make the layout page a node-- is there a way, for instance to embed the layout module's output into a book page? I would like to use layout for more than just the front page and I need it to work within my hierarchal book structure. I'm thinking a code snippet that called functions from the layout module might produce this? Than again, why not make the layout page a node itself?

Great module!

bomarmonk’s picture

Thanks for the update of this module with a page layout node-type! This is really going to help with my site, I believe!

haribole’s picture

Hi
thanks for this wonderful module, but am having starting trouble.

When I create a simple layout, add a section and add a node, and test the layout, I dont see the content displayed in the section.

Wonder what I could be doing wrong.

thanks for any help

nevets’s picture

The layout test is simply for testing the layout (without content).
To see the layout complete with content use the path layout/pagename where pagename is the name you gave the layout page.

haribole’s picture

Dear Nevets

Thanks a bunch for responding to my earlier question. I could make the content show up in my front page. But it has this
heading which says "layout" , how can I remove this, and how do I reduce the width of the column, if I give this as 90% it does not seem to like it.

Thanks again

haribole’s picture

oooops, I did not mean to make all of them in the h1 size heading, did not realise that the html tag would appear so..... extremely sorry about this.

brettev’s picture

Version: » 4.6.3

I love this. The idea of it is awesome. I have it working to the point where I do the test layout and it shows up the names of the sections and nodes that i named them. However, when I go to look at the page, I don't see anything. I am using phptemplates with the spreadfirefox theme. I dont know if this matters or not, or if there is an easier way to do what i am doing. i want to merge my forum listing with some bookreview and maybe a filestore2. is this the best way to do this, or is there a better way?

nevets’s picture

To view the actual page, use the path layout/{page_name}, where {page_name} is replaced with the name you gave the page when you created it (If you can not recall the name, look under administer -> layout). Also, if you are using 4.6, I have a new version.

magico’s picture

Status: Active » Closed (fixed)

Organic groups and Regions