Joomla Templates Club 406,261 posts

[febtonline Friend febtonlineJoin date: May 2009Posts: 121Downloads:15Uploads:80 Thanks: 24 Thanked: 2 times in 1 posts]

#1072489

Hi,

Having some mobile display problems with two link I added to the top and a phone number, but the problems are only on mobile. So under responsive layout, I had to disable the head social and head login because the attached files show what they display like on a 5.5 inch screen. Could really use some help getting that sorted if possible.

If you visit the website you will see how it looks on a regular display. We understand that we may have to double the size of the header on mobile to fit things right, we would just like to be able to get the display fixed because we need those informational items and the links to display.

Last thing is we added chat support and it now covers the "Top the top" arrow on the bottom right of the screen. Is there any way to just bump that up over the "Chat Now"?

Thanks in advance for the help.

---

Attachments:

1. 
2. 
3. 

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

#1072643

Hi,

So on mobile viewport, you want to show 2 links only, right?

You will need to change the bootstrap class a bit like this: http://prntscr.com/h6u30k

And add this custom css:

.t3-top-header .main-container>.row .head-login ul >li {
    float: left;
}

For the back to top button, you can add this custom css:

.back-to-top {
  bottom: 80px !important;
}

You can add the custom css into the file: root/templates/ja_biz/css/custom.css (create this file if it doesn’t exist)

[febtonline Friend febtonlineJoin date: May 2009Posts: 121Downloads:15Uploads:80 Thanks: 24 Thanked: 2 times in 1 posts]

#1072662

I would also like to display the phone number in a legible manner along with the links. It gets completely condensed now. Is that possible?

I don’t mind having the links one on top of the other like the print screen display up there, if the phone number is also displayed in a legible manner.

[febtonline Friend febtonlineJoin date: May 2009Posts: 121Downloads:15Uploads:80 Thanks: 24 Thanked: 2 times in 1 posts]

#1072668

Also, the "to the top" button is fixed but look at how the links end up displaying with and without the phone number.

---

Attachments:

1. 
2. 

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

#1072810

I just checked but didn’t see the change in class as I suggested above, if you want to show fully in mobile, you will use the class ‘col-xs-12’ and add the style as you wish. It seems that you customized this top header already so the style not look good.

[febtonline Friend febtonlineJoin date: May 2009Posts: 121Downloads:15Uploads:80 Thanks: 24 Thanked: 2 times in 1 posts]

#1072897

I would appreciate a little help with getting this right. I have disclosed exactly what I would like to happen.

I would like the phone number to display correctly and I would like both of those buttons to appear. I know they won’t look perfect because it’s been modified, but it can certainly look better than it does. You logged into my system and made changes to my website and left it looking like a disaster and didn’t even correct your changes. This is not exactly the level of service I am used to from Joomlart.

You enabled the slideshow, which was clearly disabled on small and extra small. You fixed the phone number display somehow and broke the right side display in the same breathe.

---

Attachments:

1. 

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

#1073106

So you want to show phone number on the left and 2 links on the right, side by side, right?

You can share the FTP account also, I will take a look.

[febtonline Friend febtonlineJoin date: May 2009Posts: 121Downloads:15Uploads:80 Thanks: 24 Thanked: 2 times in 1 posts]

#1073135

This reply has been marked as private.

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

#1073284

This reply has been marked as private.

[febtonline Friend febtonlineJoin date: May 2009Posts: 121Downloads:15Uploads:80 Thanks: 24 Thanked: 2 times in 1 posts]

#1073443

This reply has been marked as private.

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

#1073551

I can login now.

Is there any cache settings from server side? as I tried to update css into ‘custom.css’ file but not see any affect.

[febtonline Friend febtonlineJoin date: May 2009Posts: 121Downloads:15Uploads:80 Thanks: 24 Thanked: 2 times in 1 posts]

#1073597

Cache is enabled in Joomla. Usually if I clear all cache any changes show up immediately.

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

#1074122

It’s weird, could you add some test CSS and check the same?

[febtonline Friend febtonlineJoin date: May 2009Posts: 121Downloads:15Uploads:80 Thanks: 24 Thanked: 2 times in 1 posts]

#1074552

What would you like me to do? Any css I make changes to shows up immediately with a cache refresh. I also turned off CloudFare, maybe that was causing some problems.

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

#1074691

For example, I put the custom css:

@media (max-width: 480px) {
  .t3-top-header .head-social {
    left: 0 !important;
  }

  .head-login {
    padding-top: 0;
  }
  .head-login .topnav {
      float: left;
      margin-top: -5px;
  }

  .head-login .topnav > li {
      float: left;
      padding: 0 6px;
  }
}

into the ‘custom.css’ file on your site >> I clean all caches via back-end but don’t see the changes on frontend. Could you check?

[Author]

Posts