HTML Logo by World Wide Web Consortium (www.w3.org). Click to learn more about our commitment to accessibility and standards.

Moving forward with Composr

ocPortal has been relaunched as Composr CMS, which is now in beta. ocPortal 9 will be superseded by Composr 10.

Head over to compo.sr for our new site, and to our migration roadmap. Existing ocPortal member accounts have been mirrored.


Trying to make tabs for zones but having trouble.

Login / Search

 [ Join | More ]
 Add topic 
Posted
Rating:
#25003 (In Topic #5910)
Avatar

Community saint

I want to make tabs for each zone instead of the long bar but I tried this code but it looks  bad and does not do what I want.

Code

{+START,BOX,
   {$SET,PREVIOUS_ZONE,_false}
     {+START,LOOP,ZONES}
      {+START,IF,{$AND,{$NEQ,{CODE},},{$NEQ,{CODE},docs}}}
         {+START,IF,{$GET,PREVIOUS_ZONE}}|{+END}
         <a {+START,IF,{$IS_STAFF}}title="{!SPECIAL_CLICK_TO_EDIT#}" onclick="Javascript: if (!window.handleZoneClick) return true; if (!event) event=window.event; return handleZoneClick(this,event,'{CODE*;}');" {+END}{+START,IF,{$NOT,{$GET,PREVIOUS_ZONE}}}accesskey="Z" {+END}href="{$PAGE_LINK*,{CODE}}" class="{$?,{$EQ,{$ZONE},{CODE}},current_zone,non_current_zone}">{TITLE}</a>
         {$SET,PREVIOUS_ZONE,_true}
      {+END}
   {+END}
,100%,curved}
{+end}

I run http://otakuplayground.com and am hopping to make themes and other things for ocportal even though I no longer use it for otakuplayground.com I still love it and feel it could go far with the right help. It needs themes and needs people to advertise for it.
Back to the top
 
Posted
Rating:
#25006
Avatar

Code

{+START,SHIFT_ENCODE,my_tabs}
{$SET,PREVIOUS_ZONE,_false}
{+START,LOOP,ZONES}
   {+START,IF,{$AND,{$NEQ,{CODE},},{$NEQ,{CODE},docs}}}
      {+START,IF,{$GET,PREVIOUS_ZONE}}|{+END}
      <a {+START,IF,{$IS_STAFF}}title="{!SPECIAL_CLICK_TO_EDIT#}" onclick="Javascript: if (!window.handleZoneClick) return true; if (!event) event=window.event; return handleZoneClick(this,event,'{CODE*;}');" {+END}{+START,IF,{$NOT,{$GET,PREVIOUS_ZONE}}}accesskey="Z" {+END}href="{$PAGE_LINK*,{CODE}}" class="{$?,{$EQ,{$ZONE},{CODE}},current_zone,non_current_zone}">{TITLE}</a>
      {$SET,PREVIOUS_ZONE,_true}
   {+END}
{+END}
{+END}
{+START,BOX,{$SHIFT_DECODE,my_tabs},100%,curved}
{+END}


Become a fan of ocPortal on Facebook or add me as a friend. Add me on on Twitter.
Was I helpful?
  • If not, please let us know how we can do better (please try and propose any bigger ideas in such a way that they are fundable and scalable).
  • If so, please let others know about ocPortal whenever you see the opportunity.
  • If my reply is too Vulcan or expressed too much in business-strategy terms, and not particularly personal, I apologise. As a company & project maintainer, time is very limited to me, so usually when I write a reply I try and make it generic advice to all readers. I'm also naturally a joined-up thinker, so I always express my thoughts in combined business and technical terms. I recognise not everyone likes that, don't let my Vulcan-thinking stop you enjoying ocPortal on fun personal projects.
  • If my response can inspire a community tutorial, that's a great way of giving back to the project as a user.
Back to the top
 
Posted
Rating:
#25007
Avatar

I'll elaborate a bit…

In TOP.tpl:

Code

{+START,SHIFT_ENCODE,my_tabs}
{$SET,PREVIOUS_ZONE,_false}
{+START,LOOP,ZONES}
   {+START,IF,{$AND,{$NEQ,{CODE},},{$NEQ,{CODE},docs}}}
      {+START,IF,{$GET,PREVIOUS_ZONE}}|{+END}
      <a {+START,IF,{$IS_STAFF}}title="{!SPECIAL_CLICK_TO_EDIT#}" onclick="Javascript: if (!window.handleZoneClick) return true; if (!event) event=window.event; return handleZoneClick(this,event,'{CODE*;}');" {+END}{+START,IF,{$NOT,{$GET,PREVIOUS_ZONE}}}accesskey="Z" {+END}href="{$PAGE_LINK*,{CODE}}" class="{$?,{$EQ,{$ZONE},{CODE}},current_zone,non_current_zone}">{TITLE}</a>
      {$SET,PREVIOUS_ZONE,_true}
   {+END}
{+END}
{+END}

