Joomla Templates Club 406,261 posts

[aalisg Friend aalisgJoin date: February 2013Posts: 130Downloads:30Uploads:7 Thanks: 2]

#202946

Hello,

I would like to reduce JA Slideshow Lite WIDTH on my website in order to display other modules.

Let me explain myself : what I want is to reduce JA Slideshow Lite width in order to display modules on its right.

Please see screen capture :

So my questions are :

1) How to reduce JA Slideshow Lite width do I have to modify Slideshow position in JA University template files or do I just need to set in in the module configuration ?

2) To display modules on its right within the space created with the width change do I have to assign them JA University tempalte Slideshow poistion or do I have to create new positions in the template ? If yes how do I do so ?

3) How to keep everything responsive ?

Can you help me ?

Regards

---

Attachments:

1. 

[Eragon H Friend Eragon HJoin date: July 2014Posts: 468Downloads:1Uploads:39 Thanks: 5 Thanked: 156 times in 149 posts]

#556281

You can refer to this article for the solution: http://www.joomlart.com/forums/topic/new-position-near-slideshow/

Result: http://prntscr.com/59kaoi

[aalisg Friend aalisgJoin date: February 2013Posts: 130Downloads:30Uploads:7 Thanks: 2]

#556310

Hello and thank you for your reply,

That is exactly what i want to do but I not sure to understand everything.

Should I change or add this code ? What about the mobiles versions ?

Regards

[Eragon H Friend Eragon HJoin date: July 2014Posts: 468Downloads:1Uploads:39 Thanks: 5 Thanked: 156 times in 149 posts]

#556410

If this is not really necessary, you should not change. Because the customization normally cause unexpected issue. If you want to change, you can follow these steps

1. Clone the layout Default:
Extension >> Templates >> Ja University – Default >> T3 – Options >> Layout >> Clone the layout Default >> http://prntscr.com/59v4rf

2. Edit the cloned layout: Default – copy
Change:
Position to change: http://prntscr.com/59v5i5
FROM:

<block name="slideshow">slideshow</block>

TO:

<block name="topsl4" type="spotlight" style="raw" special="left" specialwidth="66">slideshow,slideshow2</block>

3. Configure the profile “Home” to use the new cloned layout
Extension >> Templates >> Ja University – Default >> T3 – Options >> Profile >> Home >> http://prntscr.com/59v6r7 >> http://prntscr.com/59v6yw

4. Add position slideshow2
edit the file: root/templates/ja_university/templateDetails.xml >> http://prntscr.com/59v66u

<position>slideshow2</position>

Now you can assign module to position “slideshow2”

Then clean JAT3 cache.

[aalisg Friend aalisgJoin date: February 2013Posts: 130Downloads:30Uploads:7 Thanks: 2]

#556583

Hello and thank you for your reply,

I did what you said and it was very usefull.

But now the problem is that submenus of the Megamenu are hidden by the slideshow: slidesho slides cover the submenus. Please go to https://www.aalisg.org to see what I mean.

Can you please tell me how to solve it ?

Then it looks that this new position doe not keep the website responsive: when reducing screen width the module displayed on this new position remains on the side of the slideshow, I think it should be great if it could go above. Do you know a way to do so ?

Regards

[Eragon H Friend Eragon HJoin date: July 2014Posts: 468Downloads:1Uploads:39 Thanks: 5 Thanked: 156 times in 149 posts]

#556749

1. Sub-menu issue
You can add this code to the file root/templates/ja_university/css/template.css

div#ja-topsl4 {
position: relative;
z-index: 10;
}

2. Responsive

Add this code to the file root/templates/ja_university/css/layout-tablet.css and layout-mobile.css

#ja-topsl4 .ja-box {
width: 100% !important;
min-height: 0px !important;
}

#ja-topsl4 .ja-box-right {
position: relative !important;
}

[aalisg Friend aalisgJoin date: February 2013Posts: 130Downloads:30Uploads:7 Thanks: 2]

#556812

Hello and thank you for your reply,

I did what you say but I think it is not very responsive yet. The new module remains on the right of the JA Slideshow instead of going above.

Regards

[Eragon H Friend Eragon HJoin date: July 2014Posts: 468Downloads:1Uploads:39 Thanks: 5 Thanked: 156 times in 149 posts]

#556816

Because you copy to wrong position in file layout-mobile.css >> http://prntscr.com/5amf2u

It should be this: http://prntscr.com/5amfe8

I fixed, and it’s working now: http://prntscr.com/5amflh

[aalisg Friend aalisgJoin date: February 2013Posts: 130Downloads:30Uploads:7 Thanks: 2]

#556833

Hello and thank you for your reply,

It works now. Sorry for my mistake. Thank you very much.

Regards

[Author]

Posts