Page 1 of 1

need help with smarty logic for template

Posted: Fri Oct 11, 2013 6:10 pm
by newagekat
Hello:

i'm currently using cmsms v1.11.7. in my template i have assigned the main content tag and have added 5 additional content blocks. if block 1 is filled, then i want to display the main content and i want to place the content of block 1 in a toggle div. this is working.

if, however, block 2 and / or any additional blocks are filled in, then i want block 1-5 to display in tabs.

this is what i have thus far:

Code: Select all

{content assign='mainContent'}
                {content block='tab1' assign='tab1' label='Tab 1' wysiwyg='true'}
                {content block='tab2' assign='tab2' label='Tab 2' wysiwyg='true'}
                {content block='tab3' assign='tab3' label='Tab 3' wysiwyg='true'}
                {content block='tab4' assign='tab4' label='Tab 4' wysiwyg='true'}
                {content block='tab5' assign='tab5' label='Tab 5' wysiwyg='true'}
                
                {if !empty($tab1)}
                {$mainContent}
                 <div class="toggle" style="display:none;">
                {$tab1}
                </div>
                {elseif !empty($tab1) && !empty($tab2)}
                {$mainContent}
                <div class="tabber">
                <div class="tabbertab">
                {$tab1}
                </div>
                <div class="tabbertab">
                {$tab2}
                </div>
                {elseif !empty($tab3)}
                {$mainContent}
                <div class="tabber">
                <div class="tabbertab">
                {$tab1}
                </div>
                <div class="tabbertab">
                {$tab2}
                </div>
                <div class="tabbertab">
                {$tab3}
                </div>
                </div>
                {elseif !empty($tab4)}
                {$mainContent}
                <div class="tabber">
                 <div class="tabbertab">
                {$tab1}
                </div>
                <div class="tabbertab">
                {$tab2}
                </div>
                <div class="tabbertab">
                {$tab3}
                </div>
                <div class="tabbertab">
                {$tab4}
                </div>
                </div>
                {elseif !empty($tab5)}
                {$mainContent}
                <div class="tabber">
                 <div class="tabbertab">
                {$tab1}
                </div>
                <div class="tabbertab">
                {$tab2}
                </div>
                <div class="tabbertab">
                {$tab3}
                </div>
                <div class="tabbertab">
                {$tab4}
                </div>
                <div class="tabbertab">
                {$tab5}
                </div>
                </div>
                {else}
                {$mainContent}
                </div>
                {/if}
I know it's messy, but i don't know how to create an array or use foreach to handle this. i'm no programmer, sadly, but i can understand the code logic if shown.

I did add text to block='tab2' but it does not diaplay.

does anyone have a moment to guide me? please?

Re: need help with smarty logic for template

Posted: Fri Oct 11, 2013 11:43 pm
by rotezecke
the first test to return true in any if statement (of any programming language, I suppose) will execute the following code and skip anything else of the if block.
example:

Code: Select all

   {if !empty($tab1)}
if this condition is true, non of the elseifs will be considered, even though they could be true as well.

Maybe this thread could be moved to another forum?

Re: need help with smarty logic for template

Posted: Sat Oct 12, 2013 3:54 am
by calguy1000
try something like this (untested). In order for tabbed content to work the user would have to fill in content blocks in sequence. leaving one out would cause all later ones to not appear.

Code: Select all

<__script__ type="text/javascript">
// requires jquery, jquery ui.
$(document).ready(function(){
  $('#toggle').click(function(){
     $('#tab1_toggle').toggle('slow');
  });
  $('#tabs').tabs();
});
</__script>

{strip}
{if empty($tab1)}
  {* just the main content is specified *}
  {$maincontent}
{else}
   {* tab1 is not empty *}
   {if empty($tab2)}
     {* tab2 is empty, therefore tab1 is hidden with a toggle *}
     {$maincontent}
     <input id="toggle" type="checkbox" value="1"> 
     <div id="tab1_toggle" class="hidden">{$tab1}</div>
   {else}
      {* tabbed layout of all content. *}
     <div id="tabs">
     <ul>
        <li href="#tab-main">main</li>
        <li href="#tab1">tab1</li>
        <li href="#tab2">tab2</li>
        {if !empty($tab3)}
          <li href="#tab3">tab3</li>
          {if !empty($tab4)}
            <li href="#tab4">tab4</li>
            {if !empty($tab5)}
              <li href="#tab5">tab5</li>
            {/if}
        {/if}
     </ul>
     <div id="tab-main">{$maincontent}</div>
     <div id="tab1">{$tab1}</div>
     <div id="tab2">{$tab2}</div>
     {if !empty($tab3)}<div id="tab3">{$tab3}</div>
       {if !empty($tab4)}<div id="tab4">{$tab4}</div>
         {if !empty($tab5)}<div id="tab5">{$tab5}</div>{/if}
       {/if}
     {/if} 
     </div>{* #tabs *}
  {/if}
{/if}
{/strip}