Joomla Templates Club 406,261 posts

[iabichino Friend iabichinoJoin date: October 2010Posts: 50Downloads:67Uploads:42 Thanks: 9 Thanked: 1 times in 1 posts]

#1042312

Hi all,
I’m using Magz II on a site (www.lifestyleinitaly.com) and when I browse it in devices like phone or tablets, the social icons, the language flags and the logo areoverlappin which makes it pretty ugly and not usable. Please, see attached screenshots.
Why is that since I am assigning the right module as per demo?
Thanks

---

Attachments:

1. 
2. 

[Saguaros Moderator SaguarosJoin date: September 2014Posts: 31405Downloads:237Uploads:471 Thanks: 845 Thanked: 5346 times in 4964 posts]

#1042641

Hi,

In small layout view port like mobile, there is not enough space for showing all icons / language flags + logo in the header part so we hide these elements by default in mobile view. You can see the same in our demo site here: http://ja-magz-ii.demo.joomlart.com/index.php/en/

[iabichino Friend iabichinoJoin date: October 2010Posts: 50Downloads:67Uploads:42 Thanks: 9 Thanked: 1 times in 1 posts]

#1042654

Good morning,

First, if languages and social media are hidden how can someone change language (unless language sets by default based on browser language) or more important, how can someone share a content???

Second, How can I hide these items from small devices??? As in the DEMO link you mentioned above.
Thanks!

---

Attachments:

1. 
2. 

[Saguaros Moderator SaguarosJoin date: September 2014Posts: 31405Downloads:237Uploads:471 Thanks: 845 Thanked: 5346 times in 4964 posts]

#1042754

It should be hidden by default, share me the URL, admin + FTP account, I will check for you.

[iabichino Friend iabichinoJoin date: October 2010Posts: 50Downloads:67Uploads:42 Thanks: 9 Thanked: 1 times in 1 posts]

#1042763

This reply has been marked as private.

[Saguaros Moderator SaguarosJoin date: September 2014Posts: 31405Downloads:237Uploads:471 Thanks: 845 Thanked: 5346 times in 4964 posts]

#1042982

Not sure which extension you’re using but your site disabled this class of bootstrap:

.hidden-xs { display: none; }

you can create this file: [root]/templates/ja_magz_ii (your default template)/css/custom.css

and add this css rule into this file:

.hidden-xs { display: none !important; }

[iabichino Friend iabichinoJoin date: October 2010Posts: 50Downloads:67Uploads:42 Thanks: 9 Thanked: 1 times in 1 posts]

#1043007

I am not using any extension I am using custom module and inside of it I have placed the following code:

Please, see images attached

• This reply was modified 7 years, 6 months ago by  iabichino.

---

Attachments:

1. 
2. 

[iabichino Friend iabichinoJoin date: October 2010Posts: 50Downloads:67Uploads:42 Thanks: 9 Thanked: 1 times in 1 posts]

#1043014

I created a custom.css file and added it to the following folder:
lifestyleinitaly.com/templates/ja_magz_ii/css
The result now is that the social media icons disappeared from the site.
Now, what I need is that Social Icons and Flags DO NOT OVERLAP on the logo! on devices like phones!
and as it happens to you demo site.
Please, see image attached.

---

Attachments:

1. 

[Saguaros Moderator SaguarosJoin date: September 2014Posts: 31405Downloads:237Uploads:471 Thanks: 845 Thanked: 5346 times in 4964 posts]

#1043170

Could you also share the FTP account of your site? I will investigate further in code.

[iabichino Friend iabichinoJoin date: October 2010Posts: 50Downloads:67Uploads:42 Thanks: 9 Thanked: 1 times in 1 posts]

#1043264

This reply has been marked as private.

[Saguaros Moderator SaguarosJoin date: September 2014Posts: 31405Downloads:237Uploads:471 Thanks: 845 Thanked: 5346 times in 4964 posts]

#1043389

Hi,

I accessed via FTP but didn’t see the ‘custom.css’ file as I suggested above on your server. I just added this file and updated css for you.

For the language flags, as you can see in our demo site, we assign this languageswitcherload module into ‘off-canvas’ position, not current position on your site. But I updated this file: /templates/ja_magz_ii/html/mod_languages/default.php

add the code at this line 58: <div class="dropdown mod-languages <?php echo $moduleclass_sfx; ?>">

so module will load the class suffix and I also add ‘hidden-xs’ class in backend settings of languageswitcherload module in admin panel of your site.

[Saguaros Moderator SaguarosJoin date: September 2014Posts: 31405Downloads:237Uploads:471 Thanks: 845 Thanked: 5346 times in 4964 posts]

#1043390

About the style in ‘Assignment’ tab in template manager section, I replied you in another topic as it looks good at my end: http://prntscr.com/fmom67 , you can try to open in another PC and see how it goes, I guess something wrong in your PC specific.

[Author]

Posts