1. This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn More.
  2. This forum is for release discussion only. Discussions that do not relate specifically to the resource release should be discussed in another, more appropriate forum.
    Dismiss Notice
  3. This forum has been archived. New threads and replies may not be made. All add-ons/resources that are active should be migrated to the Resource Manager. See this thread for more information.

[XenFans] Let's get started .. (for 0 posters) [Template Modification]

Discussion in 'Template Modifications [Archive]' started by Floris, Jan 28, 2011.

Thread Status:
Not open for further replies.
  1. Floris

    Floris Guest

    [XenFans] Let's get started .. (for 0 posters) [Template Modification]

    With this little template modification we want to demonstrate how to customize the end-user experience on your site. We're using it on http://xenfans.com/ for new guests and newly registered members who are about to register or have just confirmed their account, (and have 0 posts); Inviting them to introduce themselves via a new thread, to upload an avatar or to complete their profile settings. You could use it on your site for the same reasons, or perhaps to point them to the forum help page, or contact sales, etc.

    To demonstrate what a minute of customizing can do, here's the xenfans.com version :

    Guests:
    Screen shot 2011-01-29 at 3.07.23 PM.png

    Confirmed / registered members:
    Screen shot 2011-01-29 at 3.07.13 PM.png


    What does the xenfans.com version do?
    - user is NOT logged in, or unregistered, gets a block with sign-up or login buttons, which drop down the login bar in the top. This is also a great place to explain what the board is about.
    - user is registered, but didn't confirm email: default xenforo 'activate account' msg
    - user is registered, but has 0 posts: gets invited to introduce him/herself msg
    - user is registered, but regardless of post count, gets invited to set a gender, and/or upload avatar ~ depending if they have one or not.

    It requires 1 template modification (and some css), and respects your customized design, replacing the 'your account is waiting confirmation' once confirmed with 'thank you for signing up, lets get started..' (or whatever you want to use as text). And guests will be introduced to the board.

    For demo purpose, it does not use phrases. It's quite easy to add a phrase yourself if your community has more than one language. And if you just have one international language, manually change the text.

    Anyway, let's get started.

    We're going to address the registered user, who is not waiting account confirmation, and has exactly zero posts, with an important message. And a link to an end-goal, in this case a "new thread" creation page where they can introduce themselves.

    Obviously what you need to do is change that end-goal with the link + text of your own choice.

    Step one, go to the admin.php > appearance > templates > PAGE_CONTAINER > and find this code:
    Code:
    <!-- top breadcrumb, top ctrl -->
    and above it on a new line add this code:
    Code:
    <xen:if is="!{$isAwaitingEmailConfirmation} AND {$visitor.user_id} AND {$visitor.message_count} == 0">
    							<p class="importantMessage" style="line-height: 1.6em;">
    								Thank you for signing up {$visitor.username}, and welcome to {$xenOptions.boardTitle}.
    								<br /><span class="xenfans_welcome"><a href="{xen:link forums/offtopic/create-thread}" class="concealed">Let's get started by Introducing yourself ...</a></label></span>
    								</p>
    						</xen:if>
    						<xen:if is="!{$isAwaitingEmailConfirmation} AND {$visitor.user_id}">
    							<xen:if is="{$visitor.avatar_date} == 0 AND !{$visitor.gravatar} OR !{$visitor.gender}">
    							<p class="importantMessage" style="line-height: 1.6em;">
    								We invite you to personalize and complete your profile :) <br />
    								<xen:if is="{$visitor.avatar_date} == 0 AND !{$visitor.gravatar}">
    									<span class="xenfans_welcome"><a href="{xen:link account/avatar}" class="OverlayTrigger" class="concealed">Upload avatar ..</a></label></span>
    								</xen:if>
    								<xen:if is="!{$visitor.gender}">
    									<span class="xenfans_welcome"><a href="{xen:link account/personal-details}" class="concealed">Select Gender ..</a></label>
    								</xen:if>
    							</p>
    							</xen:if>
    						</xen:if>
    						<xen:if is="!{$visitor.user_id} AND {$controllerName} != 'XenForo_ControllerPublic_Register'">
    							<p class="importantMessage" style="line-height: 1.6em;">
    							<b>Welcome to {$xenOptions.boardTitle}!</b><br />
    							You're currently viewing our site as a guest user. <span class="xenfans_welcome"><label for="LoginControl"><a href="{xen:link login}" class="concealed">Sign up</a></label></span> or <span class="xenfans_welcome"><label for="LoginControl"><a href="{xen:link login}" class="concealed">Login</a></label></span><br />
    							 Having an account grants you additional privileges, such as creating-, and participating in discussions.
    							</p>
    						</xen:if>
    and save the template.

    Step two, still in the same template, find the newly added code:
    Code:
    <a href="{xen:link forums/offtopic/create-thread}">Let's get started by Introducing yourself ...</a>
    and replace the LINK and the TEXT to your own site's introduction forum or whatever you want to do with it. Optionally you can replace everything within <p> .. </p> with whatever you want, youtube embed to show site-training video, images, custom menu, donation button or a flower.

    Of course, go through all the text and links, so it matches your board. Then Save the template.

    Step three: to extra.css, add:
    Code:
    .xenfans_welcome {
    padding: 3px 6px;
    border: 1px solid @primaryLight;
    border-radius: 3px;
    background: @primaryLighterStill url('@imagePath/xenforo/gradients/tab-unselected-25px-light.png') repeat-x top;
    text-align: center;
    font: 11px verdana,sans-serif;
    text-decoration: none;
    color: @primaryMedium;
    text-shadow: 1px 1px 0px #fff;
    outline: 0;
    }
    Save the template again, and go test! It should not show to users with a post. Nor should it show to users who are newly registered but haven't confirmed their account yet via email. It should show to users with 0 posts, and a confirmed account.

    Check out the XenFans.com "XenForo Resources" section for more tips/tweaks, guides, documentation, addons and styles.

    Check out the XenFans.com "XenForo Resources" section for more tips/tweaks, guides, documentation, addons and styles.

    Support for this thread can be found here: http://xenfans.com/threads/xenfans-lets-get-started-for-0-posters-template-modification.481/
     
  2. kkm323

    kkm323 Well-Known Member

    thank a lot for the template edit its quite useful
    I am also looking for messages that can appear once and/or messages that can identify users who have not completed their Personal Details
     
  3. Peggy

    Peggy Well-Known Member

    VERY nice. Good job Floris.
     
    Floris likes this.
  4. Floris

    Floris Guest

    I think I can do the latter, I just need free time to write it out and test it and release it.
    Just extend the conditional with additional conditionals nested that check for other fields:

    gender (is empty? doesn't have one)
    avatar_date and gravatar (if 0 or empty on both, doens't have one)

    Since profile details are a different table, I do not know if those details are available.
     
    kkm323 likes this.
  5. Floris

    Floris Guest

    Ok, done. First post updated.
     
  6. EQnoble

    EQnoble Well-Known Member

    Nice stuff here Floris...thanks for the share.
     
    Floris likes this.
  7. Floris

    Floris Guest

    The XenFans.com version is published here: #3 on xfans
    Screen shot 2011-01-29 at 8.44.14 AM.png
     
    Skeletor likes this.
  8. Sador

    Sador Well-Known Member

    Nice.
     
    Floris likes this.
  9. Floris

    Floris Guest

    Some forums use an introduction forum. Others use it to generate activity and find out who are spammers and real users, others do not use it. The code is easy to change.

    I do not have an introduction forum on xenfans. Introduction threads are published in the offtopic board.

    This is a template modification, not an add-on really. It is 1 template edit and 1 css template edit. You can change the submitted code yourself completely.

    This is completely free, available to all xenforo and xenfans customers.
     
    erich37 likes this.
  10. Floris

    Floris Guest

    Update: (first post has the code that we use on xenfans now)

    For guests:
    Mikey's contribution of showing an introduction text to guest members, and a sign up link, revamped:
    Introduction text is there, sign up and log-in buttons created, which when js is disabled to go the right page and when js is enabled slide down the top login_bar (just like the sign up button in the side bar).

    For members:
    The invitation to update the profile (select a gender) and to upload an avatar (or gravatar) are now buttons as well, and the avatar when js disabled goes to the avatar upload page, and when js is enabled now lets you in-line edit the avatar/gravatar. The avatar and profile update is now a separate block, so it shows to all members, not just 0 posters. You can easily extend the conditional to say : only show to users with 5 posts or less .. so long term members aren't being spammed with useless box.

    And additional variables are used to make the message more personal - and to adapt to the board's name; lowering the amount of edits you have to do.

    The first post is updated on xenfans, as well as here. Feel free to report bugs or ask for support. The main thread for this is linked in the first post at the bottom.

    Thanks Miko & Mikey for bit of help and the contributions. If this escalates into something more interesting due to additional contributions I might make some admin options, a custom template if there's a hook in page_container to use, and move it into a product .xml - but at the moment I think this is too simple, too small.

    So keep those contributions coming :)
     
    EQnoble likes this.
  11. A.E.

    A.E. Member

    /styles/default/xenforo/gradients
     
  12. A.E.

    A.E. Member

    hi Floris. Great stuff! ...but: [​IMG]

    I get the following XF-message:
    The following error occurred
    The server responded with an error. The error message is in the console.

    What have I done?
    1. Sign up
    2. Click at the button / link "Select Gender .."
    3. Select the Gender "Male" (it was "(unspecified)")
    4. Click at the button "Save"

    Click at the button "Save" again, and no error-message occurred.

    On your site. On my site. I don't know why. The link seams to be ok. Any idea? [​IMG]

    Gruß, Albert. [​IMG]
     
  13. Floris

    Floris Guest

    Create a new forum, go to the forum to edit it, the location bar has the ID. Update the slur to it to be unique, without spaces, or use the unique ID. Update the a href link accordingly.
     
  14. Floris

    Floris Guest

    This is a known issue to me, but I have no idea if this is an error with RC1, or just my code, or something else. If someone knows the solution let me know and I will update.
     
  15. Floris

    Floris Guest

    An alpha build of this runs on my development server, but I am too new to making add-ons. I have the phrases, the templates, the options, etc. I just have to make it work together with each other.
     
  16. Floris

    Floris Guest

    Please note if you change an image provided and in use by xenforo, it changes it everywhere where css uses it. Back up first.
     
  17. Floris

    Floris Guest

    I simply do not know how to get admin Options from an addon to be usable in a template for if conditionals.

    If someone wants to do that, here's the alpha build of the plugin. It has basic phrases, custom template, and admin options. The phrases are being used, and the templates are used by adding a new line above <!-- top breadcrumb, top ctrl --> in page_container:

    <xen:require css="xenfansWelcome.css" />
    <xen:include template="xenfansWelcome "/>

    ignoring the install steps in post 1 of this thread, do the above step, and import the .xml - and it should work.

    If you don't know what you're doing, don't use this add-on just yet.

    Feel free to make modifications (improvements) and re-post your .xml version in a .zip
     

    Attached Files:

    Vodkaholic, Mikey and EQnoble like this.
  18. Floris

    Floris Guest

    The fields in the dropdown are default in xenforo, nothing I can do about that.

    The suggestion to link it to register/ is great, I will update it in the internal build.
     
    EQnoble likes this.
  19. Floris

    Floris Guest

    Change the first link that points to login from login to register
    Unless custom code is used to check other tables and get additional data, I doubt other profile data can be checked against. If someone is able to do this with the alpha plugin, feel free to post a contribution.
     
  20. gmaister22

    gmaister22 Active Member

    great man i love it!!!


    although i need some help to change the font color here
    [​IMG]

    the background fonts are too white (also Upload avatar)
     
Thread Status:
Not open for further replies.

Share This Page