Adding components

Adding components is a very simple process that allows you to speed up your development process by days. Components are sections developed with little to no style, so you can use them for any design and project you want.

Our components are divided into numerous categories so you can find and choose your preferred component even faster.

‍

1. Choose a component

To choose a component, open the "Components" tab in the GridUp Chrome extension. There you can select the category you want to work with. For example, if you are looking for a header, click on the "Header" field and you will be shown a variety of components for the header.

2. Add the component to your page

To add this component to your page, you now click on the Copy button.

With the key combination cmd + v or ctrl + v  you can insert the component at the proper place in your page.

If you use GridUp's page structure or Finsweet's page structure, you insert the component at the suitable place inside the main wrapper.

3. Customize your components

If you have inserted a component, the buttons will be replaced automatically by your preconfigured GridUp buttons. If you have also activated the style sync, the style of the component will automatically be adapted to the style configured by you in the style guide. All you need to do now is customize the component so that it matches your exact design.

‍

More useful tips about components

To get even more out of your work with components, we have compiled the most useful tips for your work with them below.

Browse components in our component library

If you want to view the components on a larger screen than the Chrome Extension, you can easily browse them in the component library on the GridUp page.

Use filters to select faster

Use the filters in the extension and in the component library to select the right component even faster. The filters are dynamic and are displayed by category.

Use favorites to find your most loved components

Mark your favorite components with the favorites icon and keep them just a few clicks away. This way you can find and use them in just a few seconds.

Custom components

Among the components you will find several custom components that cannot be implemented with Webflow alone and therefore contain custom code. We will show you how to customize them in this article.

‍