Issue with mobile layout

Posted in: Newspaper
Post count: 56

Hey,

For some reason recent posts from Block 7 on Home Page don’t show up on mobile devices.

It only shows the main slide, and under that is shows the ‘load more posts’ (it’s in hebrew). but when i press it nothing happens.

What i want is to show recent posts from Block 7, without the ‘load more’.

I attached 2 screen shots: one is a mobile view, and the other is the Home Page layout from the Admin.

Mobile: http://tinypic.com/r/2u4j6s2/8
HomePage: http://tinypic.com/r/5cx54j/8

Thanks

Post count: 7909

Hi,

Please try this without any plugins active, leave just Visual Composer active, clear cache and check if you still have this issue. Also provide your site URL so we can check this.

Thanks!

Post count: 56

Oops. Forgot to add the website. here it is – http://www.israsport.co.il

will try the things you suggested a little later.

Thanks

Post count: 7909

Hi,

I have checked your site and you have this custom css that hide all span4 from the row: http://screencast.com/t/mzLp70PL3VaQhttp://screencast.com/t/nxiemo1Iq
Please check your Custom Css from Theme Panel and see if you find it or you can try to overwrite it: http://screencast.com/t/nNusinrWWrq

@media (max-width: 767px) {
.container .span12 .row-fluid .span4 {
display: block !important;
}
}

Hope this helps!

Post count: 56

Thanks for your reply.

I did fix it, but now i have a different problem.

The reason i had custom css that hide all span4 is because on an RTL site, the sidebar appeared above the post content on mobile devices, so your solution (i saw it on another thread) was that custom css to hide all span4.

Now the recent posts apear on the Home Page, but the sidebar is showing as well.

Is there a way around this?

Thanks

Post count: 7909

Hi,

You can add an extra class to the sidebar column and use that class to hide sidebar on mobile: http://screencast.com/t/iza4uIDLEfd

@media (max-width: 767px) {
.yourclass{
display: none;
}
}

Hope this helps!

Post count: 56

Hey,

Where can i find the sidebar column in order to as the extra class?

I attached a screenshot of my home page layout.

http://i62.tinypic.com/b5ru4p.jpg

Thanks

Post count: 7909

Hi,

Do you refer to the latest articles sidebar?
For this you need to add an class in the page template: http://screencast.com/t/KqgkJcM1XR
And use the above css to hide it.

Thanks!!

Post count: 56

I’m didn’t manage to get work.

Sidebar in still showing on the post page on mobile.

I want the latest article sidebar not to appear on mobile devices (because it’s shows before the actual post),

And i want lateset artciles to show on the homepage.

Thanks

Post count: 7909

Hi,

Please add the class there – http://screencast.com/t/KqgkJcM1XR and let me know so I can inspect this.
Also please try to use !important, it should work.

@media (max-width: 767px) {
.yourclass{
display: none !important;
}
}

Thanks!

Post count: 56

Hey,

I did what you wrote, But sidebar is still showing above the post on mobile

Could you please take a look?

Thanks

Post count: 56

I think i managed to get this fixed, but no the way you suggested.

I found this class – .td-post-sidebar, that was causing the problem. but i have no idea where this Class apears in the theme files – can you tell me how to find it?

What id did is change ‘my class’ to .td-post-sidebar class, and it fixed it.

Post count: 7909

Hi,

td-post-sidebar class is used on posts so if your post’s sidebar is hidden on mobile then adding this class in your page template will also hide the latest articles sidebar. So feel free to use it like that, it is a good solution.
I also checked you site again and I see that you have added this class in page template homepagesidebar, this also can be used if you want this. Just paste this custom css in Theme Panel > Custom css:

@media (max-width: 767px) {
.homepagesidebar {
display: none !important;
}
}

Thanks!

Viewing 13 posts - 1 through 13 (of 13 total)
The forum ‘Newspaper’ is closed to new topics and replies.