At the top of GLOBAL.tpl:

Code

{+START,BOX,{$SHIFT_DECODE,my_tabs},100%,curved}

At the bottom of GLOBAL.tpl:

Code

{+END}


Become a fan of ocPortal on Facebook or add me as a friend. Add me on on Twitter.
Was I helpful?
  • If not, please let us know how we can do better (please try and propose any bigger ideas in such a way that they are fundable and scalable).
  • If so, please let others know about ocPortal whenever you see the opportunity.
  • If my reply is too Vulcan or expressed too much in business-strategy terms, and not particularly personal, I apologise. As a company & project maintainer, time is very limited to me, so usually when I write a reply I try and make it generic advice to all readers. I'm also naturally a joined-up thinker, so I always express my thoughts in combined business and technical terms. I recognise not everyone likes that, don't let my Vulcan-thinking stop you enjoying ocPortal on fun personal projects.
  • If my response can inspire a community tutorial, that's a great way of giving back to the project as a user.
Back to the top
 
Posted
Rating:
#25008
Avatar

Community saint

That centered it at the top.
http://ocpower.info/skins/index.php?page=
This is every thing in the top template.

Code

  {+START,SHIFT_ENCODE,my_tabs}
{$SET,PREVIOUS_ZONE,_false}
{+START,LOOP,ZONES}
   {+START,IF,{$AND,{$NEQ,{CODE},},{$NEQ,{CODE},docs}}}
      {+START,IF,{$GET,PREVIOUS_ZONE}}|{+END}
      <a {+START,IF,{$IS_STAFF}}title="{!SPECIAL_CLICK_TO_EDIT#}" onclick="Javascript: if (!window.handleZoneClick) return true; if (!event) event=window.event; return handleZoneClick(this,event,'{CODE*;}');" {+END}{+START,IF,{$NOT,{$GET,PREVIOUS_ZONE}}}accesskey="Z" {+END}href="{$PAGE_LINK*,{CODE}}" class="{$?,{$EQ,{$ZONE},{CODE}},current_zone,non_current_zone}">{TITLE}</a>
      {$SET,PREVIOUS_ZONE,_true}
   {+END}
{+END}
{+END}
{+START,BOX,{$SHIFT_DECODE,my_tabs},100%,curved}
{+END}
   
      {LOGOMAP}
      <img usemap="#logomap" src="{LOGOURL*}" title="{HEADER_TEXT*}" alt="{HEADER_TEXT*}" />
   </div>
<div class="global_logo">
   {$SET,BANNER,{$BANNER}} {$,This is to avoid evaluating the banner parameter twice}
   {+START,IF_NON_EMPTY,{$GET,BANNER}}
      <div class="global_banner" style="text-align: {!en_right}">{$GET,BANNER}</div>
   {+END}
</div>

Going for a look like at http://secure.sailrite.com

I run http://otakuplayground.com and am hopping to make themes and other things for ocportal even though I no longer use it for otakuplayground.com I still love it and feel it could go far with the right help. It needs themes and needs people to advertise for it.
Back to the top
 
Posted
Rating:
#25010
Avatar

Community saint

Its like this now.

Code

<div class="global_top">
{+START,SHIFT_ENCODE,my_tabs}
{$SET,PREVIOUS_ZONE,_false}
{+START,LOOP,ZONES}
   {+START,IF,{$AND,{$NEQ,{CODE},},{$NEQ,{CODE},docs}}}
      {+START,IF,{$GET,PREVIOUS_ZONE}}|{+END}
      <a {+START,IF,{$IS_STAFF}}title="{!SPECIAL_CLICK_TO_EDIT#}" onclick="Javascript: if (!window.handleZoneClick) return true; if (!event) event=window.event; return handleZoneClick(this,event,'{CODE*;}');" {+END}{+START,IF,{$NOT,{$GET,PREVIOUS_ZONE}}}accesskey="Z" {+END}href="{$PAGE_LINK*,{CODE}}" class="{$?,{$EQ,{$ZONE},{CODE}},current_zone,non_current_zone}">{TITLE}</a>
      {$SET,PREVIOUS_ZONE,_true}
   {+END}
{+END}
{+END}
</div>
<div class="global_logo">   
      {LOGOMAP}
      <img usemap="#logomap" src="{LOGOURL*}" title="{HEADER_TEXT*}" alt="{HEADER_TEXT*}" />
   </div>
