Our pricing Html Code Example

The block organizes three pricing plans into equal horizontal columns. Every plan contains a displayed price, a multiline list of included features, and a purchase button, creating consistent regions for plan comparison and response. The middle panel has a gray gradient treatment and a blue purchase button, while the outer panels use gray buttons. A blue band behind the upper portion adds a visual boundary around the pricing area. These existing regions give custom work clear places to connect with the comparison without changing its core arrangement.

Feature Lists and Buttons Define Practical Extension Areas

The three pricing panels already separate the block into repeated content regions with a consistent sequence: plan name, displayed price, included feature list, and purchase action. That structure makes the plan comparison readable while also showing where project-specific extensions could logically connect. A custom element might sit near a relevant purchase area, supplement a plan explanation, or support an integration around the existing action without replacing the repeated pricing pattern.

The middle panel deserves separate attention because its gray gradient and blue button identify it visually from the two outer panels. Any added functionality should respect that distinction rather than treating all three columns as unrelated containers. The feature lists provide compact informational zones, while the buttons establish the clearest interaction points through link-based purchase actions. The surrounding blue band can help frame an extension visually, but it should not obscure the plan details or reduce the contrast of the buttons.

In an HTML Code context, the block therefore supplies bounded regions for optional project-specific functionality. Custom HTML, CSS, JavaScript, or an external component could be considered where a real implementation need meets one of these pricing or purchase areas. The existing section remains the content and visual base, while any extension should preserve the equal-column comparison and the emphasized middle option.

Customize with Nicepage

Open this ready-made template in the HTML Code Generator and customize it visually in the Nicepage editor. Replace demo content, edit page sections, and adapt the design to your project without rebuilding the template from scratch.

Download

Edit Template Offline

1. Download and Install the Nicepage application for Windows and Mac. Or WordPress and Joomla plugins from the download page
2. Create a new page or select existing
3. Click Add new block, search for id 92933 and click enter

Edit Template Online

Run Online Builder to edit this template on our hosting

Create Awesome Websites

WordPress

Windows App

Joomla

Mac OS App

HTML5

Online

Free Nicepage Builder

15,000+ Templates

Easy Drag-n-Drop

No Coding

Mobile-Friendly

Keywords

Extend This Page With Custom HTML Code

Insert Code With the HTML Element

Use the HTML Element to add custom code directly to a Block in the Nicepage editor. Enter the required markup in the Code field when the page needs content or functionality that is not available through the standard page elements.

Place the HTML Element in the Layout

Treat the HTML Element as part of the visual page composition. Adjust its position, width, height, alignment, and margins to place the custom content where it belongs alongside text, images, buttons, and other elements. This makes it possible to combine visually edited sections with project-specific code without separating the custom element from the rest of the layout.

Add HTML, CSS, JavaScript, and External Components

The HTML Element supports HTML, CSS, and JavaScript, allowing you to extend the page with custom markup and interactive functionality. It can also be used to embed custom code and third-party components, such as social feeds, advertising code, widgets, or other external functionality required by the project.

This workflow makes the template useful for projects that need a visual page editor together with custom HTML code, JavaScript, embedded components, and functionality beyond the standard page elements.