Responsive Menu and other bits

Questions related to the Responsive Web Design tools of WYSIWYG Web Builder.
Forum rules
PLEASE READ THE FORUM RULES BEFORE YOU POST:
viewtopic.php?f=12&t=1901

MUST READ:
http://www.wysiwygwebbuilder.com/respon ... esign.html
Please read this first before posting any questions! Also check out the example project to get an idea how the RWD concept works.

Responsive Web Design FAQ:
http://wysiwygwebbuilder.com/forum/view ... 10&t=63817
User avatar
Starb7
 
 
Posts: 228
Joined: Tue Sep 05, 2006 12:35 pm
Location: Derbyshire

Responsive Menu and other bits

Post by Starb7 » Mon Jun 24, 2019 4:52 pm

Hi Pablo and all

Struggling with a couple of items on a site. This is based on template and I have altered and edited to get what I wanted. I have 3 main issues (with some related issues) that I cannot resolve.

1. I have 4 pages on the site - Home being the normal one and About, Gallery and Contact being CLONES of the main page with edits to show just appropriate content. This appears to work but; a) the Menu is missing so can click to go back and b) the first Layout grid appears to slide up to the top (so hides text). If you look on 'About' you can see that the first number is 3 (partially) so why has this slid up? I have set the top padding to 100 so the pic is in the right place on the home page so why isn't the text showing in the same 'start point' when the padding is the same.

2. I have set a breakpoint at 360 for mobile views but when you look at it on a mobile, the header is huge and the body is tiny - are Pages Headers responsive? How do I get all to show at the same with and where has the menu gone?

