Business · Gutenberg
Resume / CV block for WordPress
A complete professional resume or CV with experience timeline, education, skills, and contact header.
Get Blockenberg
Free Gutenberg block in Blockenberg. The inspector controls and front-end behavior on this page come from this block’s source, not a shared stub.
What it actually does
A complete professional resume or CV with experience timeline, education, skills, and contact header.
Inspector panels on this block: Sections, Header Info, Experience (, Education (, Skills, Layout. Those titles come from index.js, not from a shared template.
Behavior controls: “Layout” options: Classic (single column), Sidebar (header left, content right), Modern (header full-width, two-col bottom).
Where to find it
Gutenberg inserter → Business → search “Resume / CV” (block name `blockenberg/resume` in block.json). Style it in the sidebar after insert.
How to use Resume / CV block for WordPress
- Install Blockenberg. Install from WordPress.org and activate the plugin.
- Insert the block. Edit a page, click +, search for “Resume / CV”, insert it. Category: Business.
- Configure inspector controls that exist on this block. Open Sections. Set “Show photo”, “Show summary”, “Show experience”, “Show education”.
- Check the published page. The view script reads HTML data attributes: data-opts, data-rendered. The block editor preview may not run the same view script.
Inspector controls from this block’s code
| Control | What the code does |
|---|---|
| Show photo | On/off toggle in the inspector. On by default. Saved as `showPhoto`. |
| Show summary | On/off toggle in the inspector. On by default. Saved as `showSummary`. |
| Show experience | On/off toggle in the inspector. On by default. Saved as `showExperience`. |
| Show education | On/off toggle in the inspector. On by default. Saved as `showEducation`. |
| Show skills | On/off toggle in the inspector. On by default. Saved as `showSkills`. |
| Show contact info | On/off toggle in the inspector. On by default. Saved as `showContact`. |
| Full name | Text field in the inspector. block.json default: Alex Morgan. Saved as `name`. |
| Job title | Text field in the inspector. block.json default: Senior Product Designer. Saved as `jobTitle`. |
| Summary title | Text field in the inspector. block.json default: About. Saved as `summaryTitle`. |
| Summary text | Multiline text field in the inspector. block.json default: Passionate designer with 8+ years of experience crafting user-centred digital products. Skilled at leading cross-functional teams and translating complex problems into elegant, scalable solutions.. Saved as `summary`. |
| Text field in the inspector. block.json default: alex@example.com. Saved as `email`. | |
| Phone | Text field in the inspector. block.json default: +1 555 000 1234. Saved as `phone`. |
| Location | Text field in the inspector. block.json default: New York, NY. Saved as `location`. |
| Website | Text field in the inspector. block.json default: alexmorgan.design. Saved as `website`. |
| Section title | Text field in the inspector. block.json default: Work Experience. Saved as `experienceTitle`. |
| Role / Position | Text field in the inspector. Saved as `experience`. |
| Company | Text field in the inspector. Saved as `experience`. |
| Location (Experience) | Text field in the inspector. Saved as `experience`. |
| Start date | Text field in the inspector. Saved as `experience`. |
| Current position | On/off toggle in the inspector. Saved as `experience`. |
| End date | Text field in the inspector. Saved as `experience`. |
| Description | Multiline text field in the inspector. Saved as `experience`. |
| Section title (Education Title) | Text field in the inspector. block.json default: Education. Saved as `educationTitle`. |
| Degree / Qualification | Text field in the inspector. Saved as `education`. |
| Institution | Text field in the inspector. Saved as `education`. |
| Start year | Text field in the inspector. Saved as `education`. |
| End year | Text field in the inspector. Saved as `education`. |
| Description (optional) | Multiline text field in the inspector. Saved as `education`. |
| Section title (Skills Title) | Text field in the inspector. block.json default: Skills. Saved as `skillsTitle`. |
| Category | Text field in the inspector. Saved as `skills`. |
| Skills (comma-separated) | Multiline text field in the inspector. Saved as `skills`. |
| Layout | Select control; the chosen value is saved on the block. Options: Classic (single column); Sidebar (header left, content right); Modern (header full-width, two-col bottom). block.json default: classic. Saved as `layout`. |
| Max width (px) | Numeric range control in the inspector. Range 500–1200. block.json default: 820. Saved as `maxWidth`. |
| Container padding (px) | Numeric range control in the inspector. Range 16–64. block.json default: 40. Saved as `containerPadding`. |
| Border radius (px) | Numeric range control in the inspector. Range 0–24. block.json default: 12. Saved as `borderRadius`. |
| Avatar size (px) | Numeric range control in the inspector. Range 48–140. block.json default: 88. Saved as `avatarSize`. |
| Section gap (px) | Numeric range control in the inspector. Range 16–60. block.json default: 36. Saved as `sectionGap`. |
| Name | Shared Blockenberg typography popover (family, size, weight, spacing). Saved as `nameTypo`. |
| Body Text | Shared Blockenberg typography popover (family, size, weight, spacing). Saved as `bodyTypo`. |
| Accent Color | Color control in the inspector. block.json default: #6366f1. Saved as `accentColor`. |
| Card Background | Color control in the inspector. block.json default: #ffffff. Saved as `bgColor`. |
| Header Background | Color control in the inspector. block.json default: #f8fafc. Saved as `headerBg`. |
| Heading Color | Color control in the inspector. block.json default: #111827. Saved as `sectionHeadingColor`. |
| Body Text | Color control in the inspector. block.json default: #374151. Saved as `textColor`. |
| Subtext / Meta | Color control in the inspector. block.json default: #6b7280. Saved as `subtextColor`. |
| Skill Tag Background | Color control in the inspector. block.json default: #f1f5f9. Saved as `tagBg`. |
| Skill Tag Text | Color control in the inspector. block.json default: #475569. Saved as `tagColor`. |
| Divider Color | Color control in the inspector. block.json default: #e5e7eb. Saved as `dividerColor`. |
| Timeline Dot | Color control in the inspector. block.json default: #6366f1. Saved as `timelineDotColor`. |
What the front-end script actually does
- The view script reads HTML data attributes: data-opts, data-rendered.
When this is the right block
- A complete professional resume or CV with experience timeline, education, skills, and contact header — that is the job of Resume / CV, not a generic content block.
- Use it when you need the editor control labeled “Show photo”, which exists on this block’s inspector.
- It matches pages about resume, curriculum vitae, portfolio.
- Inserter grouping: company, service, and operations pages.
Notes from the implementation
viewScript: this folder’s frontend.js is enqueued on the front end for this block.
FAQ
How do I add the Resume / CV block in WordPress?
Install Blockenberg from WordPress.org, edit a page in the block editor, click +, and search for “Resume / CV”. It sits under Business. After insert, open Sections and set “Show photo”, “Show summary”, “Show experience”, “Show education”.
What makes Resume / CV different from other Blockenberg blocks?
A complete professional resume or CV with experience timeline, education, skills, and contact header. Inspector labels on this block include “Show photo”, “Show summary”, “Show experience”, “Show education”.
Is the Resume / CV Gutenberg block free?
Yes. Resume / CV ships inside Blockenberg. Get the plugin from WordPress.org — no paid add-on is required for this block.
Can I style Resume / CV to match my theme?
Yes. Blockenberg’s shared typography and color panels apply here, plus any block-specific style controls listed on this page (panels: Sections, Header Info, Experience (, Education ().
Related business blocks
Case Study
Client case study section with logo, challenge, solution, quantified before/after metrics and a pull quote. Perfect for agency, SaaS and consulting landing pages.
Job Listing
Display a job posting card with title, company, location, salary, job type, skills, apply CTA, and rich styling options.
Portfolio Grid
Project showcase cards with category filter, hover overlay, tech tags and CTA links. Perfect for portfolio, case studies, and work samples.
Tech Stack
Showcase your technology stack or toolset. Category-grouped, logo images with labels, optional proficiency indicators and hover effects.
About Section
Ready-made About Us section with split image/video + text layout, optional company stats row, badge label, CTA buttons, and full background/color controls.
Address Card
Business address card with contact details, opening hours, and optional map link.
Get Blockenberg
Install Blockenberg from WordPress.org, then insert Resume / CV from the Gutenberg inserter.