Springly lets you build a full website with custom pages. These pages let you freely arrange pre-formatted blocks (text, image, etc.) on a layout grid.
In this article:
Creating a custom page
To create a custom page:
- Go to Website > Menus and pages;
- then click the "New page" button in the top right corner of your screen.
A page creation window opens:
You can name the page and set its visibility options. This article explains how to manage the visibility of your pages and menus.
You'll find the page in the "Drafts" area on the right. Hover over the icon on the page, then click "Edit page" to start editing the page content.
Once it's ready to publish, simply drag it using the icon into the menu of your choice in the center of the screen to make it live.
How the page works
The editing page provides a toolbar on the left side of the screen. This toolbar contains several blocks that you can easily drag onto the central grid.
You can insert:
- Text blocks;
- articles you've written;
- events organized by your nonprofit;
- your social media feeds;
- graphic elements: images, image galleries, lines;
- an iframe block to embed maps or other pages from an external site;
- redirect buttons;
- files visitors can download;
- videos;
- contacts;
- and more.
Springly also lets you add backgrounds to your custom page. Backgrounds give your content a more professional, dynamic, and personalized look.
Drag-and-drop system
Blocks can be easily placed on the grid to start building your page.
- Pick up a block and drag it onto the grid (hold down the mouse button and drop it where you want it):
- Grid cells highlighted in green indicate a valid drop zone — release the mouse button to place the block there;
- If cells appear in red, they're already occupied by another element. You cannot overlap two elements. Move your block until you find an available spot.
- Once the block is on the grid, move and resize it by dragging the small white squares on its four edges;
- You can then start working specifically on that block.
Options for each block
Each block has its own options: add a border, background color, delete, etc. These options appear on the left side of your screen when the block is selected.
To manage a block's options, simply select it by clicking on it.
Once you're done making changes, click "Save" ("Save"). Your changes are immediately applied to the public-facing page.
You can also go directly to your website by clicking "Visit your site" (below "Save" and "Grid") to preview how the page looks.
Any changes you make while working on the page are not saved until you explicitly save your work. We recommend saving your changes regularly.
Grouping blocks
To customize the responsive display on mobile, you'll need to group the text block with its button, and likewise keep the image block together with its button.
To group blocks, hold down Ctrl on your keyboard and click each block you want to group together. Once the blocks are selected, the option to group them will appear in the left panel.
After grouping, you'll have a single block (as shown below). You can ungroup them at any time if needed.
Here's how it looks on a tablet and mobile phone:
Be careful: if you group all blocks into a single block (text + images + buttons), the default reading rules will apply to the entire block. Best practice is to group only the blocks that belong together.
Page versions
Every time you save a page, Springly saves it as a new version. You can access only the 5 most recent versions. This lets you restore a previous version whenever needed.
Closing without saving
If you try to close a page with unsaved changes, a dialog box will appear.
The dialog box gives you the following options:
- To save your changes and close, click Cancel and then "Save";
- To exit without saving your changes, click Quit.
Want to go further? Learn how to manage each type of block:
Comments
0 comments
Article is closed for comments.