Tagged: 

Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • #1144886

    We have a dictionary on our page and I would like to improve the navigation and view. I was thinking about changing to one accordion module for each letter in the dictionary. In addition, I would like to have a navigation option that makes it faster to scroll to the letter you are looking for, for instance “S”. For instance something that gives similar functionality as in the contacts in my cellphone, where I have the letters in the right of the screen. Do you have any advice for how to implement a suitable navigation in the dictionary? I see that you have sortable accordion, maybe that would be the best? Alternatively, on desktop I think I could use a fullwidth sub-menu, which is handy because it is fixed at the top. But what on cellphone, would you recommend any navigation within the dictionary in additional to scrolling?

    #1145289

    Hey guttogjente,

    You might want to consult with the UX designer on the matter, I am not sure even that the accordion will do the job for you.

    Best regards,
    Victoria

    #1145602

    Thanks for the reply, Victoria! A UX designer would be great, but because we are an NGO with limited budget I try to do most of the work myself as an volunteer.

    I noticed that the navigation arrows to next and previous item is missing on my iPhone, but is present at computer for our glossary (see example). Do you know why?

    Why don’t use the sortable accordion? In my opinion the benefit would be to reduce the number of times the user need to load a new page, since most users are on cellphone.

    As alternativesI found a plugin called CM Tooltip Glossary (see example), which might be an option. I am also considering to change to the Divi theme and make the dictionary in Divi, who has a design option for his with dotted navigation in the side that can be changed to letters.

    #1147230

    Hi guttogjente,

    The arrows are hidden by design. Here is how you can have them back:

    
    @media only screen and (max-width: 767px) {
        .responsive #top .avia-post-nav {
            display: block;
        }
    }
    

    Well, you can try the sortable accordion and see how it works for you.
    Best regards,
    Victoria

Viewing 4 posts - 1 through 4 (of 4 total)
  • You must be logged in to reply to this topic.