MENU

How to Increase The Height of Story Panel Using CSS

March 05, 2026 | By: PhotoBiz Knowledge Base

How to Increase Height for a Story Panel Block Using Custom CSS in PhotoBiz

If you want your Story Panel block to appear taller on your page, you can adjust its height using a small snippet of custom CSS.

This allows you to control how tall the Story Panel layout appears on desktop and tablet screens. By increasing the height value in the CSS code, you can create more vertical space for your images and text.

This guide walks you through where to place the CSS and how to adjust the height value.

Prerequisites

Before you begin, make sure:

  • You have access to the PhotoBiz Website Builder

  • Your website has already been created and is editable

  • You are comfortable copying and pasting a short snippet of CSS

STEP ONE

Log into your PhotoBiz account and click WEBSITE in the left-side menu.

STEP TWO

Open the page where the Story Panel block is located.

In the Website Builder, navigate to the specific page you want to update.

Click SEO in the upper-right corner of the page to open the page SEO settings.

STEP THREE

Add custom CSS to increase the Story Panel height.

In the SEO settings panel, locate the HEAD field under Advanced Tracking.

Paste the following code into the field exactly as shown.

The number 900px controls the height of the Story Panel block.

Increasing this number will make the block taller.
Decreasing it will make the block shorter.

This CSS targets the Story Panel layout used in the List Block on the selected page only.

FINAL STEP

Click Save to apply your changes.

Once saved, the Story Panel block will display using the new height you specified in the CSS.

Refresh the page preview to see the updated layout.

Additional Options or Helpful Notes

• The height value in the CSS can be adjusted to fit your design.

• Example height values:

  • 700px for a shorter panel

  • 900px for a taller panel

  • 1100px or higher for very tall story panels

• This change only affects the specific page where the code was added.

• If you want the change to apply across your entire website, the CSS can instead be added to Global CSS/JS in your design settings.

Troubleshooting or FAQs

The Story Panel height did not change

  • Confirm the code was pasted into the SEO → HEAD section of the page
  • Make sure you clicked Save after adding the code
  • Clear your browser cache or refresh the page preview

The Story Panel looks too tall or too short

Edit the CSS code and adjust the height value until the layout looks the way you want.

Previous Post Next Post

Related Posts

How to Hide the Logo Section Using Custom CSS in PhotoBiz

January 16, 2026

How to Hide View Previous & Next Post in Blog Posts Using CSS

March 5, 2026

How To Add Custom CSS To The Website

September 4, 2025

How Do I Change My Fonts?

February 17, 2026

CLOSE