GB Style Transfer

Documentation

Everything customers need to install GB Style Transfer, move GenerateBlocks Pro Global Styles safely, and verify the destination site.

What GB Style Transfer does

Move reusable GenerateBlocks Pro styling and the GenerateBlocks content that depends on it without rebuilding every class by hand.

  • Export Global Styles: move the complete library, all styles in a chosen status, or individually selected styles.
  • Export content with its styles: package a page, post, Synced Pattern, or GenerateBlocks Local Pattern with only the Global Styles referenced by its blocks.
  • Rename custom classes safely: adapt BEM namespaces or one exact class inside the generated package while leaving the source site unchanged.
  • Validate before writing: preview new, updated, unchanged, skipped, and conflicting selectors before a real import.
  • Rebuild GenerateBlocks CSS: regenerate the destination global stylesheet after real style changes.

Requirements and preparation

Confirm the required plugins, permissions, and backup plan before transferring production styles.

WordPress and PHPWordPress 6.7 or newer and PHP 7.4 or newer.
GenerateBlocksGenerateBlocks 1.3.0 or newer with GenerateBlocks Pro installed and active.
GB Style TransferThe plugin must be installed and active with an eligible license or trial.
User accessA WordPress Administrator with manage_options. A license never bypasses WordPress permissions.
  • Back up the destination database before a production import.
  • Confirm GenerateBlocks, GenerateBlocks Pro, and GB Style Transfer are active on both sites.
  • Export a fresh JSON file from the source site.
  • Use Validate JSON and review every conflict, warning, and planned action before importing.
  • Test updates and large migrations on staging first.

Install and activate

Use the installable premium ZIP whose single top-level folder is gb-style-transfer.

  1. 1
    Upload the plugin. In WordPress, go to Plugins → Add Plugin → Upload Plugin and choose the GB Style Transfer ZIP.
  2. 2
    Install and activate. Select Install Now, then Activate Plugin.
  3. 3
    Check the activation order. Activate GenerateBlocks first, GenerateBlocks Pro second, and GB Style Transfer third.
  4. 4
    Activate the license. Complete the Freemius license screen. Never share the complete license key publicly.
  5. 5
    Open the product. Go to GenerateBlocks → Style Transfer. The page contains Importer, Exporter, and Account tabs; Importer opens by default.

Quick start

Choose what you want to move, then use either copy and paste or a downloaded file.

Choose how to move the JSON

Both methods transfer the same JSON. Use the one that best fits your workflow.

Copy JSON → Paste JSONOn the source site, preview the export and select Copy JSON. On the destination site, open Importer and paste it into Paste JSON. This is the fastest route for a direct transfer.
Download JSON → Upload JSONOn the source site, use Download Styles JSON, Download Bundle JSON, or Download JSON after a preview. On the destination site, open Importer and upload the saved file. This route keeps a reusable copy.

Move a complete or selected style library

  1. 1
    Open Exporter on the source. Go to GenerateBlocks → Style Transfer → Exporter.
  2. 2
    Choose the status. Select Published, Draft, or Any.
  3. 3
    Select the styles. Check individual rows or use Select visible. Leave every checkbox clear only when you want all styles in the chosen Published, Draft, or Any status.
  4. 4
    Move the JSON. Preview and Copy JSON, or download the styles JSON file.
  5. 5
    Open Importer on the destination. Paste the copied JSON or upload the downloaded file, then choose an Existing selector policy.
  6. 6
    Validate, review, and import. Select Validate JSON, correct problems, then import only when the result is expected.

Move a pattern, page, or only part of one

  1. 1
    Choose the content. Select a page, post, Synced Pattern, or GenerateBlocks Local Pattern in Export Content With Its Styles.
  2. 2
    For only part of the content, paste raw blocks. Copy one block, several blocks, or a selected section from the WordPress code editor and paste that markup into Paste raw block content instead.
  3. 3
    Configure optional renaming. Add package-only BEM namespace or Exact class rules when needed.
  4. 4
    Preview the bundle. Confirm the block content and the matching Global Styles. The bundle includes only styles referenced through the selected blocks’ globalClasses.
  5. 5
    Move the bundle JSON. Use Copy JSON → Paste JSON or Download JSON → Upload JSON.
  6. 6
    Validate and import its styles. The normal Importer reads the styles included in the bundle.
  7. 7
    Copy blockContent. Paste the included GenerateBlocks block markup into the destination page, post, or pattern editor.
  8. 8
    Save and verify. Check the destination Global Styles, generated CSS, and frontend layout.

