Please ensure Javascript is enabled for purposes of website accessibility

Mastering Website Editing on Pagesence Cloud: A Step-by-Step Guide


Welcome to the ultimate guide on navigating Pagesence Cloud and efficiently editing the content of your website. Whether you're a seasoned Pagesence user or a newcomer, this comprehensive tutorial aims to empower you to effortlessly build and edit your website using the Pagesence Cloud Content Management System (CMS).

Aim & Objective:

The primary goal of this document is to serve as your go-to resource, providing detailed insights into the Pagesence Cloud interface and guiding you through the process of creating and editing web content.

Section 1: Logging In

To begin your website editing journey, log in to Simply click on the user icon to display the sign-in prompt and enter your login details.

Upon successfully logging in to your Pagesence Cloud account using your login credentials, you will be greeted with an interface resembling this.


Section 2: Starting a New Project

To initiate a new project, click on "create new project" and follow the prompts. The Pagesence Cloud CMS boasts an intuitive interface, allowing you to seamlessly add design elements and manage blocks.


Section 2: Starting a New Project

To initiate a new project, click on "create new project" and follow the prompts. The Pagesence Cloud CMS boasts an intuitive interface, allowing you to seamlessly add design elements and manage blocks.

Section 3: Getting Started

When you successfully log in to Pagesence Cloud, you'll be greeted by a well-organized interface designed for efficient website management. This interface consists of several key components that play distinct roles in the website editing process:

  • Left Panel: Positioned conveniently on the left side, this panel serves as your command center. It provides quick access to essential functionalities, such as adding design elements, configuring page layouts, and toggling between various device modes (desktop, tablet, and smartphone). The left panel essentially acts as your toolbox, offering a range of options to shape the visual aspects of your website..

  • Canvas Area: The central workspace where your creative journey unfolds. In this expansive area, you'll assemble and arrange design elements to bring your website vision to life. It's a blank canvas ready for your artistic input, providing the flexibility needed to craft a visually appealing and functional website.

  • Settings Bar: Positioned strategically, usually above or around the canvas area, the settings bar is your control panel for individual design elements. When you select a specific element on the canvas, the settings bar dynamically adjusts to present customization options. This enables you to tweak and fine-tune the properties of each element, ensuring precision in design.

  • Settings Panel: Complementing the settings bar, the settings panel appears on the right side of the interface. Activated by clicking the gear icon on the settings bar, this panel offers advanced configurations for the selected design element. It is here that you can delve into more intricate settings, allowing for a higher level of customization.

In essence, the synergy between these components forms the backbone of your editing experience on Pagesence Cloud. The left panel and canvas area provide accessibility and creativity, while the settings bar and panel grant you the power to tailor each element to perfection. Together, they create a user-friendly environment that empowers you to effortlessly shape and refine your website.

Section 4: Making Edits

After opening the project you wish to edit, navigate to the desired page using the hamburger menu.


To edit a page, click on the edit icon for that specific page, as demonstrated here.


Section 5: Editing Texts

Editing text on your website is as simple as changing text on your phone. Use the 'T' icon to select font type and size. To change font color, click on the color box and select your preferred color.


Section 6: Adding and Changing Images

To modify or add an image, drag and drop the image icon onto the canvas. To change an image, click on it, delete using the 'X' sign, and add a new image.


Section 7: Saving / Publishing After Editing

Ensure to click on the "Save Drafts" or "Publish" button consistently to safeguard your edits. It's important to note that Pagesence Cloud doesn’t have an autosave feature. Therefore, you must manually save each edit or correction to ensure it takes effect.


Using keyboard shortcuts

To streamline your workflow, Pagesence Cloud offers keyboard shortcuts you can make use of. You can see the list of keyboard shortcuts by clicking the hamburger icon on the bottom-left corner and selecting Shortcuts. Here are the keyboard shortcuts offered by Pagesence Cloud.

Pagesence Cloud shortcuts

Ctrl + C


Ctrl + V


Ctrl + Shift + V

Paste stylexcf+

Ctrl + D


Ctrl + Left/right arrows

Horizontal Align

Ctrl + Up/down arrows

Vertical Align

Ctrl + Z

Undo last operation

Ctrl + Shift + Z


Ctrl + S

Save draft/Update page

Ctrl + +/-

Responsive zoom in/zoom out

Ctrl + Shift + A

Add a new block


Select the parent element

In conclusion, mastering website editing on Pagesence Cloud opens up a world of creative possibilities for crafting a digital presence that truly reflects your vision. With this step-by-step guide, you've gained the skills to navigate the Pagesence Cloud seamlessly, from starting a new project to fine-tuning every element. Remember, the power to shape your online identity is now at your fingertips. So, embrace the creative journey, experiment with designs, and watch your website transform into a compelling representation of your brand. Happy editing!


Marina Motel Case study
Automating Team Birthday Celebrations with Airtable: A Step-by-Step Guide
Mastering Website Editing on Pagesence Cloud: A Step-by-Step Guide

Made With Pagesence Cloud