Skip to main content

Setting global design options for your site

Learn how to set and customize global design options for your site

Rodrigo avatar
Written by Rodrigo
Updated over a week ago

Podia's site builder gives you the ability to manage various parts of your site and establish global design settings. This helps you tweak things like fonts, colors, and other features.

In this guide, we'll walk you through how to set these global design options for your site!


Accessing the site Design menu

Here's how to access the Design options of your site.

  1. From your Podia dashboard, click on Website in the sidebar menu.

  2. Select Edit site.

  3. On the next page, click on Design at the top menu of the Site builder.

  4. Select the area of the site you want to tweak from the left-hand menu.

Now let’s take a look at each of the available design options you can customize, such as:

Managing site colors

You'll be able to manage global site color options for your site. Click on Colors in the left-hand menu to get started.

Podia's color options allow you to customize your website and easily set up colors for your site pages.

It all begins with 6 base colors. These form the primary color palette that will be used to create various section themes for your site.

With the base colors you've chosen, Podia will generate 6 section themes. These themes will help maintain color variety while ensuring consistency across different sections of your site.

Managing site fonts

You'll be able to manage global font options for your site. Click on Fonts in the left-hand menu to get started.

Use the left-hand menu to select a font preset or choose your base font size and styling options for your site's different text elements.

Managing site interactive options

You'll be able to manage how interactive elements - such as buttons, links and socials - behave on your site. Click on Interactives in the left-hand menu to get started.

Use the available options to modify the behavior and design of interactive elements of your site, such as:

  • Links

    • Style: Underline, Dashed line, Dotted line, Double line, Wavy line, None

    • Hover: Darken, Fade, Scale, Rise, Color, Underline

  • Linked titles

    • Style: Underline, Dashed line, Dotted line, Double line, Wavy line, None

    • Hover: Darken, Fade, Scale, Rise, Color, Underline

  • Navigation links

    • Style: Underline, Dashed line, Dotted line, Double line, Wavy line, None

    • Hover: Darken, Fade, Scale, Rise, Color, Underline

  • Buttons

    • Style: Underline, Dashed line, Dotted line, Double line, Wavy line, None

    • Corners: Hard, Small, Medium, Large, Round

    • Hover: Darken, Fade, Scale, Rise

  • Social icons

    • Hover: Darken, Fade, Scale, Rise

Managing site media options

You'll be able to manage how Media elements - such as images and videos - behave on your site. Click on Media in the left-hand menu to get started.

Use the available options to modify the behavior and design of media elements of your site, such as:

  • Images

    • Corners: Set default corner options that will be applied to all new images uploaded to your site

    • Linked image hover: Set the default hover behavior for all new linked images of your site

    • Mobile full-width: If this option is turned on, it stops images from resizing proportionally on mobile devices and displays them at full width instead

  • Videos

    • Corners: Set default corner options that will be applied to all new videos uploaded to your site

    • Mobile full-width: If this option is turned on, it stops video players from resizing proportionally on mobile devices and displays them at full width instead

Managing site structure settings

You'll be able to edit and customize your site's structure settings, such as width, padding and gaps - as well as card structure. Click on Structure in the left-hand menu to get started.

You'll see options to modify your sections' width, padding, and gaps, as well as enable borders for page sections.

You'll also be able to modify your cards' corners, shadow opacity, and shadow depth options, as well as set the card collection height behavior.


FAQ

How do I adjust individual elements if I want them to have a different design than the global settings?

Each individual section will have various design options you can customize.

To make these changes, simply click on the section you'd like to adjust and navigate to the Design menu using the left-hand menu.

From there, you'll be able to adjust individual design options for your section - such as layout, structure, colors & more!

Your browser does not support HTML5 video.


Still need help?

If you have more questions, reach out to us at [email protected] or click the purple icon below to send us a message! 😄

Did this answer your question?