How to Add a Logo to Your Page Header

Kayla M.

calendar_month Updated

Learn to brand your page by adding a Logo Image or Logo Text to the page Header.

In this article:

Adding a logo block to your header

Step 1. Select your block type

  • Open the Website tab from the Dashboard. 
  • Select the Pages tab. 
  • Select the page you wish to edit and click Customize. Learn to open your page editor
  • Navigate to the sidebar panel and click Header.
  • Click Add Content.
  • Select Logo:

DD9EA714-1EBC-4D74-BC4B-509157C6D888.png

After adding the Logo Block Type, select:

  • Image
  • Text
Note:
If you've uploaded a Logo Image to the Branding section of your Site Detail Settings prior to creating the page, Image Logo Type will default to the Logo uploaded in your Site Detail Settings. If you wish to change the image for your page, follow Step 2: Upload your Logo

Step 2. Upload your logo

Depending on the Logo Type selected:

  • Upload your Logo Image by clicking Select Image and choosing a new file or a recent file.
  • Enter text in the Logo Text field.

Customizing your logo block

Image Alt Attribute

Enter a brief image description to identify the image for SEO purposes, accessibility, or if the image cannot be displayed. 

Logo Image Width

If you have selected Image as your Logo Type, customize the width of your image to change the appearance of your Logo on your page.

Logo Text Color 

If you selected Text as your Logo Type, customize the text color to use your site branding colors or a custom color for your Logo Text.

Stretch Block

Enable the Stretch Block setting to fill the remaining space of the Header section. 

A good rule for using the Stretch Block feature is to enable the Stretch Block feature for the Block on the far left of your Header section.

For example, if you want to have your Logo on the far left side of your Header and a Menu and User Menu on the far right side, select Stretch Block for your Logo:

Control the alignment and positioning of your blocks by adjusting the Stretch Block and Block Alignment for the blocks in your Header. 

Text Alignment

Adjust the horizontal alignment of your block in the Header to appear more left, centered, or right-aligned. 

Keep in mind, this setting will be impacted by the positioning and alignment of surrounding blocks.

And that's how to add a Logo to your page Header! Please vote below and let us know if you found this article helpful. We value your feedback. Thanks for being the best part of Kajabi!

Did you find this article helpful?