• View
  • Changes
  • Options
  • Related
  • Edit
  • Don't like the way Wagn looks? Customize! You can change the color scheme and more by changing the CSS, and you can change the whole layout of the page for a particular card or any set of cards.

     

    Examples

    Here are all of the layouts in use on wagn.org:

     

    How To

    Different sets of Wagn cards can have different layouts. By default, new Wagns have one layout, specified by *all+*layout:

    A layout setting card points to an HTML card that specifies the layout for the relevant set — so to add a layout just for User cards, you'd add their +*layout setting, pointing to a new HTML card that you would create. In the case of *all shown above, it points to a card called Default Layout, which looks like this:

     

     

    Notice how the only special syntax on the card is already very familiar stuff: inclusions

     

    Some of these inclusions, like {{*logo}} and {{*sidebar}} work just like any normal inclusion -- it simply includes those cards.  Others are special, uneditable, dynamic "virtual" cards, which appear differently depending on context.  If you click on them, however, you see they, too, largely behave like normal cards:

    *head, *foot -- these two are invisible but very important for proper javascript functioning.
    *navbox, *account links -- both of these appear in the default Wagn header.
    *version -- Wagn release number.
    *alerts -- ongoing messages / updates

    Last but not least is the {{_main}} inclusion, which determines where the "main" card of the page will be.  For example, if you click Support Ticket, then "Support Ticket" is the main card on the page, and {{_main}} determines where on the page that will appear.

     

    Note that the default views for cards included anywhere outside the main card is naked, rather than the usual content.

     

    Tips

    1. If you manage to break your Wagn while messing around with layouts, try adding ?layout=blank to the end of your url.  This will give you access to a functioning, built-in layout
    2. This trick is often most useful in combination with direct links to editing.
    3. Similarly, you can test layouts before using them by adding "?layout=[layout name]" at the end of most Wgn URLs.
    4. There are several other terms — besides _main — for constructing contextual names.
     
  • View
  • Changes
  • Options
  • Related
  • Edit
  • Hey Guys! I'm excited about the new layouts infrastructure!

     

    Simple. Elegant. Flexible. Just like wagneering. Well Done! I look forward to playing with it more.


    This is amazing! I am so glad to find this. I was considering Semantic MediaWiki for a project, but the ease and grace of Wagn is superb, as with this custom layout feature. Well done! Excellent crafting!

      --Patrick (Not signed in).....Sun Oct 25 14:58:07 -0700 2009


    Great job. Getting very close to the 'Everything-is-a-Card' meme.

      --WG (Not signed in).....Mon Oct 26 08:52:55 -0700 2009


    Layouts now work with any set, not just *all.

      --John Abbe.....Tue Apr 27 02:24:59 -0700 2010


    The list (in +examples) of "all" layouts isn't complete, and I can't think of a way to get all layouts, since some (e.g. mobile) aren't referred to by a +*layout card. Ideas?

      --John Abbe.....Thu Jan 27 16:34:09 -0800 2011

    Tickets relevant to custom layouts

    Download Docs Sandbox Hosting Support

  • View
  • Changes
  • Options
  • Related
  • Edit
  •  

    Wagn News

    1 to 5 of 24Next-page 1 to 5 of 24Next-page

     

    Ideas

     

     

    Support Tickets



    Wagn at github

    Wheeled by Wagn v. 1.7.2