1. This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn More.

css class conditional

Discussion in 'Styling and Customization Questions' started by MsJacquiiC, Sep 25, 2012.

  1. MsJacquiiC

    MsJacquiiC Well-Known Member

    Say for instance I need to code a conditional within a div css class.
    If logged in = this class --- If logged out = this class. Something like such:

    <div class="this-if-registered" // "this-if-guest">

    Wish I could explain it better. Hopefully someone can follow the above.
    Is this possible?

    J.
     
  2. MagnusB

    MagnusB Well-Known Member

    HTML:
    <div class="<xen:if is="{$visitor.user_id}">registered-class <xen:else />guest-class</xen:if>"
    I think something like that would work, have not tested it though.
     
    MsJacquiiC and Chris D like this.
  3. Chris D

    Chris D XenForo Developer Staff Member

    Curly conditionals are good for this.

    {xen:if '{$condition}', 'action_if_true', 'action_if_false'}

    So...

    <div class="{xen:if '{$visitor.user_id}', 'registered-class', 'guest-class'}">
     
  4. MagnusB

    MagnusB Well-Known Member

    ^ Simpler.....
     
    Chris D likes this.
  5. Chris D

    Chris D XenForo Developer Staff Member

    Yeah totally the same result, but less typing :p
     
    Shelley likes this.
  6. MagnusB

    MagnusB Well-Known Member

    I don't type, I CTRL+V.....
     
    Shelley likes this.
  7. MsJacquiiC

    MsJacquiiC Well-Known Member

    Thanks so much for the assistance guys.

    I think I tried this actually, as someone in another thread suggested. It didn't work correctly. Could have totally been a typo though... But this code works wonderfully = Thanks Chris! ;)

    J.
     
  8. Russ

    Russ Well-Known Member

    You could also create like a "customguest.css" then throw a conditional in page_container to call the stylesheet if they're a guest. This way instead of individually editing single divs, you put all of them in one style sheet.
     
    MsJacquiiC likes this.
  9. MsJacquiiC

    MsJacquiiC Well-Known Member

    Nice idea Russ - I just need a quick conditional though, as one of the ads I'm showing to guests only was overlapping the content area. So I had to adjust the min-height attribute only for the message template. Thanks again ya'll!

    J.
     
    Chris D likes this.
  10. Arty

    Arty Well-Known Member

    No need to include extra css file, you can use .LoggedIn to separate css rules for guests and registered users:
    Code:
    .whatever { for guests; }
    .LoggedIn .whatever { for registered users; }
     
    MagnusB and Chris D like this.
  11. MagnusB

    MagnusB Well-Known Member

    ^ Even simpler....
     

Share This Page