Copy link to clipboard
Copied
Hi there, the site I built worked perfectly fine. I updated to the latest version and now I have am struggling profusely to get the accordion to push down content below.
(I can't upload a small file just with the problem, because when I tested a few items at a time on a new document it seems to work. Therefor the problem is somewhere in my document. I don't mind rebuilding the site, however I want to know what is wrong in the document to prevent repeating the error.)
Site: EMS Training. The Future of Fit.
Problem area: mobile breakpoint 474 and below
Live Preview: use chrome; inspect element; toggle device toolbar; select one of the iphone options}@
Site Files and Fonts: Dropbox - AdobeMuseProblem
Problem A:
Accordion Hamburger Menu only push a section below it down. It does not push down all content as I would like it to.
• I tried putting them on separate and one layer
• tired them below and above content
• made sure there are no scroll effects
Problem B:
Accordion FAQ does not push down any content below {again please be aware when I copy the accordion and the below box and text on to a clean site it works! So I don't understand why it does not work on my site.}
• I tried putting them on separate and one layer
• tired them below and above content
• made sure there are no scroll effects
I modified your file and you can have a look here: https://www.dropbox.com/s/fx2zsajo9mi7fei/PulseFitness_02mod.muse?dl=0
But be aware: This file is saved with the new version of Muse, released yesterday. It won’t open with any older version.
First two annotations:
Copy link to clipboard
Copied
Without inspecting deeper, I guess, beside the fact, that your accordion doesn`t push down content on any breakpoint,
you have pinned somthing below the accordion. This should not be done.
No pinning below the accordion, then it should work.
Best Regards,
Uwe
Copy link to clipboard
Copied
When you speak about pinned am I presuming correct that you are talking about the pin option in the top menu?
It was pinned, but I also unpinned it and tried it too and it still does not work. (is this the pin you were talking about)
Copy link to clipboard
Copied
Your pinning normally does not avoid push down, that´s right.
I am not able quickly to detect your mistake (and there´s one).
If I use an accordion out of the box, stretch it to browserwidth,
use some elements below, stretch them also to browserwidth, everything works out as expected.
There´s something strange with your footer guide lines, though, on master and the page.
Blend out everything except the first one below the accordion and find the mistake.
At the moment I couldn´t go through all elements (i don´t get paid by your client, unfortunately ).
Best Regards,
Uwe
Copy link to clipboard
Copied
I modified your file and you can have a look here: https://www.dropbox.com/s/fx2zsajo9mi7fei/PulseFitness_02mod.muse?dl=0
But be aware: This file is saved with the new version of Muse, released yesterday. It won’t open with any older version.
First two annotations:
But now to the „solution“:
The hamburger menu can be fixed by re-thinking its construction. Simplify it by filling the accordion title with an icon, and delete all these unnecessary elements, which are placed there. Just look at my file.
The accordion at the bottom can be fixed on different ways:
Look at the file, I linked above: The FAQ-accordion doesn’t work as expected.
Now group it with the elements above (I already grouped the elements above, leaving the FAQ accordion out), and it works as expected.
Or test-wise delete the FAQ-accordion and place a new one out of the widget library, this will work as well.
I simply think, that the whole page layout is too confusing for Muse to do everything right. Therefore you have to help by grouping elements
Copy link to clipboard
Copied
Thank you Günter
I have taken note of your two annotations.
I am going to test and apply your solution tomorrow (Have to update Muse tonight). Thank you for your time and effort.
Copy link to clipboard
Copied
iDESci Just a quick question/thought, not directly related to this issue but rather to your site in general; why do you want the top accordian menu to push content down and scroll with the page rather than work as a traditional header menu? As you have developed a single page website which uses a lot of anchors (and is also quite lengthy), by having the menu scroll as well you are making your users have to scroll a lot to get back to the menu and use it.
If you used a menu that was pinned to the browser at the top, and that was on a layer above your body content (so it cascades down over content rather than pushing it) your users would have constant and easy access to the various menu items.
You could also try a tabbed menu system to keep your options completely visible all the time. I am currently testing a version of this here: MENU TEST (note, you have to view in Chrome using device toolbar as it's only active from 768px down for tablets/phones). This option, in my opinion, works quite well with anchor-based sites as it encourages users to use the menu options rather than manually scroll.
Copy link to clipboard
Copied
Hi ncw92
Thank you for taking the time to look at my issue. I just looked at your way of using a menu from your file and I think it's a great idea for small sites with small menus. (also great for UX like you said).
I should have done it this way from the start - makes way more sense. Thank you! I will definitely consider this direction in future.
Copy link to clipboard
Copied
iDESci No problem, and thanks. I hope you can get your current menu system to work with what's been suggested!
Copy link to clipboard
Copied
Hi everyone, just some feedback from Adobe themselves.
Turns out there is a bug in the new Adobe Muse. They will fix this with the new update, however they did give me a work-around which was the same as mentioned above. When using the older version the file works fine.
From Adobe:
We followed below mentioned steps to make accordion widget work in your file on the latest version :
1) Removed the rectangles with "stretch to browser width" property.
2) Added new rectangles with the resize property other than "stretch to browser width" and pinned them to the center.
Thank you for everyones input.