Customize Global Styles

Ruslan Galba
@hellotegra
Published in
4 min readFeb 8, 2020

Customize global styles 🎨

Courtesy of @leadpages

Global style settings in the Drag & Drop Builder make it easy to customize how your page or site looks and functions.

In this guide, you’ll learn about the different style options that are available in Leadpages Drag & Drop Builder ☝️

Illustration by Kari Moden

Tech Tips

Global style settings in the Drag&Drop Builder make it easy to customize how your page or site looks and functions. In this guide, you’ll learn about the different style options that are available in Leadpages Drag&Drop Builder.

Where to find page styles

Each Drag&Drop page has a set of global Page Styles. You can access them in the builder’s left-hand sidebar, as shown below.

About page styles

Change the entire look of your page on the fly with different fonts, colors, and more in style settings.

Font Styles

Here, you can set a default font and color for headings, text widgets, and countdown timers on your page.

Page Background

In this section, you can set a background color or image for your entire page. Use the color picker to choose from your brand colors, the page template colors, or click ADD next to “Recent Colors” to enter hex codes or select a different color for your background. If you add an image background, you can customize its sizing and alignment as well. Keep in mind, you can also set a background color or image for individual sections and columns.

Page Width

In this section, you can customize your page’s width. Choose between small, medium, and large — the size of widget elements will adjust accordingly. Toggling the Extend Section Backgrounds option to “on” will cause section background images and/or colors of a page to expand all the way to the edge of your page. If you have option toggled to the left (off), the background image or color section of a page will not expand to the edge.

Favicon

In this section, you can set a small image to act as your page’s favicon.

Custom CSS

If you want to get fancy, you can enable custom CSS on your page to code in any styling you’d like. Simply toggle the option in your page’s style settings, then add your CSS.

Bonus — 4 tools that may be useful in your designer way:

Crello — the simplest online image editor. A simple but powerful tool to create awesome designs for any social media format — posts, covers, graphics, and posters using the best software on the web. It’s easy! A lot of animated designs.
Webflow — all-in-one web design tool that allows users to design, build, and launch responsive websites visually.
Funnelytics — an incredible tool that helps you build the best marketing funnel mapping.
Flowkit — allows designers to create frighteningly fast user flows within Sketch and Figma.Paragraph

Be free to send us any feedback by reply or reach us in DM on Instagram
Do you want to receive insights using FB Messenger or Telegram or Email? 👈 Subscribe now.

--

--

Ruslan Galba
@hellotegra

Increasing revenue for DTC brands via Facebook / Google ads 🚀Growth Strategist 🤘 Founder @hellotegra growth team 🤖 $5M+ profitable ad spend in 2020