Collection list layout

Gutters refer to the whitespace between content columns on a webpage.

BiDi stands for bidirectional. When a document is BiDi, it supports text that reads from right to left and left to right.

Conditionals, also known as conditional statements or expressions, are coding instructions that tell a program to execute an action for a certain condition.

A form element that allows you to make a selection in a dropdown list.

Display properties tell browsers how an element should behave on the page. The most common display property keyword category is display: block.

A measurement unit relative to an element's parent.

Automagically describes complex content or functions that appear as if they were created using magic.

A language code is a standardized code of letters and numbers that represent different languages.

Keyboard shortcuts are combinations of keys on a computer keyboard that perform a specific action or command within an application or operating system.

An application context is a set of data that identifies an application’s tasks, where those tasks originate, and how those tasks are configured.

JavaScript is a programming language web developers use to create dynamic interactions and effects for web pages and applications.

Top margin is a CSS property that defines the space between the top edge of an element and its surroundings, such as other elements, the browser window, or the edge of a container.

A Graphical User Interface (GUI) is a visual medium that enables visual interaction with software applications or electronic devices through elements like icons, buttons, and menus.

A key, or web key, is a unique identifier that authorizes access to a webpage or service.

What you create in Webflow! You can publish sites to a webflow.io staging subdomain for free, export the code on a paid plan, add hosting on any paid plan, or add a Site plan to any site to connect your custom domain and unlock hosting features.

In CSS, flex-order is a property that allows you to manipulate the default source order of the items within a flex container. Flex-order is especially useful when you want content to display differently on mobile than on desktop.

The ability to manually save a version of your site that you can restore at a later date using the keyboard shortcut Command + Shift + S (on Mac) or Control + Shift + S (on Windows).‍

Form blocks allow you to add form elements to a website, including appointment booking, surveys, applications, polls, and contact forms.

A call stack is an ordered list of the functions (or stack frames) a program has to execute before it returns a result.

Cryptanalysis examines cryptographic systems to find weaknesses that could allow attackers to uncover plaintext or break encryption.

The total weight of your site's HTML, CSS, JS, and images.

The far right vertical panel in the Designer that houses the Style panel, Element settings panel, Style manager panel, and Interactions panel.

A plugin, also called an add-on or extension, is a software component that enhances the host or browser or application by adding new features or capabilities to it.

A bottom bar is a navigation bar at the bottom of an app or webpage.

A navbar, or navigation bar, is an interactive user element with a menu or a set of links to a website’s main sections.

Python is a high-level, object-oriented, general-purpose programming language (GPL).

The <strong> element defines important text with added semantic importance.

A link, short for hyperlink, is a clickable website element that enables navigation between different web resources.

A bounding box is a rectangular border around a website element (e.g., a heading, paragraph, or image) that appears during the design process.

An IP (Internet Protocol) address is a unique string of characters identifying devices connected to the internet.

The first tab in the right-side panel that allows you to assign classes to elements and style them.

The default UI state for Collection lists, which displays the items in the Collection. It is the opposite of the empty state.

A CSS descriptor sets specific properties and values of an at-rule (@-rule) element, dictating its appearance and behavior on a web page.

A lightbox displays content in a popup or modal window on top of a web page’s main content.

You can manage your site pages within Page settings. Here, you can rename, duplicate, delete, or save pages as drafts. You can also set SEO, Open Graph, and site search settings, as well as insert custom code. Additionally, you can set RSS settings for Collection pages.

Hyperlinks are clickable elements that allow users to navigate between web pages, documents, or other types of digital content.

Object-oriented programming (OOP) is a programming approach that organizes code into self-contained units of data, functions, and behavior.

A cryptographic hash function takes an input message of any length, such as a file, message, or password, and uses a mathematical formula to produce a fixed-size output (hash).

A slug, also known as a URL slug or a website slug, is descriptive text that appears at the end of a URL and identifies a web page.

A Domain-Specific Language (DSL) is computer script that solves software problems in a specific domain.

Bad neighborhoods are groups of websites that search engines have downgraded because they violate search engine guidelines.

A registrar, or domain name server (DNS) registrar, manages the sale of domain names and the assignment of IP addresses, ensuring each domain’s uniqueness.

A closing tag is an instructional piece of code that ends a section of page content in HTML.

A Webflow canvas setting for creating styles that affect viewports with a minimum width of 768px and a maximum width of 990px. Also known as the tablet media query.

Authoring Tool Accessibility Guidelines (ATAG) are a layered rule-set that influence how designers and developers create a more accessible internet.

Shared Workspace templates are templates made from your own sites. They can help you create sites with similar layouts and increase your efficiency when designing. Your Workspace members will also have access to your shared Workspace template(s).

A buffer is a temporary storage area that holds data while transferring it between different components or systems.

Flexbox is a CSS layout mechanism that offers precise alignment and stacking control for the content inside an element.

