Module JT Fixed Display

The Module JT Fixed Display can displays your images or modules on fixed position. When you scroll the browser window, your images or modules are alway displayed. This module is suitable for display Ads, Banners, Menu, Socials Button, Contact Form, Login Form, Email Form, Custom code,...

Module JT Fixed Display Features

  • Display your image link directly without creating module
  • Display your module by ID
  • Display your module by Position Name
  • Display your module on Top, Middle, Bottom, Center of the website.
  • Your module snap to website edge
  • Your module snap to windows edge
  • Auto Show/Hide on small screen device
  • Display first time only
  • Show/Hide Close Button
  • Display with Start Point
  • Show/Hide at Start Point
  • Adjust Side Offset
  • Settings Width and Height
  • Module Class
  • Custom CSS
  • Support the most common browser with latest version
  • Compatible with Joomla! 3.x and 4.x

Changes from the previous version

  • Since version 5.0, this module uses new code with jQuery library.
  • More features with new settings and parameters.
  • Optimized for lightweight and compact code to increase loading speed.
  • Fixed the module not working well on some websites.

Download Module JT Fixed Display

Download Module JT Fixed Display

Module JT Fixed Display Documentation

1. Install the module JT Fixed Display via Joomla! Extensions -> Manage -> Install.

2. Go to Extensions -> Modules and open the module JT Fixed Display then select Show Title to Hide and Published the module JT Fixed Display on any available position of your template. We recommend you publish the module JT Fixed Display on the position named Debug because it is located at the bottom of your web page.

3. Go to Menu Assignment tab and select All Pages to display the module JT Fixed Display on all pages of your website.

4. Keep all default settings and click Save & Close.

5. Clear your Joomla! cache and your Browser cache.

6. Go to your site then refresh your browser. If you see two demo banners display on your website, this module works well on your site. If not, please view Troubleshooting below.

If you have installed the module JT Fixed Display Free, you don't need to remove it, just install the module JT Fixed Display Pro and open it then click Save to apply the Pro features. Your module will be upgraded to Pro and your old settings will be kept.

Please back up your website before making any changes.

1. Go to Content -> Media then upload your image to joomla! image folder.

2. Go to Extensions -> Modules then open the module JT Fixed Display and go to Left Side Settings tab to settings for the left side.

3. Change Width and Height to fit your image.

4.Select Vertical Position and Horizontal Position to display your image on the left side.

5. Select your image to display on left side.

6. Enter your Link URL for the image.

7. Do the same way for Right Side Settings.

8. Click Save & Close.

Live Demo: JT Fixed Display - display images on fixed position

1. Go to Extensions -> Modules then looking for the ID number of your module.

2. Open the module JT Fixed Display and go to Left Side Settings tab to settings for the left side.

3. Change Width and Height to fit your image.

4.Select Vertical Position and Horizontal Position to display your image on the left side.

5. Select Module ID in Display Type drop-down list.

6. Enter your module ID to Module ID field.

7. Do the same way for Right Side Settings.

8. Click Save & Close.

Live Demo: JT Fixed Display - display module by ID

1. Go to Extensions -> Modules then open the module JT Fixed Display and go to Left Side Settings tab to settings for the left side.

2. Change Width and Height to fit your image.

3. Select Vertical Position and Horizontal Position to display your image on the left side.

5. Select Module Position in Display Type drop-down list

6. Remember the name of module position in Module Position field. By default, this name is left-side but you can change it to whatever you want.

7. Do the same way for Right Side Settings. By default, the position of right side is right-side

8. Click Save & Close the module JT Fixed Display.

9. Open your module that you want to float on the left side (images, Banners, Custom HTML,...). Go to the Position field and enter left-side (type by your keyboard then press enter).

You can select a module position from the drop-down list of predefined positions or enter your own module position by typing in the name then press Enter

10. Click Save & Close your module.

Do the same way to display other module on the right side.

