Please upgrade here. These earlier versions are no longer being updated and have security issues.
HackerOne users: Testing against this community violates our program's Terms of Service and will result in your bounty being denied.

nothing visible before login?

kpaaxkpaax New
edited September 2012 in Vanilla 2.0 - 2.8

I'm trying to set up forum for a closed group of people which don't want to show their discussions to the external world unless somebody is registered and logged in. Now some things are always visible (category/discussions headers, messages), also menu buttons (discussions/activity). How to get a clean initial forum page before login? Just a login invitation and a main header/banner. Thanks :)

Best Answers

  • KasperKasper Scholar of the Bits Copenhagen Vanilla Staff
    Answer ✓

    You could the SMARTY tag

    {if $User.SignedIn}
        ...
    {/if}
    

    around the forum content in default.master.tpl and then make a section wrapped in

    {if !$User.SignedIn} <!-- Notice the exclamation mark -->
        ...
    {/if}
    

    that displays a login invitation and/or registration form.

    Kasper Kronborg Isager (kasperisager) | Freelance Developer @Vanilla | Hit me up: Google Mail or Vanilla Mail | Find me on GitHub

  • KasperKasper Scholar of the Bits Copenhagen Vanilla Staff
    edited September 2012 Answer ✓

    Not a programmer? You're doing perfectly fine so far, you shouldn't have any problems with what we're about to do! Great job noticing that the default.master.tpl file is missing from the default theme - this is exactly the file we need to change once we're created it (don't worry about this now though). First off, you want to make a copy of the default theme though so you don't alter it directly. Simply duplicate the folder, give it a new name and change the info in about.php to reflect your own name as well as the name you've chosen for the custom theme (something like Baseline Child is perfectly fine). When you've done all this we'll continue with further customizations.

    P.S.: When editing about.php, be sure to change $ThemeInfo['default'] to reflect the name of your new custom theme.

    Kasper Kronborg Isager (kasperisager) | Freelance Developer @Vanilla | Hit me up: Google Mail or Vanilla Mail | Find me on GitHub

  • KasperKasper Scholar of the Bits Copenhagen Vanilla Staff
    Answer ✓

    Perfect! Now you'll need to create the default.master.tpl file and put it in the views directory (might not be there, if so just create it) of your custom theme. Open the file and put this inside of it:

    <!DOCTYPE html>
    <html>
        <head>
            {asset name="Head"}
        </head>
        <body id="{$BodyID}" class="{$BodyClass}">
            <div id="Frame">
                <div id="Head">
                    <div class="Menu">
                        <h1><a class="Title" href="{link path="/"}"><span>{logo}</span></a></h1>
                        <ul id="Menu">
                            {dashboard_link}
                            {discussions_link}
                            {activity_link}
                            {inbox_link}
                            {custom_menu}
                            {profile_link}
                            {signinout_link}
                        </ul>
                        <div class="Search">
                            {searchbox}
                        </div>
                    </div>
                </div>
                <div id="Body">
                    <div id="Content">
                        {asset name="Content"}
                    </div>
                    <div id="Panel">
                        {asset name="Panel"}
                    </div>
                </div>
                <div id="Foot">
                    <a href="{vanillaurl}" class="PoweredByVanilla" title="Community Software by Vanilla Forums">Powered by Vanilla</a>
                    {asset name="Foot"}
                </div>
            </div>
            {event name="AfterBody"}
        </body>
    </html>
    

    Now wrap whatever you'd like hidden when a user is logged out in {if $User.SignedIn} and whatever you'd like hidden when the user is logged in in {if !$User.SignedIn} like this:

    <!DOCTYPE html>
    <html>
        <head>
            {asset name="Head"}
        </head>
        <body id="{$BodyID}" class="{$BodyClass}">
            <div id="Frame">
                <div id="Head">
                    <div class="Menu">
                        <h1><a class="Title" href="{link path="/"}"><span>{logo}</span></a></h1>
                        <ul id="Menu">
                            <!-- Hide the menu unless user is logged in -->
                            {if $User.SignedIn}
                                {dashboard_link}
                                {discussions_link}
                                {activity_link}
                                {inbox_link}
                                {custom_menu}
                                {profile_link}
                            {/if}
                            <!-- Show sign in/out link at all times -->
                            {signinout_link}
                        </ul>
                        <!-- Hide the search box unless user is logged in -->
                        {if $User.SignedIn}
                            <div class="Search">
                                {searchbox}
                            </div>
                        {/if}
                    </div>
                </div>
                <div id="Body">
                    <!-- Hide all content unless user is logged in -->
                    {if $User.SignedIn}
                        <div id="Content">
                            {asset name="Content"}
                        </div>
                        <div id="Panel">
                            {asset name="Panel"}
                        </div>
                    {/if}
                    <!-- Show stuff when user is logged out -->
                    {if !$User.SignedIn}
                        <div class="LoggedOut" id="Content">
                            <!-- Your special stuff goes in here -->
                        </div>
                    {/if}
                </div>
                <div id="Foot">
                    <a href="{vanillaurl}" class="PoweredByVanilla" title="Community Software by Vanilla Forums">Powered by Vanilla</a>
                    {asset name="Foot"}
                </div>
            </div>
            {event name="AfterBody"}
        </body>
    </html>
    

    The new container I've added is <div class="LoggedOut" id="Content"/>. You can put stuff like login forms and/or invitations inside this and it will only show up for users who aren't logged in. You can style it like this:

    #Cotent.LoggedOut {
        width: 100%;
        // Other rules here
    }
    

    Remember that all custom CSS declarations must go inside custom.css in the themes design directory. Again, if the file isn't there simply create it.

    Kasper Kronborg Isager (kasperisager) | Freelance Developer @Vanilla | Hit me up: Google Mail or Vanilla Mail | Find me on GitHub

  • KasperKasper Scholar of the Bits Copenhagen Vanilla Staff
    Answer ✓

    Your guess is entirely correct! Everything you put inside the LoggedOut container will only be displayed to users who aren't logged in. If you want to add a sign in form, you can write something like this:

    <div class="MainForm">
        <form id="Form_User_SignIn" method="post" action="{link path="/entry/signin"}">
            <fieldset>
                <label class="UsernameLabel">
                    <span>Username or email</span>
                    <input type="text" id="Form_Email" name="Form/Email" value="" class="InputBox">
                </label>
                <label class="PasswordLabel">
                    <span>Password</span>
                    <input type="password" id="Form_Password" name="Form/Password" value="" class="InputBox Password">
                </label>
            </fieldset>
            <fieldset class="RememberMe">
                <label for="SignInRememberMe" class="CheckBoxLabel chechkbox">
                    <input type="checkbox" id="SignInRememberMe" name="Form/RememberMe" value="1" checked="checked">
                    <input type="hidden" name="Checkboxes[]" value="RememberMe">
                    <span>Remember me</span>
                </label>
                <input type="submit" id="Form_SignIn" name="Form/Sign_In" value="Sign In" class="Button">
            </fieldset>
            <p class="CreateAccount">
                <a href="{link path="/entry/signin"}">Forgot password?</a>
                <a href="{link path="/entry/register?Target=%2F"}">Don't have an account?</a>
            </p>
        </form>
    </div>
    

    Kasper Kronborg Isager (kasperisager) | Freelance Developer @Vanilla | Hit me up: Google Mail or Vanilla Mail | Find me on GitHub

  • KasperKasper Scholar of the Bits Copenhagen Vanilla Staff
    edited September 2012 Answer ✓

    Hmmm... Yeah, it looks like

    [...] a clean initial forum page before login? Just a login invitation and a main header/banner

    wasn't entirely what you wanted then... In any event, what you've done so far is exactly what you described: You've got a clean forum page before logging in with a login form and header/banner only. Everything is hidden using PHP conditionals and as such, your forum is pretty much bullet proof unless a user is logged in...

    What you could do instead, is download the "Private Community" add-on from Github and see if that does what you're looking for. You can find it here: https://github.com/vanillaforums/Addons/tree/master/plugins/PrivateCommunity

    Kasper Kronborg Isager (kasperisager) | Freelance Developer @Vanilla | Hit me up: Google Mail or Vanilla Mail | Find me on GitHub

