Built-in Module Positions

From JomSocial 1.6 forward, you can insert Joomla modules into any part of the JomSocial template. This will allow you to have greater flexibility in customizing the look and feel of JomSocial to your own liking.

Module Position Lists

We categorize module positions to 3 classes.

  1. Global - One position that is shown on various different pages
  2. Page specific - These positions will only show on certain JomSocial pages
  3. Only Mine - These module positions are only available on the profile page and are show to the owner of a profile

Global Positions

  1. js_side_top - Placed on top of the side column (sidebar) of Frontpage, Profile, Groups and Events Pages.
  2. js_side_bottom - Same as js_side_top except that is placed on the bottom of the sidebar.

Profile Positions

On profile page, all Global Positions are available as well as

  1. js_profile_top - Placed between the Toolbar and the Profile Page.
  2. js_profile_mine_top - Placed between the Toolbar and the Profile Page only for the profile owner
  3. js_profile_feed_top - Placed before the Activity Stream section of the Profile Page.
  4. js_profile_feed_bottom - Placed after the Activity Stream section of the Profile Page.
  5. js_profile_side_top - Placed before any JomSocial content on the side column of Profile Page and after js_side_top.
  6. js_profile_mine_side_top - Only shown to the owner of aprofile on top of the side column
  7. js_profile_mine_side_bottom - Shown only to the owner of a profile at the bottom of side column
  8. js_profile_side_bottom - Placed after any JomSocial content on the side column of the Profile Page and before js_side_bottom.
  9. js_profile_mine_bottom - Placed at the bottom of the profile page and visible only for profile owner
  10. js_profile_bottom - Placed at the bottom of Profile Page.

Groups Positions

All global positions are available on the individual group page and there are two more additional positions you can use

  1. js_groups_side_top - Placed before any JomSocial content on the side column of the Groups Page and after js_side_top.
  2. js_groups_side_bottom - Placed after any JomSocial content on the side column of the Groups Page and before js_side_bottom.

Events Positions

All Global Positions are available on Event Page as well as two more

  1. js_events_side_top - Shown at the top of the side column in events page
  2. js_events_side_bottom - Shown at the bottom of the side column in events page

Frontpage Positions

All global positions are available on this page. In addition, you can use one more position

  1. JomSocial 4 js_side_frontpage_top - Top frontpage position. On clean installation will show Members and Who's Online modules.
  2. js_side_frontpage - Middle frontpage position. On clean installation will show Photos and Videos module.
  3. JomSocial 4 js_side_frontpage_bottom - Bottom frontpage position. On clean installation will show Group and Event modules

No Access Page

No access page features two module positions only

  1. js_noaccess_top - Shown at the top of the page
  2. js_noaccess_bottom Shown at the bottom of the page

Stacked Positions

Since 4.0.2: A new set of stacked module positions have been added. Simply add "_stacked" at the end of available position name and publish the modules in it

Example:

  • js_side_top - will display modules in tabs
  • js_side_top_stacked - will display modules stacked on top of each other

How to Insert a Module into JomSocial?

In the Joomla Administrator Backend, go to Module Manager (Extensions > Module Manager). On the Module Manager page, you can either create a new module or select an existing module you would like to place in JomSocial. In the Edit Module page, under the Details field set, there is a parameter called Position. Manually enter the name of the module position (you may refer to the list of built-in module positions above). Click Save and your module will appear in your desired area.

Js profile side top.png

Adding Your Own Module Position

You can add your module position name and insert it anywhere within any JomSocial template files. The Code Snippet that does this for tabbed module layout is:

<div class="joms-module__wrapper"><?php $this->renderModules('PositionName'); ?></div>


While for the stacked layout you would use:

<div class="joms-module__wrapper--stacked"><?php $this->renderModules('PositionName_stacked'); ?></div>


Module Positions in the Templates

NOTE: The images show the JomSocial 3.2 layout which might differ in JomSocial 4

This is the overview of Module Positions within the JomSocial Component:

Frontpage

Frontpage.jpg

Profile

Profilepage.jpg

Group

Grouppage.jpg

Event

Eventpage.jpg

No Access

Modulepositionnoaccess.png

Module Class Suffix

Alert-trash.png

Support for this feature is deprecated or ceased
This is an old feature that will either be, or it is already removed. You are strongly advised not to use this feature in current version of JomSocial as it's functionality have not been tested, and might not even exist.


If you want your modules to look like the rest of the JomSocial boxes, you can use these Module Suffixes:

  • For jomSocial 2.6 and below - " cModule"
  • For jomSocial 2.8 till JomSocial 3.2.1 - " app-box'
Note: Add module sufixes without quotes, but with white space in the name.
Moduleclasssufix.png

Why Module Class Suffix are Removed in JomSocial 4?

Module class suffixes have been used in JomSocial 3.2 and lower because it was the only way for users to style additional modules exactly as other JomSocial template elements so that they blend into design like its outlined on image bellow:

Module suffixes.png

In JomSocial 4 this is not needed anymore because all modules will blend in by default

See Also