howto_user (howto_user) wrote in s2howto,

[paidaccount] [smooth sailing] Randomized User Pictures

Paid Accounts Only
The following tutorial requires creating and editing a custom style, which in turn requires a paid, permanent, or early adopter account. Please read What are the paid account benefits? and How do I buy a paid account? to learn about the paid account benefits and how to buy a paid account.

This tutorial explains how to randomise user picture which displays in the profile box in the sidebar. The code to do this will override the Page::lay_print_sidebar_profile(). You will need to place the coding in a theme layer. If you already have a theme layer for the Smooth Sailing style, you can edit it to include this code. Otherwise, you need to create one as explained in the Theme Layer tutorial.

You will need to copy the following code into your theme layer, making sure to include everything:

function Page::lay_print_sidebar_profile() {

   var string[] pic;


   var int randpic;
   $randpic = rand(0, ((size $pic) - 1));

      <div class="sideboxContent" id="profile">
        <div><a href="$*SITEROOT/allpics.bml?user=$.journal.username"><img src="$pic[$randpic]" alt="" border="0" class="profile-userpic" /></a></div>
        <div><span class="profile-label">$*text_sidebox_profile_userlabel</span><span class="profile-content">$.journal</span></div>
        <div><span class="profile-label">$*text_sidebox_profile_namelabel</span><span class="profile-content">$</span></div>
        if ($*text_sidebox_profile_info!="") { """<div>"""; print $*text_sidebox_profile_info; """</div>"""; }
       </div> <!--sidebox-profile-->

In the above code, you need to replace (for each) with the user pictures that you'd like to be randomized. Please notice that, though six user pictures are used here, there is no maximum or minimum to the number of user pictures that you can use.

Once you have finished adding the code above, you can save your theme layer by clicking on the "Save & Compile" button at the top of the screen. Your changes will not take effect until you apply your theme layer by selecting it on the Customize Journal page.

Additional References:
  • What are the different S2 layer types?
  • S2 View Types
  • Originally based on coding from dianna_wills, original tutorial written by aajwind. Converted into a Smooth Sailing tutorial by draconid.

    Tags: - smooth sailing, paid accounts only, randomized userpics

    Comments for this post were disabled by the author