I am trying to create a documentation webpage where you select buttons on the side. When selected, the buttons open that document page, but would like the webpage to be adjusted to the height of the document shown. Hope this makes sense.
There are a number of ways to achieve this in Sparkle - the choice will depend on a number of factors.
- What is the format of the documents (PDF, HTML)?
- Are all the documents the same size?
- Are they single page or multi-page documents?
- Do you need the index of documents available at all times?
Let us know and we’ll give you some ideas that are relevant to your needs.
Appreciate you insight. Right now, I wanted to create the “document pages” directly in Sparkle so i can embed videos, images, etc. But i want the “document page” to scroll and expand to its proper size (some doc pages smaller and some longer) and the left menu with document categories to remain in the same spot as I scroll. I hope this gives more information.
Probably one of the simplest options is to create your document pages as popups. This will allow you to add text and images etc. The popups would typically be fixed in window (see the settings below). This will allow you to create short or long documents that’ll scroll if they are longer than the screen.
Typically, you would create each document as a separate popup - possibly spanning three-quarters of the screen width. This will allow you to add an index of documents in the remaining web page space. The document index will be links that open the appropriate popup. The nice thing about this option is that all the links remain visible, even when scrolling the documents.
Be sure to give all popups the same group ID - this will prevent more than one popup opening at the same time.
Thank you for the reply, I have looked into this and looks like a good option, so I appreciate the extra information. Now I am thinking, is there some way to combine the popups to be expandable like block layouts are where they can open and close to expand so the primary webpage (before popups are opened) is not very long?
1 Like
There isn’t really a need to expand the web page because it remains in a fixed position when the popups open - only the popups scroll, leaving all the topics visible to the user. If you really wanted to include expanding layout blocks, you will have to set up the blocks as initially hidden, and then provide a link to toggle visibility of the blocks. The links to any popups would then have to be inside the layout blocks - there isn’t a way to have one link perform two actions, such as expand a layout block AND trigger a popup.
If the concern is keeping the main page within certain height parameters, one way to achieve that would be by splitting very long content pages over a number of popups. Doing this will allow you to place previous and next links within the popups to move visitors through the pages of each individual topic.
Thanks again for the insight. I will try to make this. The idea about next and previous is a good one about splitting things up. Great, appreciate it!
1 Like
Please try it. What you have to understand is that page content determines the actual height of the page and its ability to scroll. If, for example, you had series of text links on the page in a text box measuring 400 px high, the page will not scroll beyond the bottom of that text box (assuming there was nothing below the text box). However, when a fixed in window popup opens, it can be scrolled whilst the page remains exactly where it is. So, although you may have to extend the length of your pages in order to create some long popups, that page length will not affect the scrolling of the main page.
Okay, thank you. That makes sense and I will try this idea. Again, really appreciate the help.
1 Like
@francbrowne I added a layout block to the main page and within it added a context menu (buttons) so when I scroll through context menu layout block it can remain at the top. Unfortunately, many of the “documentation pages” are very long and cannot be split up. This causes the context menu on the left to stop scrolling while the right documentation page scrolls. It looks nice for longer ones, but the shorter ones get scrolled through quickly and then you have to keep scrolling through blank space to get to the end of the context menu on the left. So, I tried to create a layout block for each page to open and expand when the left context menu button is selected, but it is not working as I had envisioned.
It would be good if you could make the project file available, or if you can upload the site as it is at the moment to a server, so I can better grasp what you are trying to achieve. I’m sure there will be a simple solution, but I need to better understand what the actual issue is.