A robots.txt file instructs search engine crawlers which webpages and sections they can or can't crawl and index.

An element that shares the same parent of another element.

In software and web development, deployment is the process of moving code from one environment to another, usually in the form of changes or updates.

The Designer automatically saves your progress every 10 seconds.

A 256 x 256 px image associated with your website that shows up when your website link is saved to an iPhone home screen.

The type of element you're working with, i.e., H1, link, button, etc.

The amount of times a site visitor submits data using your site's form(s).

The most flexible display property in CSS is the aptly named display: flex, which allows you to create flexible layouts with elements that you can align and distribute vertically or horizontally.

Domain name forwarding is a process that automatically redirects visitors from your domain name to a different web address.

The document object model is a platform- and language-neutral interface that lets programs and scripts dynamically access and update the content, structure, and style of documents.

A bug is an error, fault, or flaw in an application or software that causes the program to behave unexpectedly, often producing inaccurate and invalid output.

BigInt, which stands for “big integer,” is a JavaScript data type. JavaScript uses data types to decide how to treat a piece of data.

Email confirmations you receive upon making Webflow payments.

A Webflow plan that applies to your entire Workspace.

The location your sitemap is stored in relation to your site, and what’s used when submitting your sitemap to search engines.

A ligature in typography groups adjacent letters or characters into one glyph.

Allows you to manage your folders.

The perfect Webflow subscription for getting started, giving you access to all Designer features, so you can start building a site right away.

The order in which a Webflow site's CSS styles flow from desktop to mobile breakpoints.

A digital certificate is a data file embedded in the site that signals the site’s safety to visitors, internet service providers (ISPs), and servers.

Ciphertext is unreadable, encrypted data that ciphers use for security during data transit.

A Webflow element that displays graphical files on your website.

By default, Collection lists display all items in a Collection, but you can add limits to control the number of Collection items that display.

A field available in CMS Collections. This field lets you display a date and time in a Collection and/or Collection item.

A Hypertext Markup Language (HTML) tag is a code snippet that defines and describes the structure and content of web pages.

Flex-direction is a CSS property that defines the main axis and direction of flex items, dictating the arrangement of the items within a flex container.

An attribute in HTML is a term inside an opening tag of an element, such as a font or color, that provides additional information about the element.

The “max-width” CSS property defines an element’s maximum width.

A shim is a code snippet enabling modern web features to function within older programming or browsing environments.

A typography element that is used when no other element is specifically suitable.

The flex-grow CSS property defines how much an element grows relative to other flexible items inside the same flex parent.

A rich text field is an input tool for formatting or applying text styles, such as bold, colors, font sizes, italics, underline, and other visual modifications.

The last time your site was published.

Micro conversions are small but important user actions on a website that contribute to the overall conversion funnel.

Webflow's visual content editor. You can access it through the Webflow Dashboard by clicking the “3 disclosure dots” on a site thumbnail, then clicking “Editor.” Guest editors can access it anywhere on their live site by adding ?edit after the page URL (e.g., yoursite.com/page/?edit).

A/B testing compares two different versions of something — like a web page or campaign — to determine which performs better.

Traffic, or web traffic, refers to the number of users who visit a website over a period of time.

A Webflow service that lets you point a custom domain to your Webflow-hosted site.

A Webflow element that displays externally hosted videos such as YouTube and Vimeo.

A domain, or domain name, is the unique address that directs to a website on the internet.

A 404 page is an error page a visitor sees when they try to access a non-existent or broken URL on a website.

Custom code that's added just before the closing </head> tag in your site's HTML file. Learn more about custom code in head and body tags.

Cloneable sites are open source (made available under the CC0 (“no rights reserved”) license). When you enable cloning, you allow any user to copy, modify, and use any part of your site for personal or commercial purposes.Sites with cloning turned off do not give others access to copy your site or open it in the Designer.

Defines how tall an element can be. This can be defined in absolute terms (pixels) or relative terms (ems, rems, percentages, viewport-height, or viewport-width).

Webflow's content management system (CMS) is where dynamic content (Collections and their Collection items) is stored and maintained so you can reference it throughout your site. A CMS lets you input data in one location, then use Collection template pages or Collection lists to display that content without having to update the content displays one at a time.

The display: inline CSS property is a display option that controls an element’s appearance and layout.

When someone sends data through one of your site's forms.

An element that contains content.

A CMS field used in Collections. Just like a reference field, the multi-reference field lets you reference other Collections in your site. But it’s even more powerful, as it lets you reference multiple items within a Collection instead of just 1 item.

“Null” represents the absence of a value or the presence of invalid objects in computer science and web development.

A sidebar, typically positioned on the left or right side of a website or app, is a vertical component that contains supplemental information to enrich a webpage’s primary content.

An individual item within a Collection. For example, in a “Blog Posts” Collection, the Collection items are individual blog posts.