Intro
The.com offers a revolutionary new way to create, build, and manage websites. With integrated workflows like media management and easy client handoff, you have the ability to increase your build speed, build new revenue streams, and keep your clients happy.
The.com is different from any website builder or CMS you’ve used in the past. The cell-based system is modeled after a spreadsheet, giving you direct access to any element on the screen. It is so robust and light that it simply floats in front of your website as you edit.
This article is an overview of the platform and highlights some key terms including:
The goal is to get familiar with them before you dive deeper into each one in separate and more comprehensive articles.
Overview
Profile
Your Profile is where you create and manage your websites. Here, you can see all the sites you own or have been invited to.
Each website is represented with a name, a preview of the homepage, and a URL. There is also a range of actions related to the site such as viewing analytics, last editing timestamps, and site settings.
Access a site’s settings through the gear icon. This allows you to connect a custom domain, connect to Google Analytics, transfer ownership, or add people to the site.
On the Profile, you can also view your account via the “Account” link located in the upper right corner. At this time the account link lets you access a page where you can manage your subscription including your payment method and billing history. There is also an option to see what’s new on The.com located at the top of the Sites Profile.
Creating a new site
On your Profile, click the “+ New Site” button in the Toolbar located at the bottom of the screen. This will spin up a new site. Click into the site to edit it, where you will be brought to the Worksheet.
Worksheet
The Worksheet is your hub for creating and organizing content on your site. It is the first thing you’ll see when creating or opening a site. You can add and access Pages, Blocks, Sheets, Media, Fonts, and more from the Worksheet.
The Toolbar
The Toolbar is located at the bottom of the floating editor. It 's used for navigating open pages and for certain editing actions such as accessing the Command Palette, redirects, the Fontsheet, Save All, Lock All Pages, and Deploy All.
The Toolbar is contextual, so the exact options will change depending on if you are editing a Page, Block, Sheet, or looking at the Worksheet.
Pages
Pages let you edit and build pages on your site. Pages can be added from the Worksheet by clicking the "+ Page" cell.
New and blank pages will have a blue grid as the background.
Elements
Elements are used to build your site. They can be thought of as HTML tags or types of content (headings, images, paragraphs, links, etc). If you are getting a Page Sheet, you can add an Element by clicking "+ Element" in the Elements Column of the editor. To create a nested Element, use the blue "+" that sits between elements.
There are two main types of elements: containers and content. When adding an element that needs text, you can click next to its icon and start typing.
You can also click the icon in the cell's top-right corner to open its corner menu. This allows you to delete or duplicate the element, make the element (and its children into a block), or view and edit its HTML attributes.
Command Palette
The Command Palette is The.com's built in search and navigation tool. Click the searchbar in the toolbar or use the keyboard shortcut CMD + K to bring it up.
One main use case is to search for any CSS style property. For example, if you search for "background" allt the background-related properties will show up in as the search results. Simply click whichever you are looking for, and the editor will jump to that style's column.
Another use case it to open or navigate between sites, pages, and blocks.
Blocks
A Block is a reusable group of Elements. Blocks are useful when you don’t want to repeat your work. When editing a Block, the editor will turn dark grey (opposed to white when editing a Page).
Once you’ve made a Block, you can then add it to a Page that you’re building. You can set up variables in Blocks to make certain aspects editable per Block instance, such as text or color.
Blocks do not have to be complex. For example, a Block can be a simple button that you want to reuse numerous times on your site or it could be a footer that has multiple elements nested within it.
Sheets
A Sheet is like an exposed database that helps you utilize large amounts of content or data. It allows you to create your own rows and columns to fit the needs of your project.
Sheets are generally used for storing large sets of data and feeding that data to reusable Blocks with different parameters such as blog posts, employees, products, etc.
Sheets can be used to store general data too. You can import data from .csv files.
Media & Fonts
Media includes any file that supplements your web content and could include images, video, PDFs and more. Fonts work in a similar way but are separated into their own row on the Worksheet for organization purposes.
The quickest way to add media or font files is to drag a file from your file browser into any cell on the Worksheet.
Next Steps
Now that you're familiar with the basic concepts of the editor, it's time to take a more detailed look into them to truly understand how to build with The.com.
Comments
0 comments
Please sign in to leave a comment.