Gradient

CONTENT MANAGEMENT SYSTEM

Content creation you’ll enjoy.

Everything you need to manage content for your blog posts, job listings, and marketing pages. Generate pages based on CMS entries and easily update content across your site.

New Item

Site

·

framer.com

Memoji
Memoji
Publish
Collections
Blog

7

Get Started

12

Jobs

8

Support

61

Team

36

Testimonials

9

Use Cases

6

Blog

7

Documentation

Title
Date

Category

Featured

Tint

Image

Designing a Web Page

4 February 2023

Guide

Yes

How to Become a Web Designer

1 February 2023

Editorial

Yes

How to Create a Landing Page

30 January 2023

Guide

Yes

Building a Navigation

25 January 2023

Guide

No

Making Framer Fast

18 January 2023

Editorial

No

Inspirational Websites Roundup

15 January 2023

Editorial

Yes

The Five Levels of Hype

30 January 2023

Editorial

No

Making Your Website Inclusive for All

2 February 2022

Guide

Yes

Exploring Parallax Scrolling in Web Design

2 February 2022

Editorial

No

The Importance of Performance in Web Design

2 February 2022

Editorial

No

Creating a User-Friendly Navigation

2 February 2022

Editorial

Yes

Blog Item
Preview

Save

Title

Designing a Web Page

Slug

designing-a-web-page

Date

4 February 2023

Cover

cover.jpg

2048 × 1324

Content

Paragraph

So you're ready to design the web page for your next big project, but you aren't sure where to start. We get it. Deciding on a web page layout takes some thought, but you can design a site that looks nice and makes your message bolder with a solid plan.


What does a career in web design involve?


A career in website design can involve the design, creation, and coding of a range of website types. Other tasks will typically include liaising with clients and discussing website specifications, incorporating feedback, working on graphic design and image editing.

Dead simple. Surprisingly powerful.

Powerful layouts, simple design tools.

With a simple interface, you can easily add, edit, and delete your content as needed without having to jump into the design canvas. Make it easy for anyone, such as your clients or team, to edit the site. Use filters and transforms to modify the data and display it on the canvas.

With a simple interface, you can easily add, edit, and delete your content as needed without having to jump into the design canvas. Make it easy for anyone, such as your clients or team, to edit the site. Use filters and transforms to modify the data and display it on the canvas.

Collections

Run a blog, list job openings, or manage your event schedule.

New Item
Collections
Blog

7

Team

36

Jobs

8

Docs

21

Blog

7

Documentation

Image

Tint

Title
Date

Featured

Designing a Web Page

25 April 2022

Yes

How to Become a Web Designer

25 April 2022

Yes

How to Create a Landing Page

25 April 2022

Yes

CMS Pages

Design a template for generating pages for each item in your collection.

Blog Item
Preview

Save

Title

Typography in Web Design

Slug

typography-in-web-design

framer.com/blog/typography-in-web-design

Date

January 3, 2023

Cover
Blog post thumbnail

gradient.jpg

2560 × 1440

Content

Paragraph

So you’re ready to design the web page for your next big project, but you aren't sure where to start. We get it. Deciding on a web page layout takes some thought, but you can design a site that looks nice and makes your message bolder with a solid plan.


A career in website design can involve the design, creation, and coding of a range of website types. Other tasks will typically include liaising with clients and discussing website specifications, incorporating feedback, working on graphic design and image editing.

Limit & Offset

Set the maximum number of items displayed and define the starting offset.

Blog website
Blog website

Collection Lists

Add content from your CMS on any page using collection blocks.

  • Blog

    Team

    Jobs

    Docs

    Use Cases

    Testimonials

  • Blog

    Team

    Jobs

    Docs

    Use Cases

    Testimonials

Field Types

Set up different types of input fields depending on your content.

Blog Fields

Name

Brand Identity Through Web D…

Default
None
Placeholder
Blog Post Title
Text Area
True
False

Transforms

Add prefixes and suffixes to your text variables.

FEB 03, 2023

February

Update

Filters

Show content based on a wide variety of filters. Combine filters for fine-grained control.

