Skip to content

Jfusion 2.x Visual Integration Guide

jfusion edited this page Mar 26, 2016 · 1 revision

#Visual Integration Guide Now that you have your user accounts synchronized, you might also want to visually integrate your software with Joomla. As this will give your users a better browsing experience, moving from one software to another while having an integrated look. There are three ways you can achieve this with JFusion:

  • direct links
  • Joomla wrapper
  • frameless integration into the Joomla site

Which one you choose depends on how handy you are with modifying HTML/CSS templates and how many users you have on your site. In this document we will guide you through the different options.

##Direct Links

  • Easy of Setup 2/5 Stars
  • Server Performance 5/5 Stars
  • Visual Results 4/5 Stars
  • Low Maintenance 2/5 Stars

###Ease of Setup With direct links, all links to your integrated software remain as they have always been. However this means Joomla is never loaded and you will have to directly modify your software theme to make the external software look like Joomla. This requires knowledge of HTML, CSS and the template system that your software uses.

To modify your template, go to your Joomla page and get the source code from your browser (click on the view menu and then source). Copy and paste your Joomla header into the template header and the Joomla footer into the template footer. Some Joomla templates load different CSS files for different browsers. (For example, Internet Explorer 8, Internet Explorer 9 or Firefox). This makes it extremely hard to modify your external software template; a copy and paste won't give a perfect result. There can also be conflicts among the different software CSS files, for which you might need to create a new CSS file that contains your Joomla CSS layout tags, but not any other conflicting tags.

###Server Performance Server performance is excellent as only your integrated software is loaded (and not Joomla). This will keep your server load to a minimum and therefore this method is recommended for people who have a very large userbase. This is the method that the Joomla forums use, for instance, to make it look like it is part of the main Joomla site, however the Joomla forum runs completely separate.

###Visual Results Once you have modified your software template, the visual integration should be great and your users should not be able to tell the difference between the template designs of your different software. However, the URLs will not be modified, therefore URLs will look different from your Joomla URLs and Joomla SEF capabilities will not be applied to your external software

###Low Maintenance Every time you update your Joomla header or top menu, you will have to manually modify your external software's template. This means that if you like to change your site a lot, you could be doing a lot of maintenance to keep the sites looking the same.

##Wrapper

  • Easy of Setup 5/5 Stars
  • Server Performance 4/5 Stars
  • Visual Result 1/5 Stars
  • Low Maintenance 4/5 Stars

###Ease of Setup The setup is extremely easy-> set select the wrapper option in your JFusion menu item, activity module or login module. You then select a template for your external software that sort of looks like your Joomla software and away you go.

###Server Performance Server performance is good, as the Joomla frame is only loaded once, after which only your integrated software is loaded for each click inside the wrapper.

###Visual Results Visual integration with this method is poor due to the browser incompatibility of the wrapper. The auto-height will adjust without problems on Internet Explorer 7 and Firefox, but older Internet Explorer versions and some other browsers will not auto-adjust the height. The result is that a frame is shown with scroll bars and a user will have to scroll down and up to view the entire integrated site.

###Low Maintenance Your Joomla header and menu items will automatically update like normal therefore this method is very low in maintenance.

##Frameless Integration

  • Easy of Setup 2/5 Stars
  • Server Performance 2/5 Stars
  • Visual Results 5/5 Stars
  • Low Maintenance 5/5 Stars

###Ease of Setup Setting up frameless can be tricky depending on your software's templates. There can be conflicts among CSS files of the softwares, where both softwares use the same CSS tag with different values. This results in heights of tables or text sizes being different from what you expect. Also relative paths in CSS or Javascript files might need to be changed to absolute paths as the software is now executed from a different directory. You might need HTML/CSS coding experience to set up frameless.

###Server Performance There is an extra server load of frameless integration compared to the other methods. This is because two softwares are loaded on a single request. This will not be a problem on sites with a small to medium userbase, but sites with a very large amount of users should consider using the direct links method.

###Visual Results The visual results are excellent with frameless integration, once setup properly. There are no frames, all external URLs are now Joomla URLs, with the option of using Joomla SEF (even if the software does not support SEF) and all external content looks like it is part of Joomla itself.

###Low Maintenance Frameless is extremely low in maintenance as updates to any software will automatically show up correctly in the frameless mode.