Export styles, patterns, or part of a page

Create a complete style export or a focused bundle containing only the content and styles you need.

Export Styles Only

Use this mode when you need reusable Global Style records without GenerateBlocks block content.

  • No checkboxes selected: exports every style in the chosen Published, Draft, or Any status—it does not mean zero styles.
  • Filtering does not select styles: Filter styles only changes which rows you can see. It does not change the export selection.
  • To export only the filtered rows: select the needed checkboxes or choose Select visible after filtering.
  • Manual selectors: accept simple class selectors or class names; a leading dot is optional.
  • Checkboxes plus manual selectors: the exporter applies both filters, so the result is their intersection.
  • Preview and copy: select Preview Styles JSON, review the output, then use Copy JSON and paste it into the destination Importer.
  • Download and upload: select Download Styles JSON, then upload the saved file in the destination Importer.

Export a pattern—or only part of one—with its styles

Use Export Content With Its Styles when you want GenerateBlocks markup plus only the Global Styles used by that markup, rather than the site’s complete style library.

  • Choose a saved source: pages, posts, Synced Patterns, and GenerateBlocks Local Patterns are supported.
  • Transfer only part of a page or pattern: copy one block, a group of blocks, or a selected section from the WordPress code editor and use Paste raw block content instead.
  • Transfer only the styles used by the selected pattern: the bundle includes matching Global Styles referenced by the chosen or pasted blocks; it does not automatically include every Global Style on the source site.
  • When saved and pasted content are both present, the saved source takes precedence.
  • Matching styles are discovered from block globalClasses. An arbitrary HTML class or plain block className alone is not enough.
  • Referenced Synced Patterns may be inspected for styles but are not inlined into blockContent. Export the pattern itself for the most portable transfer.
  • Review warnings for missing styles, external assets, empty CSS, and reference limits before downloading.

Package-only class renaming

Adapt reusable components for another client or namespace without renaming anything on the source site.

BEM namespace rule

Use the base namespace to rename the full related family. Elements and modifiers follow the new namespace automatically.

team-card → agency-team-card

For example, team-card__title becomes agency-team-card__title and team-card--featured becomes agency-team-card--featured.

Exact class rule

Use an Exact class rule for one surgical change. Exact rules take precedence when both rule types match.

profile-card__heading → profile-card__title
  • Use only the base namespace in a BEM rule. If a field contains __ or --, use Exact class instead.
  • A maximum of 20 non-empty rename rules is allowed.
  • GenerateBlocks and WordPress structural classes such as gb-* and wp-block-* are protected.
  • A collision that would map two required source classes to one destination class stops package creation.
  • Always review Class Rename Preview and the resolved mappings before import.

Validate and import Global Styles

Use Validate JSON before every real import so you can review the result without changing the destination.

  1. 1
    Open Importer. Paste copied JSON into Paste JSON or upload a downloaded JSON or TXT file. If both are supplied, the uploaded file is used.
  2. 2
    Choose an Existing selector mode. Decide how the destination should handle matching selectors.
  3. 3
    Select Validate JSON. Review Summary, Style Check, Conflicts, Warnings, and Errors.
  4. 4
    Resolve hard errors. Change the source file or conflict mode and validate again.
  5. 5
    Run the real import. Select Import Global Styles only after the dry-run result is approved.
  6. 6
    Verify the result. Review Style Results, Post-import Verification, CSS Rebuild Diagnostics, GenerateBlocks Global Styles, and the frontend.
Smart UpdateCreates new styles, updates existing styles only when something changed, and leaves identical styles unchanged.
Skip existingCreates new styles but leaves every matching destination style untouched.
Report conflictsReports matching destination styles without updating them. A real import can still create styles that do not already exist.

Keep the source JSON until verification is complete. Styles are saved one at a time. If a late database error occurs, earlier successful styles can remain saved.

GenerateBlocks CSS file

After a real import, GB Style Transfer asks GenerateBlocks Pro to rebuild its global CSS file only when at least one style was created or updated.

  • Validation, unchanged, skipped, and conflict-only results do not rebuild the CSS file.
  • Use Rebuild Global CSS in the Importer as a manual fallback.
  • Check CSS Rebuild Diagnostics for availability, verification, file status, and style count.
  • A successful rebuild can leave file size and modification time unchanged when the generated CSS is identical.