<div class="global_logo">
   {$SET,BANNER,{$BANNER}} {$,This is to avoid evaluating the banner parameter twice}
   {+START,IF_NON_EMPTY,{$GET,BANNER}}
      <div class="global_banner" style="text-align: {!en_right}">{$GET,BANNER}</div>
   {+END}
</div>

With the other in the global.
The resault my before another skin but not the look I am going for.

I run http://otakuplayground.com and am hopping to make themes and other things for ocportal even though I no longer use it for otakuplayground.com I still love it and feel it could go far with the right help. It needs themes and needs people to advertise for it.
Back to the top
 
Posted
Rating:
#25012
Avatar

Community saint

I may have to make it so people will have to edit the top template to get this theme to work.
I will just make a little readme for it saying how to add the zones to each tab.

I run http://otakuplayground.com and am hopping to make themes and other things for ocportal even though I no longer use it for otakuplayground.com I still love it and feel it could go far with the right help. It needs themes and needs people to advertise for it.
Back to the top
 
Posted
Rating:
#25014
Avatar

Community saint

 New code new problem but same tab making issue.
Here is the new code.

Code

      {LOGOMAP}
      <img usemap="#logomap" src="{LOGOURL*}" title="{HEADER_TEXT*}" alt="{HEADER_TEXT*}" />
   {$SET,BANNER,{$BANNER}} {$,This is to avoid evaluating the banner parameter twice}
   {+START,IF_NON_EMPTY,{$GET,BANNER}}
      <div class="global_banner" style="text-align: {!en_right}">{$GET,BANNER}</div>
   {+END}
<div class="standardbox_curved" style="width: 10%">
         <div class="standardbox_curved_title_left">

         <div class="standardbox_curved_title_right">
            <h4 class="standardbox_title_curved" >admin zone</h4>
         </div>
         </div>
</div>
<div class="standardbox_curved" style="width: 10%">
         <div class="standardbox_curved_title_left">

         <div class="standardbox_curved_title_right">
            <h4 class="standardbox_title_curved">admin zone</h4>
         </div>
         </div>
</div>
That code does make the tabs how ever they are not to the right of the logo and They are on top of eachother. I want them side by side.

I could fix the problem by putting them into a table but I wish to avoid that.
 

I run http://otakuplayground.com and am hopping to make themes and other things for ocportal even though I no longer use it for otakuplayground.com I still love it and feel it could go far with the right help. It needs themes and needs people to advertise for it.
Back to the top
 
Posted
Rating:
#25016
Avatar

Community saint

I am getting closer. this is what it looks like now.

Code

<div class="global_top">
      {LOGOMAP}
      <img usemap="#logomap" src="{LOGOURL*}" title="{HEADER_TEXT*}" alt="{HEADER_TEXT*}" />
   {$SET,BANNER,{$BANNER}} {$,This is to avoid evaluating the banner parameter twice}
   {+START,IF_NON_EMPTY,{$GET,BANNER}}
      <div class="global_banner" style="text-align: {!en_right}">{$GET,BANNER}</div>
   {+END}
<br class="float_passer" />
<div class="standardbox_curved" style="width: 100px; float: right">
<div class="standardbox_curved_title_left">         
<div class="standardbox_curved_title_right ">
            <h4 class="standardbox_title_curved" >admin zone</h4>
         </div>
         </div>
</div>
<div class="standardbox_curved" style="width: 100px; float: right">
         <div class="standardbox_curved_title_left">

         <div class="standardbox_curved_title_right">
            <h4 class="standardbox_title_curved">admin zone</h4>
         </div>
         </div>
</div>
</div>
<br class="float_passer" />
The only problem with that is Its not showing up where it used to.
I want it inline with the logo how ever it is not.

I run http://otakuplayground.com and am hopping to make themes and other things for ocportal even though I no longer use it for otakuplayground.com I still love it and feel it could go far with the right help. It needs themes and needs people to advertise for it.
Back to the top
 
Posted
Rating:
#25017
Avatar

Community saint

Holly krap I did it.
Now to show my mom as I got the idea from her as she wants it on her site.
 :lol:
The only problem I see with how I set up the top is people are going to have touble adding thier zones.
This code will have to be added to every zone a person wishes to add.

Code

