Hi there,

I have added the Accordion component for my FAQs and want each 'entry' to show as collapsed when I view the screen. Then, I just press the "+" sign or the FAQ and the rest of the panel appears. The problem is that when I view a small width, the accordion is all collapsed which is what I want and, also, the Inspector shows the 'eyeball' which I can click to reveal the contents if that is what I want. However, when the screen size is increased, the accordion menus are always showing as expanded and I can't find a way to collapse them. Even the Inspector doesn't show the 'eyeball' so I can't hide them.

I changed the "Data Allow All Closed" attribute to 'true' but the accordion is always showing as expanded.

Any ideas on how to always show the accordion in a collapsed state?

Thank you, Maz


BTW, screenshot 37 shows the collapsed menu and the other screenshot shows it expanded and it's this that I want to collapse.

The plus signs are, of course, for expanding accordion panels in browsers rather than in the Site Designer canvas.

At the foot of the Elements Tree in the Inspector panel is a tick box labelled somewhat as follows: 'Hide x items in this breakpoint'. Experimenting with clicking that a few times may show what to do to have all the accordion panels closed. That seems to do the trick for the 'Basic Accordion - All Closed' component in its original state.

If the above doesn't do the trick, it's probably best to zip up the project (.rsd) file and attach it to a post here, and someone may be able to help.

Frank

Here is a trick
Starring from smaller size select a container that has the eyeball showing
Move over to layout and the tab "display" check the settings for it it will be set to display = none,

Now move the slider up until you see it change, then simply make the setting =none continue sliding up to make sure it doesn't chang back again at another point

repeat for all others you wish to be hidden.

Hi Frank,

Thanks for your reply. I understand that the plus sign is for the browser. I get the eyeball for lower screen layouts but when I move higher, the 'no hidden items in this breakpoint' becomes unselectable!

I have attached a zipped file of the site below and would be grateful if you can look at this or someone else...


Many thanks... Maz

Hi there,

I didn't understand where I should be looking at for the 'display' check and setting it to 'none'... sorry.

I can alter the screen size and see the accordion collapsing in the smaller screen settings but expanding once I increase over a certain breakpoint. Also, as I mentioned before, the 'no hidden items in this breakpoint' becomes unselectable after a certain screen width.

Thanks, Maz

Here is a zipped file of the project I'm working on for a friend...

The problem is in the FAQ page in the top menu.

The zipped file is the project compressed but with all the images removed because it was too big to attach due to the 2MB size limit.

Thanks, Maz

Hi Maz, the Display is on the Style pane, just below the highlighted button 'Layout' It shows the word Table, but you can select None by scrolling it a bit.

beat me to it
there was going to be a short demo but now not

I would try
(a) selecting one of the containers that has the class 'accordion-content';
(b) ensuring that the Toggle Breakpoints button is set to Default mode, and selecting 1024 in the dropdown list;
(c) in Styles > 'Apply styles' > Reset and in the '1024px Breakpoint Styles' deleting 'display'.

After that my previous answer works to expand or collapse the items on the SD canvas.

Frank

Hi to all...

Thank you so much for your help.

Yep, I managed to find the setting and increased the screen width using the slider and changed to "none" when it changed the setting.

All is now working perfectly...

Thank you Frank, A Nony Mouse, and Inger