How Do I Get Rid of Webflow Branding?

by

Are you tired of seeing the Webflow branding on your website? Want to remove it and make your site truly yours?

In this tutorial, we will walk you through the steps to get rid of Webflow branding and customize your website to reflect your own brand identity. Let’s get started!

Step 1: Upgrade to a Paid Plan

If you are using the free version of Webflow, unfortunately, you are not able to remove the Webflow branding. To unlock this feature, you need to upgrade to a paid plan. Webflow offers various pricing options tailored to different needs, so choose the one that suits you best.

Step 2: Access Your Project Settings

Once you have upgraded your plan, log in to your Webflow account and navigate to the project that you want to customize. Click on the “Project Settings” option in the top-right corner of the Webflow designer interface.

Step 2.1: General Tab

In the project settings modal, select the “General” tab if it is not already selected. Here, you will find several options related to your project settings.2: Branding Tab

Select the “Branding” tab within the project settings modal. This is where you can customize various branding elements of your website.

Step 3: Remove Webflow Logo

In the “Branding” tab, scroll down until you find an option called “Webflow Logo”. By default, this option is enabled and displays a small Webflow logo on your published website.

  • To remove the Webflow logo:
    1. Select the checkbox next to “Hide on published site”.
    2. The Webflow logo will be removed from your website.

Step 4: Customize the Publish Message

Webflow allows you to display a custom message when someone views your published website in the designer. This message can be seen in the bottom-left corner of the screen.

  • To customize the publish message:
    1. In the “Branding” tab, locate the “Publish Message” section.
    2. Type your desired custom message in the text input field.
    3. Your custom message will now appear in place of the default Webflow message.

Step 5: Add Custom Code (Optional)

If you want to go even further and remove any remaining traces of Webflow branding, you can add some custom code to your project. This step is optional and requires a basic understanding of HTML and CSS.

Step 5.1: Custom Code Tab

In the project settings modal, select the “Custom Code” tab. Here, you can add custom HTML or CSS code that will be injected into your website’s header or footer sections.2: Removing Powered by Webflow

To remove the “Powered by Webflow” text at the bottom of your website, add the following CSS code to your project:

<style>
    .w-powered-by-webflow {
        display: none !important;
    }
</style>

This code Targets the specific class responsible for displaying the “Powered by Webflow” text and hides it from view.

Step 6: Publish Your Website

After you have made all the necessary changes, click on the “Publish” button in the top-right corner of the Webflow designer to apply your modifications to your live website. Congratulations! You have successfully removed Webflow branding from your site.

Now your website truly represents your brand without any traces of Webflow’s default branding. Remember, always double-check your changes before publishing to ensure everything looks and works as expected. Happy designing!