Glide Library
Searchโ€ฆ
๐Ÿ“ƒ
Introduction to Pages
An example of a Glide Pages website
Glide Pages is a new tool that extends the software you can make; from mobile โ€“ to desktop and the web. Pages are powered by your data, just like Glide Apps โ€“ but their design and functionality are more attuned to desktop use.
With Pages, you can build beautiful, standalone websites or create multi-app scenarios with numerous Apps and Pages all sharing the same database.
Pages is still being developed and so there are parts of this guide that may become out of date quite quickly. We will continue to update the documentation as fast as we can. For now, if anything is unclear you can reach out to others in the community with any questions.

Projects

Your Dashboard now shows you all your projects โ€“ whether they are Apps or Pages. And when you create a new project, you'll be able to choose what to create.
Glide Pages
The way we build Glide Pages is very similar to the way we build Glide Apps โ€“ by adding components and layouts and connecting them to our data. However, because Pages are designed primarily for desktop use, there are some significant differences.

Differences with Layout

The first difference is that Glide Pages does not have layouts in the same way as Apps have List Screen Layouts. In other words, every screen in Pages is a Details Screen, and within that screen, we can add all our Components.
Therefore, we have a single component called a Collection. You can think of this as the equivalent of an Inline List - but with much more power and extensibility.
So when you create a new Tab, it will always be a Details Screen and you have to add collections to create lists. However, Tabs still have a Table that they are connected to โ€“ even if none of the components you eventually use on that page reference the data in that table.
Any new Tab will still be connected to a table.

Tabs are now Pages

In Apps, top-level screens are called 'Tabs'. In Pages they are called 'Pages'!

Pages settings

Under each Page's settings (AKA Tabs in Apps), there are two new settings that we can adjust.

Page slug

We can now add a Slug to our Page URL. A Slug is the part of a URL that identifies a particular page on a website in an easy-to-read form. In other words, itโ€™s the part of the URL that explains the pageโ€™s content.

Show in menu

There is now a checkbox for Show in menu. If we select it only on one Page, when we click on our Web Page title on the header, it will redirect us to the page that has the checkbox set as true.
If we set the checkbox to true on two or more Pages, we'll find the name of our Pages in the menu.
Show in menu

Differences with Components

For now, many components are still the same as they are in Apps, particularly Entry Fields, Pickers and Buttons. If you don't find documentation for a Pages component listed in this guide, you can search for it in the Apps' Components Section of this library.
Entry fields, pickers and buttons are very similar to Glide Apps components (for now)

Component subcategory

Certain components have many settings you can configure. For example, the Title Component has four subcategories, Content, Image, Background, and Actions. To make this easier to navigate, the component on the left of Glide has subcategories โ€“ which, when clicked, show only the settings that fall under that category.
Component subcategory

Differences with Actions

A major difference between mobile & desktop is of course the use of a mouse and generally, desktop interfaces have more buttons and menus that you can click. Therefore, in Pages you can create many more actions on individual components.
The Title Component with two top level actions and a menu with 4 more
For example, in the Title Component's configuration, you can add many different actions and these will automatically be added to a submenu when the list gets too long.
We can add many more actions to an individual component
There are some small variations with the individual actions. For example, if we select Show Detail Screen, we can choose how to display the information by changing our Target. We'll find four options to choose from, Current, Main, Small Modal, or Large Modal. The same will apply when we select Show Edit Screen, Show Form Screen, Show New Screen, or Show User Profile Screen.
There are likely to be many other little differences that develop over time as Pages and Apps become more distinct from each other.
๐Ÿง  If you're keen on a deeper understanding between Pages & Apps, check out this guide on the Navigation Model.โ€‹
โ€‹
Last modified 6d ago