jfb-generaluse-profile-portals [Jcink.com Wiki]

JFB >> General Use >> Profile Portals

Profile portals are a style of profile on JFB that one can enable to give users a “social networking” type of profile. It includes more data than the default profiles and gives a lot more information about the user in the general, such as:

  • Latest visitors to their profile
  • Their friends list - who is their friend on the board
  • Comments - and others can comment
  • Topics - Their 5 latest topics
  • Posts - Their 5 latest posts
  • Video - If allowed, members can insert their favorite youtube video
  • Music - If allowed, members can insert links to music of their choice

Usage

To start using, visit AdminCP » System Settings » User Profiles » and set “Enable personal 'portal' style profile?” to Yes. The change instantly takes effect. The settings for the profiles are customized per-user. This is done by viewing their own profile, and clicking the Settings tab. Options include:

  • Comment control
  • Friend control
  • Notifications
  • Display amounts for friends, comments, and last visitors

Music and Video

If you have profile music and videos enabled already on your board, the video and music tab will pop up on the profile. If they have content, it will show it when clicked. Unlike the classic style profile, the video and music abilities have been expanded. By separating by commas, members can have MULTIPLE Youtube videos and music. Let them know this in the description of the custom profile field.

You may also need to expand, or limit the character count for those fields if you do not want members to have many songs or videos in their profile. 1000 is a good number to have for both fields, though not required.

Customization

Like most everything else on the board, the profiles have been designed to blend with your current skin using existing elements. However, ONE part of the system introduces a NEW elements.

TWO new css elements had to be created. They are: .opentab and .closedtab. They are logically named, .opentab is for open css and .closedtab is for when a tab is closed or out of focus.

In an attempt to cope with all existing skins that do not have these elements, they are automatically generated by the system and added for you, by drawing the image and font information from the CSS element .maintitle. The guessing is not always perfect. The system will try to use your skin maintitle data to put together a likely match, and this works to a degree on a majority of skins. It is, however, impossible to make it perfect for ALL setups, especially more complicated skins, in particular, ones with three-piece maintitles.

If you find the automatic generation is simply not working out for one of your skins, or you just feel like customizing the tabs yourself the solution is simple. Add these to your stylesheet (they are the defaults from the support forum):

.opentab {
color: #FFF;
padding:8px;float: left; width: auto;
background-image: url(http://support.b1.jcink.com/html/store/icons/support/barcopy.png);
margin-top:3px;font-size:10px;
border:  #545454 1px solid;
}

.closedtab {
color: #FFF;
padding:8px;float: left;width: auto;
background-image: url(http://support.b1.jcink.com/html/store/icons/support/barcopy.png);
margin-top:4px;font-size:10px;
border:  #545454 1px solid;
}

Your customization will now over-ride the system's. Edit the CSS like you would any other element to change the tabs design.

There is another bit of CSS to take into consideration called .positiontab. This can help you position your tabs in a way that won't override the maintitles or other content. This is an example piece that we use on the support board:

.positiontab { 
height: 34px; margin-left: 2px;
}

You can use this and adjust it if the tabs just aren't lining up right with your maintitle.

Resolutions and Skinny-width skins

The profiles need at least 1024×786 resolution to look good. 800×600 users will see it bulge out of the window. There is too much information, and the tabs may become misaligned. It should also be noted that if your skin has a skinny fixed width, you will run into this problem, and you must enlarge your skin width.

External Links

 
jfb-generaluse-profile-portals.txt · Last modified: 2010/11/12 01:15 by jcink