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.
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
Upload the plugin. In WordPress, go to Plugins → Add Plugin → Upload Plugin and choose the GB Style Transfer ZIP.
-
2
Install and activate. Select Install Now, then Activate Plugin.
-
3
Check the activation order. Activate GenerateBlocks first, GenerateBlocks Pro second, and GB Style Transfer third.
-
4
Activate the license. Complete the Freemius license screen. Never share the complete license key publicly.
-
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.
Move a complete or selected style library
-
1
Open Exporter on the source. Go to GenerateBlocks → Style Transfer → Exporter.
-
2
Choose the status. Select Published, Draft, or Any.
-
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
Move the JSON. Preview and Copy JSON, or download the styles JSON file.
-
5
Open Importer on the destination. Paste the copied JSON or upload the downloaded file, then choose an Existing selector policy.
-
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
Choose the content. Select a page, post, Synced Pattern, or GenerateBlocks Local Pattern in Export Content With Its Styles.
-
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
Configure optional renaming. Add package-only BEM namespace or Exact class rules when needed.
-
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
Move the bundle JSON. Use Copy JSON → Paste JSON or Download JSON → Upload JSON.
-
6
Validate and import its styles. The normal Importer reads the styles included in the bundle.
-
7
Copy blockContent. Paste the included GenerateBlocks block markup into the destination page, post, or pattern editor.
-
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 blockclassNamealone 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-cardFor 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-*andwp-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
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
Choose an Existing selector mode. Decide how the destination should handle matching selectors.
-
3
Select Validate JSON. Review Summary, Style Check, Conflicts, Warnings, and Errors.
-
4
Resolve hard errors. Change the source file or conflict mode and validate again.
-
5
Run the real import. Select Import Global Styles only after the dry-run result is approved.
-
6
Verify the result. Review Style Results, Post-import Verification, CSS Rebuild Diagnostics, GenerateBlocks Global Styles, and the frontend.
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.
- 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.
blockContent into the destination editor.blockContent into the Importer; that markup belongs in the destination content editor.globalClasses name with no matching source Global Style record. Create, fix, or export that style separately.Frequently asked questions and support
Short answers to the questions that matter most during a transfer.
blockContent into the destination editor.Need product or account help?
Visit the GB Style Transfer product page for current purchasing, licensing, and support information.
Visit GB Style Transfer