Careers

Amsterdam

5

Product Designer

Data Scientist

Frontend Engineer

Sales Manager

Brand Designer

Conditionals

Use conditional visibility to dynamically show or hide content from your CMS.

featured

Typography in Web Design

Collections

Collections allow you to manage and display content on your website easily. A Collection in Framer functions like a simple database, where you use a set of different fields, each with a specific type, to collect a list of items that can be stored and referenced throughout the website. This allows for greater flexibility and control over the website’s content, making it easy to keep up-to-date with fresh and relevant information without touching your site’s design.

gradient
gradient

CMS Pages

CMS Pages allow you to display content like blog posts, help articles, updates, job offers, etc., based on CMS items. The CMS Pages work like templates, where the structure and style are automatically applied to all the pages; this means that the layout and design of the CMS Page apply to all the automatically generated pages. This feature makes it easy to keep your website design consistent and structured while allowing you to update and manage the content quickly.

gradient
gradient

Collection List

Collection Lists allow you to display a list of items from a CMS collection on any page you want. The ability to display multiple items in a single list makes it easy to create pages that show a collection of products, blog posts, or other types of content. All CMS items will default to being displayed in a CMS collection list. Using a combination of Start Offset, Limit, and other filters, you can create specific collection lists showing just the content you want.

Blog

Docs

Features

Jobs

Projects

Team

Testimonials

Use Cases

gradient
gradient

Limit & Offset

Limits allow you to set the maximum number of items displayed from a CMS collection, helping you control the amount of content shown to your users.

Limits are helpful when you have a large amount of content and don’t want to display it all at once. Setting limits can also help improve the site’s performance by reducing the amount of content that needs to be loaded at once.

Offset allows you to choose which item to start displaying items from a CMS collection, for example, skipping the first two items.

Blog website
Blog website
gradient
gradient

Field Types

Set up different types of input fields depending on the content you CMS item needs. Use text fields to display strings, date fields to show formatted dates, and rich text fields to style your blog posts. Almost every styling option can be turned into a CMS field.

Blog Fields

Title
Slug
Date
Content
Cover
Category

Featured

Tint

Name

Brand Identity Through Web D…

Default
None
Placeholder
Blog Post Title
Text Area
True
False
gradient
gradient

Transforms

CMS Transforms allow you to add prefixes and suffixes to your text variables. This feature can be helpful when you need to make global changes to the text in your designs, such as adding units of measurement or currency symbols. With Transforms, you can easily apply these changes across your design, saving you time and effort in updating your text manually.

FEB 03, 2023

February

Update

gradient
gradient

Filters

Sort and filter content within a CMS collection. Easily access and manipulate specific data items in a Collection based on criteria such as date, author, or category. Filters make it easy to display the content you need for specific sections of your site.

Careers

Amsterdam

5

Product Designer

Data Scientist

Frontend Engineer

Sales Manager

Brand Designer

gradient
gradient

Conditionals

Use conditional visibility to show or hide elements in your collection dynamically. Conditionals allow you to control the visibility of specific details in your design based on certain conditions or criteria, such as only showing a featured badge when a CMS item is set to featured.

featured

Typography in Web Design

Typography in Web Design

Typography plays a crucial role in web design as it helps to create a visual hierarchy and improves the readability of text on a website. It can also be used to convey a specific tone or brand personality. When choosing a typeface for a website, it's important to select a font that is easy to read on different screen sizes and devices.

featured

Typography in Web Design

Typography plays a crucial role in web design as it helps to create a visual hierarchy and improves the readability of text on a website. It can also be used to convey a specific tone or brand personality. When choosing a typeface for a website, it's important to select a font that is easy to read on different screen sizes and devices.

gradient
gradient

Design & Layout

Design flexible layouts, faster on a familiar free-form canvas.

Effects

Effortlessly create stunning animations with just a few clicks.

Navigation

Move between different pages or sections of the site.

Site Management

Manage website settings like passwords and custom domains.

SEO & Performance

Manage content for a blog posts, job listings, or marketing pages.