<div class="standardbox_curved" style="width: 100px; float: right">
         <div class="standardbox_curved_title_left">

         <div class="standardbox_curved_title_right">
            <h4 class="standardbox_title_curved">admin zone</h4>
         </div>
         </div>
</div>
All that would need to be changes is where it says admin zone which should be made into a link and if it is for staff only the code for staffs will have to mannually be added.

I was thinking maybe creating a new template that has All off that code above in it and can be called apone just like that panel or curved template.
Or some thing that will add a box like that every time a new zone is made, which I think will be tricky.
This template maybe the most complex I am trying to make.

BTW I do think you for your help cuz your idea will be used in a future theme as it was some thing I was thinking about doing any way and I did wonder how to do that.


Last edit: by amichan

I run http://otakuplayground.com and am hopping to make themes and other things for ocportal even though I no longer use it for otakuplayground.com I still love it and feel it could go far with the right help. It needs themes and needs people to advertise for it.
Back to the top
 
Posted
Rating:
#25024
Avatar

Community saint

I have a new problem as I did figure out how to get it to do what I wanted. One problem though, the tab labled content management is to big and causing issues.
Here is the code I am using.

Code

<div class="global_top">
{$SET,PREVIOUS_ZONE,_false}
<div class="global_zones">
{+START,LOOP,ZONES}
<div class="standardbox_curved" style="width: 120px; float: right">
<div class="standardbox_curved_title_left">         
<div class="standardbox_curved_title_right ">
            <h4 class="standardbox_title_curved" >
                  <a {+START,IF,{$IS_STAFF}}title="{!SPECIAL_CLICK_TO_EDIT#}" onclick="Javascript: if (!window.handleZoneClick) return true; if (!event) event=window.event; return handleZoneClick(this,event,'{CODE*;}');" {+END}{+START,IF,{$NOT,{$GET,PREVIOUS_ZONE}}}accesskey="Z" {+END}href="{$PAGE_LINK*,{CODE}}" class="{$?,{$EQ,{$ZONE},{CODE}},current_zone,non_current_zone}">{TITLE}</a>
         {$SET,PREVIOUS_ZONE,_true}
      </h4>
         </div>
         </div>
</div>{+END}
</div>
      {LOGOMAP}
      <img usemap="#logomap" src="{LOGOURL*}" title="{HEADER_TEXT*}" alt="{HEADER_TEXT*}" />
   {$SET,BANNER,{$BANNER}} {$,This is to avoid evaluating the banner parameter twice}
   {+START,IF_NON_EMPTY,{$GET,BANNER}}
      <div class="global_banner" style="text-align: {!en_right}">{$GET,BANNER}</div>
   {+END}

</div>
<br class="float_passer" />

I run http://otakuplayground.com and am hopping to make themes and other things for ocportal even though I no longer use it for otakuplayground.com I still love it and feel it could go far with the right help. It needs themes and needs people to advertise for it.
Back to the top
 
Posted
Rating:
#25027
Avatar

Community saint

 Hmm there are tabs I do not want on here. Like the docs so people will not like this.
Unless I can find a new way of doing it I will drop this idea for now and wait for 4 and try it again there.
here is what it looks like.
 



Last edit: by amichan

I run http://otakuplayground.com and am hopping to make themes and other things for ocportal even though I no longer use it for otakuplayground.com I still love it and feel it could go far with the right help. It needs themes and needs people to advertise for it.
Back to the top
 
Posted
Rating:
#25032
Avatar

Hopefully this'll filter out the CMS zone…

Code

<div class="global_top">
{$SET,PREVIOUS_ZONE,_false}
<div class="global_zones">
{+START,LOOP,ZONES}
{+START,IF,{$NEQ,{CODE},cms}}
<div class="standardbox_curved" style="width: 120px; float: right">
<div class="standardbox_curved_title_left">         
<div class="standardbox_curved_title_right ">
            <h4 class="standardbox_title_curved" >
                  <a {+START,IF,{$IS_STAFF}}title="{!SPECIAL_CLICK_TO_EDIT#}" onclick="Javascript: if (!window.handleZoneClick) return true; if (!event) event=window.event; return handleZoneClick(this,event,'{CODE*;}');" {+END}{+START,IF,{$NOT,{$GET,PREVIOUS_ZONE}}}accesskey="Z" {+END}href="{$PAGE_LINK*,{CODE}}" class="{$?,{$EQ,{$ZONE},{CODE}},current_zone,non_current_zone}">{TITLE}</a>
         {$SET,PREVIOUS_ZONE,_true}
      </h4>
         </div>
         </div>