Live Demo: JT Fixed Display - display module by position

1. Go to Extensions -> Modules then open the module JT Fixed Display and go to Options tab.

2. Enter the screen width to Auto Hide Screen Width. If you enter 601, your images or modules will not display on all devices with a screen width equal or smaller than 600px.

3. Click Save & Close the module JT Fixed Display.

Live Demo: JT Fixed Display auto hide on small screen devices

1. Go to Extensions -> Modules then open the module JT Fixed Display and go to Left Side Settings tab.

2. Enter the value in Start Point field. If you enter 200, your images or modules starts showing up in place, when you scroll down your website 200px your images or modules start displaying on fixed position.

3. Set Display Start Point to Yes. Your images or modules starts with hidden, when you scroll down your website 200px your images or modules will display.

4. Click Save & Close the module JT Fixed Display.

Live Demo: JT Fixed Display - display images on scroll down and hide them on scroll up

1. Go to Extensions -> Modules then open the module JT Fixed Display and go to Left Side Settings tab.

2. Set Close Button to Show.

3. Select Button Position.

4. Do the same way for Right Side Settings.

5. Click Save & Close the module JT Fixed Display.

Live Demo: JT Fixed Display - display Close button on images or modules

1. Go to Extensions -> Modules then open the module JT Fixed Display and go to Options tab.

2. Set Display First Time Only to Yes.

3. Click Save & Close the module JT Fixed Display.

Live Demo: JT Fixed Display - display your images or modules first time only

1. Go to Extensions -> Modules then open the module JT Fixed Display and go to Left Side Settings tab.

2. Enter your Template or Bootstrap CSS Class in Module Class field.

3. Enter your CSS Code in CSS Override.

4. Do the same way for Right Side Settings.

5. Click Save & Close the module JT Fixed Display.

Live Demo: JT Fixed Display apply class and css to your images or modules

You can copy or duplicate this module then publish them with different settings on different pages.

Please note that only one module works on the same page.

Module JT Fixed Display Troubleshooting

1. Go to Extensions -> Modules and open the module JT Fixed Display then check to make sure the Status is Published and All Pages has been selected in Menu Assignment

2. Go to Left Side Settings tab and select Display Left Side to Yes. Do the same in Right Side Settings tab.

3. The position named debug is not Enable on your template. You can go to your template option to enable it. Other ways, please try to publish the module JT Fixed Display on other position.

Read more about How to enable debug position

Go to Extensions -> Modules and open your module then check to make sure the Status is Published and All Pages has been selected in Menu Assignment

Go to Extensions -> Modules and open the module JT Fixed Display then set Fix Display option to Yes.

Other ways, you can try to publish the module JT Fixed Display on other position or create a new position for your template.

The problems caused by compatibility view in Internet Explorer. You can fix it in one of the following ways:

Install the Plugin JoomTut Meta Tags

JoomTut Meta Tags is a simple plugin for Joomla! This plugin will fix website display problems with compatibility view in Internet Explorer by adding X-UA-Compatible Meta Tag Description to your website. The X-UA-Compatible meta tag helps render Web pages in older IE browsers. It also allows you to add your custom tags to head section.

Download Plugin JoomTut Meta Tags

Add yourself by editing your template

1. Go to Extentions -> Templates -> templates -> Click on your template name

2. Click to open the file named index.php in left column.

  • Find:
<head>
  • Affter add:
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  • Your code looks like this:
<head>
   ...
   <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
   <jdoc:include type="head" />
   ...
</head>

3. Click Save & Close

1. Go to Extentions -> Templates -> templates -> Click on your template name

2. Click to open the file named index.php in left column.

  • Find
</body>
  • Before add
<jdoc:include type="modules" name="jt_fixed_display" />
  • Your code looks like this
...
<jdoc:include type="modules" name="jt_fixed_display" />
</body>
</html>

3. Publish the module JT Fixed Display on the position named jt_fixed_display