Limits, privacy, and safe handling

These boundaries protect memory and request time. Split large transfers instead of trying to bypass them.

JSON import fileMaximum 2 MiB. Your hosting provider can allow less.
Styles in one importMaximum 1,000. Split larger libraries into batches.
CSS for one styleMaximum 100 KiB.
Style settings for one styleMaximum 100 KiB, nested up to 10 levels.
Block content in one bundleMaximum 1 MiB for raw or saved GenerateBlocks content.
Rename rulesMaximum 20 non-empty rules.
  • Treat exports as confidential. They can contain source URLs, WordPress edit URLs, complete content, CSS, design data, selectors, and asset URLs.
  • Never share secrets. Redact license keys, WordPress passwords, Application Passwords, private URLs, billing data, and customer content.
  • External assets are not migrated. Move required media separately and update the destination URLs.
  • Custom properties are not migrated. Recreate required CSS variables on the destination or replace them with portable values.
  • Deleting the plugin does not undo imports. Imported Global Styles remain until removed through GenerateBlocks or WordPress.
  • Multisite: network-wide compatibility is not advertised. Test per site and confirm license coverage.

Troubleshooting

Start with the dependency stack, license, permissions, validation result, and CSS diagnostics.

Style Transfer menu is missingConfirm GenerateBlocks 1.3+, GenerateBlocks Pro, and GB Style Transfer are active; verify the Freemius entitlement and Administrator permissions.
A page or pattern is not listedThe menu includes up to 200 recent editable items per supported type. Copy its GenrateBlocks markup and use Paste raw block content instead.
The filtered list exported too many stylesFiltering only hides rows. Check individual rows or select Select visible before exporting a focused set.
I only need part of a page or patternCopy the required blocks from the WordPress code editor and paste them into Paste raw block content instead. The bundle will find styles used by those blocks.
Styles imported but no page appearedThis is expected. Import the bundle’s styles, then paste its blockContent into the destination editor.
Copied JSON will not importPaste the complete export into Paste JSON. Do not paste blockContent into the Importer; that markup belongs in the destination content editor.
A required Global Style is missingThe source block references a globalClasses name with no matching source Global Style record. Create, fix, or export that style separately.
CSS variable or external URL warningRecreate the custom property on the destination, or move the asset and update the destination CSS URL.
CSS rebuild is unavailableReview CSS Rebuild Diagnostics and confirm GenerateBlocks Pro can write its global CSS in the uploads directory.
The JSON file is rejectedCheck the 2 MiB manifest limit, hosting upload limits, truncated JSON, smart quotes, trailing commas, and selector/className mismatches.
Import reports conflictsChoose Smart Update, Skip existing, or Report conflicts based on your intent, then run validation again.

Frequently asked questions and support

Short answers to the questions that matter most during a transfer.

Does export change the source site?No. Export reads content and styles to build JSON. Package-only renaming changes only the generated package.
Should I copy and paste or download and upload?Both move the same JSON. Copy and paste is faster for a direct transfer; download and upload keeps a reusable file.
Can I transfer only styles used by one pattern?Yes. Choose that pattern in Export Content With Its Styles. The bundle includes Global Styles referenced by its blocks.
Can I transfer only part of a page or pattern?Yes. Paste the selected GenerateBlock markup into Paste raw block content instead.
Does filtering select styles?No. Filtering changes visible rows only. Use checkboxes or Select visible to choose styles.
Do I need the plugin on both sites?Yes for the normal source-export and destination-import workflow. Activation count depends on the purchased plan.
Will the Importer create the page or pattern?No. Import the styles, then paste the included blockContent into the destination editor.
Is Report conflicts a preview?No. Use Validate JSON for a no-write preview. A real import in Report conflicts mode can still create new selectors.
Are media files, fonts, and variables copied?No. Move assets separately and recreate required site-wide variables or settings.
Should I validate before every import?Yes. Validation is the safest way to review planned actions without writing records.
Does deleting the plugin undo imports?No. Imported GenerateBlocks Global Styles remain until you remove them separately.

Need product or account help?

Visit the GB Style Transfer product page for current purchasing, licensing, and support information.

Visit GB Style Transfer