</div>{+END}{+END}
</div>
      {LOGOMAP}
      <img usemap="#logomap" src="{LOGOURL*}" title="{HEADER_TEXT*}" alt="{HEADER_TEXT*}" />
   {$SET,BANNER,{$BANNER}} {$,This is to avoid evaluating the banner parameter twice}
   {+START,IF_NON_EMPTY,{$GET,BANNER}}
      <div class="global_banner" style="text-align: {!en_right}">{$GET,BANNER}</div>
   {+END}

</div>
<br class="float_passer" />


Become a fan of ocPortal on Facebook or add me as a friend. Add me on on Twitter.
Was I helpful?
  • If not, please let us know how we can do better (please try and propose any bigger ideas in such a way that they are fundable and scalable).
  • If so, please let others know about ocPortal whenever you see the opportunity.
  • If my reply is too Vulcan or expressed too much in business-strategy terms, and not particularly personal, I apologise. As a company & project maintainer, time is very limited to me, so usually when I write a reply I try and make it generic advice to all readers. I'm also naturally a joined-up thinker, so I always express my thoughts in combined business and technical terms. I recognise not everyone likes that, don't let my Vulcan-thinking stop you enjoying ocPortal on fun personal projects.
  • If my response can inspire a community tutorial, that's a great way of giving back to the project as a user.
Back to the top
 
Posted
Rating:
#25035
Avatar

Community saint

That worked and I did get the docs and other tabs I did not want on there using that same code.
Now I would love to know how to make it autoresize acording to the text size.

I run http://otakuplayground.com and am hopping to make themes and other things for ocportal even though I no longer use it for otakuplayground.com I still love it and feel it could go far with the right help. It needs themes and needs people to advertise for it.
Back to the top
 
Posted
Rating:
#25036
Avatar

You could try removing the "width: 120px; " bit.


Become a fan of ocPortal on Facebook or add me as a friend. Add me on on Twitter.
Was I helpful?
  • If not, please let us know how we can do better (please try and propose any bigger ideas in such a way that they are fundable and scalable).
  • If so, please let others know about ocPortal whenever you see the opportunity.
  • If my reply is too Vulcan or expressed too much in business-strategy terms, and not particularly personal, I apologise. As a company & project maintainer, time is very limited to me, so usually when I write a reply I try and make it generic advice to all readers. I'm also naturally a joined-up thinker, so I always express my thoughts in combined business and technical terms. I recognise not everyone likes that, don't let my Vulcan-thinking stop you enjoying ocPortal on fun personal projects.
  • If my response can inspire a community tutorial, that's a great way of giving back to the project as a user.
Back to the top
 
Posted
Rating:
#25037
Avatar

Community saint

 ya when I do that its puts them one on top of the other and full screen.

I run http://otakuplayground.com and am hopping to make themes and other things for ocportal even though I no longer use it for otakuplayground.com I still love it and feel it could go far with the right help. It needs themes and needs people to advertise for it.
Back to the top
 
Posted
Rating:
#25039
Avatar

Community saint

wait I got it, works perfect now.

I run http://otakuplayground.com and am hopping to make themes and other things for ocportal even though I no longer use it for otakuplayground.com I still love it and feel it could go far with the right help. It needs themes and needs people to advertise for it.
Back to the top
 
Posted
Rating:
#25071
Avatar

Ami gets the world record for most posts in a row ;).

Back to the top
 
Posted
Rating:
#25075
Avatar

Community saint

LOl thanks I am sorry about that every time I thought of some thing new or tried some thing new I posted again.
I did figure it out.
Like most of my friends will tell you I do not give up very easy when I want to do some thing.

I run http://otakuplayground.com and am hopping to make themes and other things for ocportal even though I no longer use it for otakuplayground.com I still love it and feel it could go far with the right help. It needs themes and needs people to advertise for it.
Back to the top
 
Posted
Rating:
#38651
Avatar

Community saint

Sorry to keep digging up old nuggets! How would I extend this behaviour and display to the zone_menu?

"no violence, no hate, no pain, no enemies
just peace, unity, tolerance and love" - The Beloved

OCP V7 | Advocating monetary reform - FreeOurMoney

Need OCP friendly hosting? Look no further:
Web Hosting, Reseller Hosting, and Dedicated Servers w/cPanel - Elief! - Official hosting partner for ocPortal.
Back to the top
 
1 guests and 0 members have just viewed this: None
Control functions:

Quick reply   Contract

Your name:
Your message: