npm run build for Divi layouts

Create better sections for Divi without rebuilding your whole site.

PAF SiteBlocks lets you turn ChatGPT-built HTML, CSS, and JavaScript into reusable WordPress sections you can place inside Divi with a simple shortcode.

Get PAF SiteBlocks See how it works
Divi-first. Shortcode-friendly. No theme edits. No child theme required. One section at a time. Safer updates.
siteblock.config
const section = "homepage_hero";
create(ChatGPT.sectionCode);
render('[paf_block id="homepage_hero"]');

// Result
DiviPage.addCodeModule();
SiteBlock.loadsExactlyHere();
output:

A polished section that can be updated later without touching the rest of the page.

debug the real bottleneck

Divi makes building possible. It does not make every custom idea easy.

You can make a lot with modules, rows, and presets. But the moment you want something more custom, more interactive, or more like the design ChatGPT helped you imagine, the workflow gets clunky fast.

01

Custom code gets scattered.

HTML goes in one place. CSS goes somewhere else. JavaScript becomes the part everyone hopes they pasted correctly.

02

Small edits can feel risky.

One bad paste can affect more than the section you meant to change, especially when styles are not scoped cleanly.

03

AI-created layouts need a home.

ChatGPT can create the section, but WordPress still needs a clean way to store it, place it, and update it later.

return cleaner workflow

PAF SiteBlocks gives your AI-built sections a safe place to live.

Instead of forcing everything into one massive page or one fragile code module, you create reusable SiteBlocks and place them exactly where you want them in Divi.

Start building cleaner pages
1

Create your section in ChatGPT.

Ask for a hero, pricing block, FAQ, feature section, or full funnel layout using HTML, CSS, and JavaScript.

2

Paste the complete Section Code into PAF SiteBlocks.

One field can hold the section HTML, scoped CSS, and any needed inline JavaScript.

3

Drop the shortcode inside Divi.

Use a Divi Code Module, paste the shortcode, and the SiteBlock renders exactly where you placed it.

4

Update only that section later.

Change a hero without disturbing your pricing. Update a CTA without rebuilding the whole page.

features that make the workflow click

Built for people who want the flexibility of code without turning every edit into a project.

PAF SiteBlocks keeps custom sections portable, organized, and easier to manage inside WordPress.

[paf_block]

Shortcode placement

Place your section inside Divi, Gutenberg, Elementor, or any builder that supports shortcodes.

<style>

One-paste sections

Keep each section together with its own HTML, CSS, and optional JavaScript.

:root

Global CSS option

Store shared design-system styles once, then keep each section lighter and easier to edit.

draft()

Draft-first updates

API updates can save as drafts by default so changes can be reviewed before publishing.

backup[]

Version snapshots

Before updates are saved, previous block data can be stored as a backup snapshot.

#scope

Scoped styling

Each block has its own wrapper so CSS can be written to avoid fighting the rest of the site.

api.post

REST API ready

Update approved blocks through an API key workflow when you are ready to connect AI tools.

no_bloat

Builder-friendly

Use it with Divi first, but keep the layout portable across other WordPress builder workflows.

Divi first, WordPress everywhere

Use Divi for the page. Use SiteBlocks for the custom parts.

PAF SiteBlocks is not trying to replace Divi. It gives Divi users a cleaner way to bring in custom, AI-built sections without fighting rows, modules, custom CSS tabs, or theme files.

✓ Put the shortcode in a Divi Code Module and keep building the rest of the page normally.
✓ Use one SiteBlock per section so your hero, FAQ, pricing, and CTAs can be edited separately.
✓ Keep ChatGPT-made code organized instead of spreading it across the page settings, module settings, and theme options.
Divi Section
Standard row and content modules
Code Module
[paf_block id="homepage_hero"]
Divi Section
Regular Divi testimonials, images, or buttons
PAF SiteBlock
Custom section renders here
buy the workflow

Stop treating custom sections like a workaround.

Give your Divi builds a cleaner path from idea, to ChatGPT, to WordPress, to live page.

{ }

Plugin download

Install PAF SiteBlocks, create section blocks, paste your complete code, and place them with shortcodes.

AI

ChatGPT prompt pack

Use starter prompts for heroes, pricing sections, FAQs, lead capture blocks, and full funnel pages.

DIVI

Divi placement guide

Learn where to paste the shortcode, how to organize blocks, and how to avoid page-wide CSS conflicts.

CSS

Scoped CSS checklist

Know what to ask ChatGPT for so each section stays isolated and does not accidentally redesign your whole site.

faq before install

Questions a Divi user will probably ask before buying.

Clear answers reduce hesitation and make the plugin feel less technical.

No. Divi still controls the page. PAF SiteBlocks gives you a cleaner way to insert custom sections inside that page using a shortcode.
Yes. The plugin is Divi-first in the way it is positioned, but it works anywhere WordPress shortcodes are supported, including Gutenberg and many other page builders.
No. It is for storing and rendering custom sections. You can still use your builder for the rest of the page and use SiteBlocks where custom code makes more sense.
A complete section can include HTML, inline CSS inside style tags, and optional inline JavaScript inside script tags. The cleaner the CSS scoping, the better the section behaves inside WordPress.
deploy your next section

Build the section in ChatGPT. Place it in Divi. Update it without touching the whole page.

PAF SiteBlocks gives WordPress creators a simple bridge between AI-generated code and real website pages.

Get PAF SiteBlocks Review the workflow