3. Menus - when I reduce the size of a desktop page, I see the 'Responsive' menu Hamburger appears but if I view this on a real mobile there is no menu! I would like the Hamburger to appear when on a small viewport and mobile so how do I get it to show and how to I get to show in the right of the top panel (I can only get it to appear in the left side.

I have purposely removed the 360 view menu from 'Gallery' page and when selected, that one does show the main menu in its header. It seems that if I have a 360 view menu (which I have set to be hidden in full viewport) the main menu is being ignored, eg About and Contact have neither menus in full desktop mode.

Hope you can help and point me in the right direction?

TIA

Paul
Last edited by Starb7 on Wed Jun 26, 2019 8:16 am, edited 1 time in total.

User avatar
Pablo
 
Posts: 18321
Joined: Tue Mar 28, 2006 12:00 pm
Location: Europe
Contact:

Re: Responsive Menu and other bits

Post by Pablo » Mon Jun 24, 2019 6:08 pm

You have duplicated the menu in the page header, however the 'hidden' menu is outside the viewport of the breakpoint so this affects the page width and this causes a scrollbar.
Why did you duplicate the responsive menu? The purpose of this menu is to reuse it in breakpoint, where it should switch to mobile mode based on the breakpoint.

To help you with the other issue, I need more details.
Where exactly do I need to look?
Which object IDs are relevant?

Tip: please focus at one issue at a time.
Also when you share your project please remove all non-relevant content. So, it's immediately clear for me where to look. This will save us both a lot of time.

User avatar
Starb7
 
 
Posts: 228
Joined: Tue Sep 05, 2006 12:35 pm
Location: Derbyshire

Re: Responsive Menu and other bits

Post by Starb7 » Mon Jun 24, 2019 6:29 pm

Hi Pablo

I duplicated the menu as I could not get the hamburger to show when the viewport was at 360, ie a mobile. I'll remove the added one and try again. To tackle these one by one, can we start with that? ...

I have removed the extra menus and now uploaded again (entire site / all files) but on a desktop there is still no menu showing for the 'about' and 'contact' pages which are clones of the main page, but oddly, the 'Gallery' page does show the menu.

If I view the 'home' page on a mobile phone, the header is scaled and the content following is squashed up. The Hamburger shows but it is tiny. If I view the 'home' page on a desktop and shrink the window up that seems to work although the menu background colour doesn't cover the whole menu text.

If we can get this sorted, I'll move on to the other items if that's OK?

Not sure what you mean about 'non-relevant content' - all content is what has been uploaded by WWB.

Cheers

User avatar
Pablo
 
Posts: 18321
Joined: Tue Mar 28, 2006 12:00 pm
Location: Europe
Contact:

Re: Responsive Menu and other bits

Post by Pablo » Mon Jun 24, 2019 7:54 pm

I duplicated the menu as I could not get the hamburger to show when the viewport was at 360, ie a mobile.
The breakpoint of the menu is set to a strange value. I suggest to keep the default: 768 or use 480
If I view the 'home' page on a mobile phone, the header is scaled and the content following is squashed up.
It looks like the JSSOR slideshow has a fixed size, which causes a scrollbar
Not sure what you mean about 'non-relevant content'
I meant, to focus on the issue the project/pages should only contain the item that are relevant to the problem.
If I have to go through all pages and all settings of all object then it may take me hours to figure out what is wrong.
So, if you run into a problem then create a small demo project with only the items that do not work.

User avatar
Starb7
 
 
Posts: 228
Joined: Tue Sep 05, 2006 12:35 pm
Location: Derbyshire

Re: Responsive Menu and other bits

Post by Starb7 » Mon Jun 24, 2019 8:03 pm

Thanks Pablo, I'll have a good look at this as soon as I can and as always, much appreciated. Thanks

P.S. any thoughts on why the menu doesn't show on two of the cloned pages? Perhaps if I fix the main page first then re-clone would be the best option?

User avatar
Pablo
 
Posts: 18321
Joined: Tue Mar 28, 2006 12:00 pm
Location: Europe
Contact:

Re: Responsive Menu and other bits

Post by Pablo » Mon Jun 24, 2019 9:02 pm

Did you remove the duplicated menu and make sure all elements are inside the viewport?

User avatar
Starb7
 
 
Posts: 228
Joined: Tue Sep 05, 2006 12:35 pm
Location: Derbyshire

Re: Responsive Menu and other bits

Post by Starb7 » Mon Jun 24, 2019 9:49 pm

I'll check, thanks

User avatar
Starb7
 
 
Posts: 228
Joined: Tue Sep 05, 2006 12:35 pm
Location: Derbyshire

Re: Responsive Menu and other bits

Post by Starb7 » Tue Jun 25, 2019 12:09 pm

Pablo wrote:
Mon Jun 24, 2019 7:54 pm
I duplicated the menu as I could not get the hamburger to show when the viewport was at 360, ie a mobile.
The breakpoint of the menu is set to a strange value. I suggest to keep the default: 768 or use 480
Breakpoint set to 480
If I view the 'home' page on a mobile phone, the header is scaled and the content following is squashed up.
It looks like the JSSOR slideshow has a fixed size, which causes a scrollbar
Where do you set the JSSOR slider size? I have tried to use the 'Responsive' menu but all other than '(None)' mess the page up. I can't see a 'size/width' option. If this is a non-usable 'RWD' extension, can you recommend on that is that offers a similar 'slider' feature?
Not sure what you mean about 'non-relevant content'
I meant, to focus on the issue the project/pages should only contain the item that are relevant to the problem.
If I have to go through all pages and all settings of all object then it may take me hours to figure out what is wrong.
So, if you run into a problem then create a small demo project with only the items that do not work.
I have deleted all pages now other than the main page and re-uploaded that (removing all files on the ftp first) so now only the main page is there.

I can't see any object outside of the viewport (now set at 480 - is 768 OK for mobile devices?) so shouldn't be an issue now.

Page still not working on mobiles so if I can get past this, I'll look at cloning for the other pages, etc.

As always, TIA!


User avatar
Starb7
 
 
Posts: 228
Joined: Tue Sep 05, 2006 12:35 pm
Location: Derbyshire

Re: Responsive Menu and other bits

Post by Starb7 » Tue Jun 25, 2019 1:54 pm

Hi Pablo

You said "It looks like the JSSOR slideshow has a fixed size, which causes a scrollbar" and my follow up question was "Where do you set the JSSOR slider size? I have tried to use the 'Responsive' menu but all other than '(None)' mess the page up. I can't see a 'size/width' option. If this is a non-usable 'RWD' extension, can you recommend on that is that offers a similar 'slider' feature?"

You answered with alternatives so I am right in assuming you can't change the site and the JSSOR is not responsive?

Cheers

User avatar
Starb7
 
 
Posts: 228
Joined: Tue Sep 05, 2006 12:35 pm
Location: Derbyshire

Re: Responsive Menu and other bits

Post by Starb7 » Tue Jun 25, 2019 2:45 pm

Hi Pablo

OK, I have tried several of the sliders and get similar results, ie look OK on the desktop but on mobile the text is shrunk - what am I doing wrong?

At a loss on how to get this (what should be simple) page to work on mobile so any clues as to why it won't would be appreciated.

Thanks
Last edited by Starb7 on Wed Jun 26, 2019 8:17 am, edited 1 time in total.

User avatar
Pablo
 
Posts: 18321
Joined: Tue Mar 28, 2006 12:00 pm
Location: Europe
Contact:

Re: Responsive Menu and other bits

Post by Pablo » Tue Jun 25, 2019 3:08 pm

The JSSOR slideshow was released before WWB supported layout grids, so it was not designed to be used in a flexible layout.
JSSOR is responsive, but not flexible.

User avatar
Pablo
 
Posts: 18321
Joined: Tue Mar 28, 2006 12:00 pm
Location: Europe
Contact:

Re: Responsive Menu and other bits

Post by Pablo » Tue Jun 25, 2019 3:13 pm

OK, I have tried several of the sliders and get similar results, ie look OK on the desktop but on mobile the text is shrunk - what am I doing wrong?
I do not see any major issues. The only issue I see is that the menu is very small in the breakpoint, so there is no space for it to expand.

What do I need to so to see the 'shrunken text'?

User avatar
Starb7
 
 
Posts: 228
Joined: Tue Sep 05, 2006 12:35 pm
Location: Derbyshire

Re: Responsive Menu and other bits

Post by Starb7 » Tue Jun 25, 2019 3:36 pm

POST DELETED BY OP
Last edited by Starb7 on Wed Jun 26, 2019 8:19 am, edited 3 times in total.

User avatar
Pablo
 
Posts: 18321
Joined: Tue Mar 28, 2006 12:00 pm
Location: Europe
Contact:

Re: Responsive Menu and other bits

Post by Pablo » Tue Jun 25, 2019 4:59 pm

This is most likely because the fixed content (in your case the page header) is too wide.
Adding a smaller breakpoint (320) may solve this.

Post Reply