Answers

  • KasperKasper Scholar of the Bits Copenhagen Vanilla Staff
    Answer ✓

    You could the SMARTY tag

    {if $User.SignedIn}
        ...
    {/if}
    

    around the forum content in default.master.tpl and then make a section wrapped in

    {if !$User.SignedIn} <!-- Notice the exclamation mark -->
        ...
    {/if}
    

    that displays a login invitation and/or registration form.

    Kasper Kronborg Isager (kasperisager) | Freelance Developer @Vanilla | Hit me up: Google Mail or Vanilla Mail | Find me on GitHub

  • Thanks @kasperisager for quick answer :) However I need some more details please as I'm not a programmer. I guess you're talking about themes and some changes needed in default.master.tpl, but this is my first doubt: in the "themes" folder I see "default, EmbedFriendly and mobile", then in "default" (didn't change a default theme) there is only "design" folder, no "views". So where is my target default.master.tpl?

  • KasperKasper Scholar of the Bits Copenhagen Vanilla Staff
    edited September 2012 Answer ✓

    Not a programmer? You're doing perfectly fine so far, you shouldn't have any problems with what we're about to do! Great job noticing that the default.master.tpl file is missing from the default theme - this is exactly the file we need to change once we're created it (don't worry about this now though). First off, you want to make a copy of the default theme though so you don't alter it directly. Simply duplicate the folder, give it a new name and change the info in about.php to reflect your own name as well as the name you've chosen for the custom theme (something like Baseline Child is perfectly fine). When you've done all this we'll continue with further customizations.

    P.S.: When editing about.php, be sure to change $ThemeInfo['default'] to reflect the name of your new custom theme.

    Kasper Kronborg Isager (kasperisager) | Freelance Developer @Vanilla | Hit me up: Google Mail or Vanilla Mail | Find me on GitHub

  • OK, thank you. Done :)
    Now I need to be off for few hours, so will continue with your instructions when I'm back...

  • KasperKasper Scholar of the Bits Copenhagen Vanilla Staff
    Answer ✓

    Perfect! Now you'll need to create the default.master.tpl file and put it in the views directory (might not be there, if so just create it) of your custom theme. Open the file and put this inside of it:

    <!DOCTYPE html>
    <html>
        <head>
            {asset name="Head"}
        </head>
        <body id="{$BodyID}" class="{$BodyClass}">
            <div id="Frame">
                <div id="Head">
                    <div class="Menu">
                        <h1><a class="Title" href="{link path="/"}"><span>{logo}</span></a></h1>
                        <ul id="Menu">
                            {dashboard_link}
                            {discussions_link}
                            {activity_link}
                            {inbox_link}
                            {custom_menu}
                            {profile_link}
                            {signinout_link}
                        </ul>
                        <div class="Search">
                            {searchbox}
                        </div>
                    </div>
                </div>
                <div id="Body">
                    <div id="Content">
                        {asset name="Content"}
                    </div>
                    <div id="Panel">
                        {asset name="Panel"}
                    </div>
                </div>
                <div id="Foot">
                    <a href="{vanillaurl}" class="PoweredByVanilla" title="Community Software by Vanilla Forums">Powered by Vanilla</a>
                    {asset name="Foot"}
                </div>
            </div>
            {event name="AfterBody"}
        </body>
    </html>
    

    Now wrap whatever you'd like hidden when a user is logged out in {if $User.SignedIn} and whatever you'd like hidden when the user is logged in in {if !$User.SignedIn} like this:

    <!DOCTYPE html>
    <html>
        <head>
            {asset name="Head"}
        </head>
        <body id="{$BodyID}" class="{$BodyClass}">
            <div id="Frame">
                <div id="Head">
                    <div class="Menu">
                        <h1><a class="Title" href="{link path="/"}"><span>{logo}</span></a></h1>
                        <ul id="Menu">
                            <!-- Hide the menu unless user is logged in -->
                            {if $User.SignedIn}
                                {dashboard_link}
                                {discussions_link}
                                {activity_link}
                                {inbox_link}
                                {custom_menu}
                                {profile_link}
                            {/if}
                            <!-- Show sign in/out link at all times -->
                            {signinout_link}
                        </ul>
                        <!-- Hide the search box unless user is logged in -->
                        {if $User.SignedIn}
                            <div class="Search">
                                {searchbox}
                            </div>
                        {/if}
                    </div>
                </div>
                <div id="Body">
                    <!-- Hide all content unless user is logged in -->
                    {if $User.SignedIn}
                        <div id="Content">
                            {asset name="Content"}
                        </div>
                        <div id="Panel">
                            {asset name="Panel"}
                        </div>
                    {/if}
                    <!-- Show stuff when user is logged out -->
                    {if !$User.SignedIn}
                        <div class="LoggedOut" id="Content">
                            <!-- Your special stuff goes in here -->
                        </div>
                    {/if}
                </div>
                <div id="Foot">
                    <a href="{vanillaurl}" class="PoweredByVanilla" title="Community Software by Vanilla Forums">Powered by Vanilla</a>
                    {asset name="Foot"}
                </div>
            </div>
            {event name="AfterBody"}
        </body>
    </html>
    

    The new container I've added is <div class="LoggedOut" id="Content"/>. You can put stuff like login forms and/or invitations inside this and it will only show up for users who aren't logged in. You can style it like this:

    #Cotent.LoggedOut {
        width: 100%;
        // Other rules here
    }
    

    Remember that all custom CSS declarations must go inside custom.css in the themes design directory. Again, if the file isn't there simply create it.

    Kasper Kronborg Isager (kasperisager) | Freelance Developer @Vanilla | Hit me up: Google Mail or Vanilla Mail | Find me on GitHub

  • Great!!! I did it! :-))))) Thanks a lot @kasperisager !!!
    I used the second template and now before login I can see only banner, login link and "Powered by Vanilla" in the middle. This is almost everything needed except registration form and some invitation maybe. My guess is that something needs to go into the new "Looged Out" container, but don't know what exactly? (I really have only a foggy idea of what I'm playing with here...)

  • KasperKasper Scholar of the Bits Copenhagen Vanilla Staff
    Answer ✓

    Your guess is entirely correct! Everything you put inside the LoggedOut container will only be displayed to users who aren't logged in. If you want to add a sign in form, you can write something like this:

    <div class="MainForm">
        <form id="Form_User_SignIn" method="post" action="{link path="/entry/signin"}">
            <fieldset>
                <label class="UsernameLabel">
                    <span>Username or email</span>
                    <input type="text" id="Form_Email" name="Form/Email" value="" class="InputBox">
                </label>
                <label class="PasswordLabel">
                    <span>Password</span>
                    <input type="password" id="Form_Password" name="Form/Password" value="" class="InputBox Password">
                </label>
            </fieldset>
            <fieldset class="RememberMe">
                <label for="SignInRememberMe" class="CheckBoxLabel chechkbox">
                    <input type="checkbox" id="SignInRememberMe" name="Form/RememberMe" value="1" checked="checked">
                    <input type="hidden" name="Checkboxes[]" value="RememberMe">
                    <span>Remember me</span>
                </label>
                <input type="submit" id="Form_SignIn" name="Form/Sign_In" value="Sign In" class="Button">
            </fieldset>
            <p class="CreateAccount">
                <a href="{link path="/entry/signin"}">Forgot password?</a>
                <a href="{link path="/entry/register?Target=%2F"}">Don't have an account?</a>
            </p>
        </form>
    </div>
    

    Kasper Kronborg Isager (kasperisager) | Freelance Developer @Vanilla | Hit me up: Google Mail or Vanilla Mail | Find me on GitHub

  • Thanks for your help and effort in preparing this script. But it looks I messed things up. I thought rather about registration form for those who want to register (btw this setting is changed to admin approval). Without a form above user can click on login link (only), then additional small window appears to login, retrieve password or register/create account. Problem is that now registration is not working, when clicked this new window disappears and nothing happens except the main link in the browser changes and then even normal login doesn't work, link must be reset manually. Can you please check at http://forum.qhht.pl? This is PL locale, so don't worry :) Now default.master.pl is in the version of 56 lines.

  • KasperKasper Scholar of the Bits Copenhagen Vanilla Staff
    edited September 2012 Answer ✓

    Hmmm... Yeah, it looks like

    [...] a clean initial forum page before login? Just a login invitation and a main header/banner

    wasn't entirely what you wanted then... In any event, what you've done so far is exactly what you described: You've got a clean forum page before logging in with a login form and header/banner only. Everything is hidden using PHP conditionals and as such, your forum is pretty much bullet proof unless a user is logged in...

    What you could do instead, is download the "Private Community" add-on from Github and see if that does what you're looking for. You can find it here: https://github.com/vanillaforums/Addons/tree/master/plugins/PrivateCommunity

    Kasper Kronborg Isager (kasperisager) | Freelance Developer @Vanilla | Hit me up: Google Mail or Vanilla Mail | Find me on GitHub

  • Yes, that's what I wanted and it's perfectly ok. I wonder only if it's possible to unlock one more thing before login: the registration form to create a new account. It's not necessary but would be great to have it. Thanks.

  • OK. I assume this thread is over. Very big thank you for your meaningful help @kasperisager! :)

Sign In or Register to comment.