Sidebar again

A place to discuss and receive support for LCMS (Little Content Management System)

Postby njw » Mon Oct 01, 2007 11:57 am

Any thoughts on how to make the sidebar items appear as blinds: only the titles are seen unless you click on one, when the whole content is displayed. I've had a look at some frameworks to do this, but I'm not confident how to integrate them into LCMS

Many thanks

Neil
njw
 
Posts: 280
Joined: Wed Dec 31, 1969 5:00 pm

Postby shannah » Mon Oct 01, 2007 1:04 pm

Hi Neil,

Step 1: In your MainTemplate.html file in the part tha displays the sidebars, we change it to something like:

Code: Select all


{assign var=sidebars value=$page->getRelatedRecordObjects('sidebars')}
{foreach from=$sidebars item=sidebar}
   
   

{$sidebar->val('link_label')}


   

{/foreach}


Note that all we did was create a javascript function named toggle(), then added the onclick event handler to the h3 tag for each sidebar.  We also wrapped the sidebar content in a div tag so that the toggle function could toggle the css class of that div tag.

Step 2: Add some styles to your stylesheet for visible and hidden:

[code]
.visible { display: block}
.hidden {display: none}


This is untested and very simplistic, but this can be used as a basis for arbitrarily complex "blinds" functionality.

In the latest version of Dataface I have included scriptaculous and added a smarty tag to add an animated hide/show sidebar.

-Steve
--
Steve Hannah
@shannah78 (on twitter)
sjhannah.com blog
shannah
 
Posts: 4457
Joined: Wed Dec 31, 1969 5:00 pm

Postby njw » Mon Oct 01, 2007 7:59 pm

Many thanks Steve. As you know, simple is best with me!
njw
 
Posts: 280
Joined: Wed Dec 31, 1969 5:00 pm

Postby njw » Tue Oct 02, 2007 3:41 am

Tried that and got a Smarty error - unknown variable var

Also, I have now realised that I need to be able to make this specific to certain pages.

If I upgraded to v0.7.1 would I get the animated show/hide function or were you referring to the next unpublished version?

Thanks for any help.

Neil
njw
 
Posts: 280
Joined: Wed Dec 31, 1969 5:00 pm

Postby shannah » Tue Oct 02, 2007 8:54 am

Sorry, you have to surround javascript in {literal}{/literal} tags in smarty because javascript contains the '{' character which is special to smarty. The {literal} tag tells smarty to ignore whatever is inside.
--
Steve Hannah
@shannah78 (on twitter)
sjhannah.com blog
shannah
 
Posts: 4457
Joined: Wed Dec 31, 1969 5:00 pm

Postby njw » Fri Oct 05, 2007 2:10 am

Thanks again Steve. Can I easily apply this only to specific pages? For instance, I probably only need this on the home page, which has "news" material, and not on other pages where I am using the sidebar more as menu for related links.

Many thanks

Neil
njw
 
Posts: 280
Joined: Wed Dec 31, 1969 5:00 pm

Postby shannah » Fri Oct 05, 2007 11:58 am

This is just a tag that you wrap around the text that is offending.

e.g.

..
{literal}
Powered by Dataface
© 2005-2007 Steve Hannah All rights reserved