Blog

Almost nobody gets stuck on the part where you create the page. They get stuck after pressing Publish, when the page doesn’t show up in the menu, has no header, or returns a 404. Those are four separate systems: the page itself, the navigation, the template and the URL rules. Each one needs its own step, and fixing one doesn’t fix the others.

This guide covers both jobs: creating the page, then making it reachable and getting it to display correctly. To change a page that already exists, see how to edit pages in WordPress.

What do you need before you add a page?

You need an account that can publish pages. Administrators and Editors can. If you log in and there is no Pages item in the left-hand admin menu, your role doesn’t include page permissions, and an administrator has to change it.

Next, find out which kind of theme you have, because the menu steps depend on it. Open the Appearance menu in the dashboard. If it has an Editor item, you’re on a block theme and navigation lives in the Site Editor. If it has Menus and Customize, you’re on a classic theme. Many tutorials were written for classic themes. Readers on block themes follow them, can’t find Appearance > Menus, and conclude WordPress is broken. It isn’t. The setting has moved.

Finally, check that you actually want a page. WordPress.org’s documentation puts it this way: pages are for non-chronological content, such as About, Contact, Services and legal notices. Posts are dated entries that show up in the blog and its feed. If the content will still be true next year and visitors will look for it in the navigation, make it a page.

How do you create and publish a page?

This is the standard workflow in the block editor, and it works the same on classic and block themes:

1. In the dashboard, go to Pages > Add New Page. Some versions and hosts label the button Add New. The admin bar’s + New > Page opens the same screen.
2. Type the title. WordPress builds the slug from it, so “Our Services” becomes /our-services/.
3. Add the content as blocks: a Heading block for each section, Paragraph blocks for the text, and Image, Buttons or Columns blocks where they help. Text pasted from Word or Google Docs often brings stray spacing and fonts with it. Paste it as plain text, or type into the blocks directly.
4. Open the settings sidebar (the panel icon at the top right) and set everything in the next section before you publish.
5. Click Save draft, then Preview in a new tab. Check the page at desktop width and on a phone.
6. Click Publish, then confirm by clicking Publish again.

Which sidebar settings should you set before publishing?

Five settings in the Page tab decide how the page behaves once it’s live:

• Status and visibility. Published pages are public. Drafts, Pending Review, Private and password-protected pages are hidden from visitors. They are also left out of menus and the homepage selector.
• Slug. Settle it now. If you change it after other pages, emails or ads link to it, those links break unless you add a redirect.
• Parent. Choosing a parent makes this page a subpage and puts the parent in the URL, so a Board page under About becomes /about/board/. It doesn’t put the page into any menu.
• Template. This controls the layout around your content. Leave it on Default unless you know you want something else. The template section below explains why.
• Order. A number (1, 2, 3) that sorts pages in automatic page lists and in some themes’ default menus.

Can you create pages from the Site Editor instead?

Yes, on a block theme. WordPress.org’s Site Editor documentation describes Appearance > Editor > Pages, where the plus icon creates a draft. The benefit is that you edit the page inside its real template rather than on a blank canvas. The risk is that the header, footer and title belong to the template, not the page. WordPress locks those blocks and shows “Edit your template to edit this block.” If you unlock and change them, the change applies to every page that uses the template.

How do you get the new page into the menu?

You add it yourself. The menu doesn’t pick up new pages, and this is the most common “my page is missing” report on the WordPress.org forums and Reddit.

On a classic theme

1. Go to Appearance > Menus.
2. Pick the right menu from the “Select a menu to edit” dropdown. Sites often have several, and editing the wrong one is a common mistake.
3. In the Pages box, tick your page and click Add to Menu.
4. Drag it into position. To create a dropdown, drag it slightly right, under its parent item.
5. Under Menu Settings, check that the menu is assigned to a location your theme actually shows, usually Primary or Header.
6. Click Save Menu. Nothing changes on the live site until you do.

The same screen has an “Automatically add new top-level pages to this menu” checkbox. It only covers top-level pages and only works with classic menus, and it adds every new page, including ones you didn’t mean to show. Most sites are better off adding pages by hand.

On a block theme

Go to Appearance > Editor, open Navigation (or open the header template and select the Navigation block), click the plus icon and add a Page Link to your page. Then save. One Reddit user described getting there by trial and error: “I had to access the template editor, edit the navigation element, and then I could add, reorder, and delete page links.” The Site Editor shows each menu item as a block, and you drag Page Links into one another to build a submenu. For more complex dropdowns, see our guide to building a WordPress drop down list.

One trap applies to both theme types. In a resolved WordPress.org thread, a site owner deleted their pages and recreated them under the same names, and the menu stayed empty. Deleting a page removes its menu item. A new page with the same title is a different page, so you have to add it to the menu again.

How do you make the new page the homepage?

Go to Settings > Reading, choose “A static page”, pick your page under Homepage and save. If you also want a blog, create an empty page called Blog, choose it as the Posts page, and WordPress will list your posts there. Only published pages appear in these dropdowns. If yours is missing, it’s probably still a draft.

Why does the new page have no header or look different?

The page has the wrong template. Many themes include a Landing, Blank or Canvas template that deliberately removes the header, footer and menu, which suits a campaign page and nothing else. In a WordPress.org support thread, a site owner getting ready for a promotion published a new page and found it had no menu. The page was using a Landing template, and switching it to Default fixed the problem. Check the Template field in the sidebar before you change anything else.

If the template is right and the page still looks wrong, the problem is probably in the template itself: its width, spacing, sidebar or header. This is where adding a page turns into design work, and a change made there affects every page that uses the same template. If you’d rather hand that work off, SiteSelf’s page on design changes to an existing site describes the agent editing the styles and templates on your live site from a request you write in chat. If you want to do it yourself, theme customization that survives updates covers which layer to edit.

How do you add a page with Elementor or another builder?

Create the WordPress page first, then open it in the builder. With Elementor, that means Pages > Add New Page and then the “Edit with Elementor” button. Builders are common. HTTP Archive’s 2025 Web Almanac found that about 60% of WordPress sites use some form of page builder. Builders often have their own template and header settings, so the WordPress Template field may have no effect on what visitors see. If the builder won’t load or save, the problem is in the builder, not in page creation. Creating the page again usually just leaves you with duplicates.

What about WooCommerce Cart and Checkout pages?

They are ordinary WordPress pages, but WooCommerce ignores them until they’re assigned. A page called Cart does nothing until WooCommerce knows it’s the cart page. WooCommerce’s pages documentation sets out the process:

• If the pages are missing, recreate them from WooCommerce > Status > Tools with the create-pages tool.
• If you build one by hand, put the Cart or Checkout block on it, or put the shortcode ([woocommerce_cart], [woocommerce_checkout], [woocommerce_my_account]) in a Shortcode block. Pasted into a Paragraph block, the shortcode may not run.
• Assign each one under WooCommerce > Settings > Advanced > Page setup, and assign the Shop page under Settings > Products.
• Use a separate page for each function. WooCommerce warns that sharing one page causes incorrect redirects and broken payment gateways, and version 3.7 and later don’t let you do it.

Themes don’t come with these pages. The theme’s demo content can make it look as if they exist, which is what confused one store owner on r/woocommerce until they ran the Status tool and assigned the pages.

What does a correct result look like?

Open a private or incognito window, where you’re logged out, and check four things. The page loads at its URL. It appears in the menu on desktop and inside the collapsed mobile menu. It has the same header and footer as the rest of the site. Its links, buttons and forms work. Checking while logged in as an administrator doesn’t count, because you can see drafts and private pages that visitors can’t.

What if it still doesn’t work?

Work through the layers in this order. It goes from the cheapest check to the most invasive:

1. Status. Open Pages > All Pages. If the page shows “Draft”, “Private” or “Password protected” next to its title, visitors can’t see it.
2. The URL returns 404. Check the slug for typos and look for a post, category or plugin page with the same slug. Then go to Settings > Permalinks and click Save Changes without changing anything, which rebuilds the rewrite rules. Don’t switch to a different permalink structure on a live site. That breaks every existing URL.
3. Old version showing. Clear your caching plugin, your host’s cache, any CDN such as Cloudflare, and your browser. Only blame the cache after you’ve ruled out status and menus.
4. “Publishing failed. The response is not a valid JSON response.” The editor saves through the REST API, and this error means that request failed. Copy your content somewhere safe first. Then resave permalinks and deactivate plugins one at a time. In one WordPress.org case on Google Cloud, the fix was a server setting: Apache’s AllowOverride None had to become AllowOverride All.
5. “Publishing failed. You are probably offline.” Practitioners usually trace this to an HTTP and HTTPS mismatch, where the WordPress Address and Site Address settings don’t match the SSL setup at the host or CDN.

Stop and get help once a fix means changing server configuration, .htaccess or wp-config.php, or when you’ve switched to a default theme with all plugins off and the error is still there. At that point the problem is in hosting, not in WordPress. Host support can often fix a server-level error quickly. If your checkout is failing, don’t wait: get help straight away.

Frequently asked questions

How do I make a page appear as a dropdown under another page?

Set the parent in the page’s sidebar so the URL is right, then nest the menu item under the parent in Appearance > Menus or in the Navigation block. The parent setting and the menu are separate, so you have to do both. Setting a parent never puts a page into a menu.

Can I add a page straight from the Navigation block?

Yes. In the block Navigation editor you can type a name that doesn’t exist yet and create the page there. It still has to be published before it shows up. It’s easy to end up with a blank published page this way, so add the content before you leave.

How do I duplicate an existing page?

WordPress core has no Duplicate link in the page list. You can open the page, use the editor’s options menu to copy all blocks, and paste them into a new page. A duplicator plugin does the same in one step. Either way, give the copy its own slug and title.

Why can’t I find my new page in Google?

Publishing doesn’t tell search engines anything. They find pages by crawling, which takes time and speeds up when the page is linked from your menu, footer or other pages. Also check that your SEO plugin hasn’t set the page to noindex.

Should a developer create pages in theme files?

No. Page content belongs in the database, created in wp-admin or with WP-CLI’s wp post create --post_type=page. Theme files hold templates, which are the layout that wraps the content, not the content itself.

Can I add several pages at once?

The dashboard creates one page at a time. WP-CLI, importers and some builders can create them in bulk. Bulk-created pages that are nearly identical give visitors nothing new and tend to do poorly in search, so only make pages that each have their own purpose.

Putting a PDF on a WordPress page takes about a minute. Getting it to display everywhere is the harder part: on phones, behind a cache, inside a tab, over HTTPS. When it doesn’t work, visitors see a bare link, a grey box or a viewer stuck on “Loading…” and assume the page is broken.

This guide covers the methods in the order most sites should try them, then the failures people report most and how to fix each one. If you haven’t edited a block page before, start with how to edit pages in WordPress.

Which embed method fits your PDF?

For an ordinary public PDF, use the core File block. Add a plugin only when you need something the browser’s own viewer can’t give you.

Method	Use it when	Main weakness
File block with inline embed	A public brochure, policy or price list	Relies on the browser’s viewer, which is patchy on mobile
Iframe in a Custom HTML block	You need a size or title the block won’t set	Same browser dependency; breaks on HTTP or preview URLs
Viewer plugin	You need page navigation, zoom, mobile modes or view tracking	More scripts to exclude from caching, more updates, more to maintain
Google Drive embed	The file already lives in Drive and changes often	Depends on a third party and on sharing settings
HTML page plus PDF download	The content matters, changes often or has to be tracked	Takes the most work up front

One common mistake to rule out: the generic Embed block is for content from third-party services like YouTube, according to WordPress.org’s Embeds documentation. If you paste a PDF URL into it, you’ll usually get “Sorry, this content could not be embedded.”

How to embed a PDF with the File block

You need an editor or administrator account on a site that uses the block editor. No hosting access is required.

1. Open the page and add a File block. You can also type /file in an empty paragraph.
2. Upload the PDF or pick it from the Media Library.
3. In the block settings sidebar, find the PDF settings and turn on Show inline embed if it isn’t already on.
4. Set a height in pixels. For a portrait document, 600 to 800 is a reasonable starting point. A small height like 200 cuts the document off.
5. Keep the file name link and the Download button turned on. They are the fallback for any browser that can’t render the PDF inline.
6. Above the block, write a sentence or two saying what the document is. Search engines and screen readers can read that text. They can’t read what sits inside the viewer.
7. Update the page, then open it in a private window on desktop and on a phone.

The result should be a scrollable viewer at the height you set, with a working link and button below it. On many phones you’ll see only the link or the first page. That’s normal browser behaviour and the reason step 5 matters.

How to embed with an iframe or a plugin shortcode

When the File block isn’t enough, put an iframe in a Custom HTML block. Point it at a direct HTTPS URL for the file. The easiest way to get one is Media, then Library, then click the file and copy the File URL.

<iframe src="https://example.com/wp-content/uploads/2026/09/price-list.pdf"
  width="100%" height="800"
  title="2026 price list (PDF)"></iframe>
<p><a href="https://example.com/wp-content/uploads/2026/09/price-list.pdf">Open the price list (PDF)</a></p>

The title is what a screen reader announces for the frame. “2026 price list” helps a listener. “PDF viewer” doesn’t. If you paste the iframe into a field that filters HTML, like a widget, a theme option or a paragraph block, WordPress may remove it without telling you. Custom HTML blocks and page builder code modules keep it.

For a viewer plugin, use the plugin’s own block in the block editor and its shortcode everywhere else: the Classic Editor, builder text modules, widgets. PDF Embedder, which the WordPress.org directory lists at 300,000+ active installs, has both, and it renders the PDF on your own server without a third-party service:

[pdf-embedder url="https://example.com/wp-content/uploads/document.pdf"]

If you use Google Drive, the file has to be shared as “anyone with the link can view”. Use Drive’s own embed code, not the sharing link. A sharing link opens a preview page, not the PDF file. Don’t use Drive for private or regulated documents.

When a viewer plugin is worth the upkeep

A plugin earns its place when you need page-by-page navigation, zoom, a dedicated mobile mode, watermarks or view and download counts. Most plugins draw the PDF with JavaScript instead of the browser’s viewer, so it looks the same across browsers.

That control has a cost. Each viewer adds scripts that your caching plugin has to leave alone, updates that can change how it behaves, and code that needs security patches. Flipbook viewers look good in a demo. They are also heavier, and some need extra server headers before they load at all. If one plain viewer covers your needs, stop there.

Why your PDF shows a link, a blank box or “Loading…”

Most failures come from the setup around the embed, not the embed tool. The order below comes from reading support threads, not from measured data, so treat it as a rough guide. Whatever you try, check the file URL first.

The file URL doesn’t return a PDF

Paste the PDF URL into a private window. You should see the document. If you get a login page, a 403, a 404, a redirect to the homepage or a security challenge, the viewer has nothing to show. In your browser’s developer tools, open the Network panel, reload the page and click the PDF request. The Content-Type should be application/pdf. If it isn’t, the fix is on the server: hotlink protection, a firewall rule or a membership plugin. Send your host the URL and the response you saw. Renaming the file won’t help.

The wrong block or field was used

Check for a PDF URL in an Embed block, an iframe removed by a filtered field, a shortcode in a field that doesn’t run shortcodes, or “Show inline embed” switched off. Moving the content into the right container fixes all four.

A cache or minifier is serving stale or broken scripts

A viewer that sits on “Loading…” usually means its JavaScript didn’t run. That happens a lot after an update, when a caching plugin or CDN still serves the old files. Purge the caching plugin, the host cache and the CDN, then the browser, and test again in a private window. If it still hangs, exclude the viewer’s script files from minification and combining. Plugins sometimes rename those files, and an exclusion written for the old names quietly stops working. To test for conflicts safely, follow the plugin conflict routine on a staging copy.

HTTP, www and domain mismatches

An HTTPS page that loads an HTTP PDF is mixed content, and browsers handle it inconsistently. In one wordpress.org thread, a PDF with “Show inline embed” turned on displayed only in Firefox. The fix was loading the file over HTTPS in an iframe. Some viewers also refuse files from a different origin: www versus no www, another subdomain, or S3 and CDN storage without CORS headers. Pick one HTTPS domain and update old URLs to match it.

The viewer sits inside a tab, accordion or hidden section

A viewer that loads while its container is hidden measures its own size as zero and stays blank when the tab opens. Give each PDF its own tab, use a plain accordion, or put the document on a separate page. The same happens with any container that has no set height.

The phone can’t handle the file

PDF Embedder’s mobile troubleshooting page says phones have less memory and stricter rendering, so large or complex PDFs can crash or show blank pages. Its advice: compress the file, flatten transparency and layers, re-export with common fonts, and give a revised file a new name such as brochure-v2.pdf so no one gets the cached copy.

An update changed the behaviour

Embeds that used to work can break after an update. After Gutenberg 17.2.0, one user reported that inline PDFs showed only the text link and Download button, as if the setting had been turned off. If embeds broke the same day as an update, look at that update first.

What an embedded PDF doesn’t do

It doesn’t protect the file. To display a PDF, the browser has to download it first, so hiding the Download button or blocking right-click only slows people down. WooCommerce’s downloadable products documentation says anyone with the direct URL can open a Media Library file. Paid files should be uploaded from the Edit product page so they go into the protected woocommerce_uploads folder. Avoid the “Redirect only” download method, because it reveals the file’s URL.

It isn’t part of the page’s SEO. Google indexes the PDF as its own document. A noindex tag on the page doesn’t apply to the PDF. To keep a PDF out of search results, the server has to send an X-Robots-Tag header, as described in Google’s robots meta tag specification.

It isn’t automatically accessible. An accessible page doesn’t make the PDF inside it accessible. A scanned PDF with no text layer is just an image to a screen reader. The PDF itself needs OCR (with the errors corrected), tags, a reading order, a title and a language. The W3C lists how to do this in its WCAG 2.2 PDF techniques.

It isn’t free to load. A PDF of several megabytes on a homepage slows the whole page. Compress it, or show a thumbnail image that links to the file.

For newsletters, catalogs and anything with prices that change monthly, practitioners often suggest skipping the embed. Publish the content as a normal page and offer the PDF as a download. The page works on phones, search engines can read it, analytics can track it, and editing it doesn’t mean exporting a new file.

When to stop and get help

Once you’ve checked the URL, the block settings and every cache layer, what’s left usually needs someone who can read response headers, CORS settings and minification rules, or change server configuration. Stop there if the failure appears only for logged-out visitors, only through the CDN, or only inside a page builder layout. If you’d rather hand off the rest of the work, SiteSelf takes on page and layout changes on your existing site on request through chat, then checks the live page and reports back.

Frequently asked questions

Can I embed a PDF in WordPress without a plugin?

Yes. Use the File block with “Show inline embed”, or an iframe in a Custom HTML block that points to a public HTTPS PDF URL. Both rely on the browser’s built-in viewer. You get the document, but not the navigation, zoom or mobile mode a plugin adds.

Why does the PDF work in the editor but not on the live page?

The editor loads a fresh copy while logged in, and visitors get cached output. Purge the caching plugin, the host cache and the CDN, then check in a private window. If it still fails, compare the live page’s Console and Network panels with what you see in the editor.

How do I embed a PDF in Elementor or Divi?

Use the builder’s HTML or code module for an iframe, or paste the viewer plugin’s shortcode into a text module. Test the published page, not only the builder preview. Watch for viewers inside hidden sections or tabs, and remember the builder has its own cache to clear.

Can I embed a PDF hosted on another site?

Only if the viewer gets a direct link to the .pdf file and the other server allows it to be fetched. Some viewers accept only files from the page’s own domain. Others need CORS headers on the host. A viewer or preview URL from another service won’t work in place of the file.

How do I gate a PDF behind a form?

Put a form on a landing page and email a link to the file, not an attachment. If the file sits at a public Media Library URL, the gate is for show, because anyone with the link can skip the form. Store it somewhere that checks access.

WordPress is not a folder of HTML files. Your content is stored in the database, and your theme is PHP templates (classic themes) or block HTML templates (block themes) that build each page when someone requests it. What you see in View Source or Inspect Element is that finished output. You can’t save changes back to it.

So before “how do I edit the HTML” comes “which part of the site produces this markup?” A snippet on one page, the site header, a WooCommerce cart layout and an Elementor section are four different jobs in four different places. Get the place right and most edits take minutes. Get it wrong and the change gets stripped on save, breaks the block, or disappears at the next update. If you only need to change page text, editing pages in the block editor covers it without touching markup.

Which layer owns the HTML you want to change?

Match the change to the layer that produces it. Choose the narrowest option that does the job: it is the easiest to test and the easiest to undo.

What you want to change	Where to edit it	Risk
Add an embed or snippet to one post or page	Custom HTML block	Low
Adjust the markup of one existing block	Edit as HTML on that block	Low to medium (can break the block)
See or fix a whole page’s markup	Code editor	Medium
Header, footer, templates on a block theme	Site Editor (Appearance, then Editor)	Medium, applies site-wide
Header, footer, templates on a classic theme	Copy the PHP template into a child theme	High, needs file access
Shop, product or cart markup	WooCommerce template override or hooks	High
A page built in Elementor, Divi or similar	The builder’s own HTML widget	Depends on the builder
A script on every page	A header and footer plugin, or a child-theme hook	Medium

PHP never goes in any of the content routes. It belongs in a plugin, a snippets plugin or theme code.

How to add HTML to one post or page

Use the Custom HTML block. It stores your markup in the post content, renders it on the page and has a preview. WordPress.org’s Custom HTML documentation describes the steps:

1. Open the post or page in the block editor.
2. Click where the snippet should go, type /html and choose Custom HTML.
3. Paste or write your markup.
4. Switch to the preview and check it renders as expected.
5. Click Update (or Save) and open the published page to check.

Two mix-ups cause most “my HTML shows up as text” reports. Paste markup into a Paragraph block and WordPress displays the code as visible text. The Code block does the same thing on purpose, because it is for showing code to readers. Only the Custom HTML block renders markup.

Don’t paste a full HTML document either. WordPress already outputs <!DOCTYPE>, <html>, <head> and <body>, so paste only the fragment you need.

The block has been changing. WordPress.org’s documentation says WordPress 7.0 added separate editing areas for CSS and JavaScript. A Make WordPress Core post on WordPress 7.1 describes putting regular editable blocks inside a Custom HTML block: the static markup stays fixed, and the inner blocks can be edited in place but not moved around. That is useful when a client should change the words but not the layout.

Editing one existing block with Edit as HTML

Select the block, open More options (the three dots in the block toolbar) and choose Edit as HTML. Make the change, then choose Edit visually to switch back. WordPress.org’s More options page warns that after your changes the editor may no longer recognise the original block. The next section covers what that looks like.

Seeing the whole page in the Code editor

Open the editor’s More options menu at the top right, then Editor, then Code editor. You get the entire post as block markup, including the <!-- wp:paragraph --> comments that tell WordPress where each block starts and ends. Leave those comments alone. The Code editor is good for finding a stray tag. It is a poor place to write a page from scratch, and developers regularly complain that it normalises or strips markup they meant to keep. For hand-written layouts, use a Custom HTML block.

If you use the Classic Editor

Sites running the Classic Editor plugin edit HTML in the Text tab above the content box. Switching back and forth between Visual and Text can rewrite or strip tags, so finish your HTML work in Text and save from there.

Why WordPress says “This block contains unexpected or invalid content”

The block editor checks each block’s saved markup against the structure that block expects. If you edited a normal block’s HTML and it no longer matches, the editor shows this error. The live page often still looks fine. What breaks is your ability to edit that block visually.

WordPress.org’s block error guide lists the recovery options. Each one gives something up:

• Convert to blocks (or Attempt Block Recovery) keeps the block controls but can throw away custom markup that doesn’t map to the block. That is often the exact change you just made.
• Convert to Custom HTML keeps your markup exactly, but the block loses its visual controls.

Third-party block plugins make this worse. A WordPress.org support thread describes adding one paragraph inside an Advanced Columns container: the editor crashed, and neither recovery option kept the change. The rule that follows: if you plan to hand-write markup, start with a Custom HTML block instead of editing inside someone else’s block.

Why your script or iframe disappeared when you saved

Usually WordPress removed it on purpose. On a self-hosted site, users without the unfiltered_html capability have disallowed tags stripped by wp_kses() when they save, as the Custom HTML documentation explains. On a normal single site, administrators and editors have that capability and authors and contributors do not. On WordPress.com, the support documentation limits script, style, iframe and link tags to plugin-enabled plans.

Pasting the same script again won’t help. Pick a supported route instead:

• The service’s own WordPress plugin or embed block, if it has one. Disqus, Calendly and most video hosts do.
• A header and footer plugin for site-wide scripts such as analytics or chat widgets.
• A hook in a child theme or snippets plugin, for developers.

Widening wp_kses_allowed_html or giving untrusted users unfiltered_html works, and it also removes a security boundary. Anyone with that capability can put JavaScript on your pages. Save it for a last resort, done by someone who knows the risk.

How to change header, footer and template HTML

Don’t do it in post content. Where you do it depends on your theme type.

Block themes. If Appearance shows an Editor item, you have a block theme. WordPress.org’s Site Editor documentation says the Site Editor only appears when a block theme is active. The header and footer are template parts in there, and the Site Editor has its own Code editor. One trap catches developers: once someone saves a template in the Site Editor, WordPress stores that version in the database, and it overrides the parts/header.html file in the theme. Edit the file afterwards and nothing happens, with no error. Either make the change in the Site Editor, or reset the saved template so the file takes over again.

Classic themes. Copy header.php, footer.php or the page template from the parent theme into a child theme and edit the copy. If you edit the parent theme, the next theme update overwrites your change. Our guides to editing the WordPress footer and theme customization that survives updates go through both theme types step by step.

How to change WooCommerce markup

WooCommerce has its own override path, and it fails silently if you get it slightly wrong. WooCommerce’s template structure documentation says to copy the template into a woocommerce folder in your child theme, keeping the folder structure but dropping the templates folder:

wp-content/plugins/woocommerce/templates/cart/cart.php
becomes
wp-content/themes/your-child-theme/woocommerce/cart/cart.php

If the path is wrong, WooCommerce quietly uses its default template. If your theme contains a woocommerce.php file, you can’t override archive-product.php this way. Overrides also go stale: when WooCommerce changes a core template, it flags your copy as outdated, and an old copy can be missing hooks that newer extensions rely on. For small changes such as moving or removing an element, WooCommerce’s actions and hooks survive updates better than copying a whole template. Write down every override you make.

What if the page is built with Elementor, Divi or another builder?

Then the builder owns the markup. It stores the layout in its own data, often JSON, and generates the HTML from that. Editing the output directly either does nothing or corrupts the builder’s data. Use the builder’s HTML widget or element for snippets, and change attributes like nofollow in the builder, menu or SEO plugin that adds them. Downloading the page source, editing it and uploading it over FTP never works on WordPress, builder or not.

When should you edit theme files directly?

Only with a backup, and ideally on a staging copy. WordPress’s Advanced Administration Handbook says the built-in Theme File Editor and Plugin File Editor save straight to the live site, don’t have advanced syntax checking or line numbers, and need the files to be writable (permission 604 at minimum). It recommends editing files offline in a text editor, never a word processor, which changes straight quotes into curly ones and breaks the code.

One missing semicolon in a PHP file can white-screen the site and lock you out of the dashboard. That is why many sites turn the editors off in wp-config.php:

define( 'DISALLOW_FILE_EDIT', true );

Then edit over SFTP or your host’s file manager, in a child theme, with a copy of the original file saved. If a file edit has already taken the site down, follow our recovery steps for a white screen.

Why you saved the edit but nothing changed

Check these in order before you touch the markup again:

1. Wrong target. You edited the page when the element comes from the header template, or you edited a theme file when the Site Editor’s database copy wins.
2. Cache. Purge the page cache in your caching plugin, your host’s cache and any CDN, then load the page in a private window.
3. Logged-in view. Some caching and optimisation plugins treat logged-in users differently. Check the page logged out.
4. Stripped on save. Reopen the block. If your tag is gone, go back to the sanitisation section.
5. Builder ownership. The builder regenerated its markup over yours.

People often “fix” markup that was already right and break it, when the real problem was a stale cache.

How to check the result and undo it

Check the live page, not the editor preview. Theme CSS, plugin output and caching all come after the editor. Look at it on a phone-sized screen, click every link and button you added, and make sure hand-written HTML stays accessible and crawlable. Use real <a href> links rather than clickable <div>s, real <button> elements, alt text on meaningful images and alt="" on decorative ones, and <label> elements on form fields. The W3C Nu HTML Checker catches unclosed tags and invalid nesting.

To undo a content edit, use revisions. WordPress.org’s revisions documentation explains that every saved draft or update is recorded. Open Revisions in the post settings sidebar, drag the slider to the version before your edit, compare the changes and click Restore This Revision. Revisions only cover post content. Template, WooCommerce and file edits need your backup or the saved copy of the original file.

When to stop and get help

Content HTML in one post is a reasonable job to do yourself. Stop when the change starts touching PHP files, WooCommerce templates, a script that keeps getting stripped, or a block error that recovery won’t fix. At that point you’re not editing HTML any more. You’re diagnosing, staging and testing, and a mistake takes down a live page. If you’d rather describe the change than find the layer, SiteSelf handles website edits through chat: content changes go through the SiteSelf Connector plugin, template and file changes need hosting access, and pages owned by a visual page builder are refused with the reason.

Frequently asked questions

Can I edit my site permanently with Inspect Element?

No. Inspect Element changes only the copy of the page in your own browser, and it resets when you reload. It is still useful for finding which element and CSS class you need, so you know where the real edit belongs.

Can I put PHP in a Custom HTML block?

No. WordPress doesn’t run PHP stored in post content. Put PHP in a snippets plugin, a small custom plugin or a child theme’s functions.php.

The Edit as HTML option has disappeared. Why?

Usually a plugin conflict. In one WordPress.org support case, the option came back as soon as the GenerateBlocks plugin was deactivated. Check the browser console for errors, then deactivate plugins one at a time, on a staging copy if you have one.

Can I edit HTML on WordPress.com?

You can add content HTML with the Custom HTML block on any plan. According to WordPress.com’s support documentation, script, style, iframe and link tags need a plugin-enabled plan, and theme file access depends on the plan too.

Should I edit the parent theme or make a child theme?

Use a child theme, or the Site Editor on a block theme. The next theme update overwrites parent-theme edits. Our guide to editing themes without losing work covers setting up a child theme.

Is it fine to build whole pages out of Custom HTML blocks?

It works, but it becomes hard to maintain. The next editor can’t change a heading without reading code, and nobody remembers what each block does. Use Custom HTML for snippets, and use patterns, templates or the 7.1 editable inner blocks when the structure should stay fixed.

You change a headline, click Update, refresh the live page, and the old headline is still there. Or the text changes and the spacing collapses on mobile. Or the edit link opens a purple screen that says Edit with Elementor and none of the tutorial steps match what you see.

Finding a page and typing in it is the easy part. The part that costs an afternoon is working out which layer of the site owns the thing you want to change. A page has content, but it also sits inside a template, which belongs to the theme, and editing a WordPress theme safely is a different job with different risks. Get the layer right and most edits take two minutes.

Open the right page before you change anything

Log in at yourdomain.com/wp-admin, open Pages, then All Pages. Hover the title of the page you want and click Edit. Make the change, click Update. That is the whole flow, and on a simple page it works exactly as it reads.

Two shortcuts save time on busy sites:

• Quick Edit. Hover the title in the Pages list and click Quick Edit to change the title, the slug, the status or the parent without loading the editor. Click Update in the same row.
• The admin bar. While logged in, open the page on the front end and click Edit Page in the black bar at the top. This is the reliable way to be certain you are editing the page a visitor is looking at, not a similarly named copy.

That copy problem is common enough to check for. Sites accumulate duplicates: /about/ and /about-2/, a seasonal landing page cloned three times, a translated version that looks identical in the list. Before editing, confirm the slug in the row matches the URL you visited. You need the Administrator or Editor role to edit published pages; Contributors can write but not publish.

The editor that opens tells you where the content lives

WordPress.org’s documentation calls the default editor the block editor, the WordPress editor or the Gutenberg editor, all the same thing. It builds a page out of blocks: paragraph, heading, image, buttons, columns, group. What you type there is saved into the page’s content, so it is the layer you can reach and change with no help.

Three other things can open instead, and each one means something:

• One large text area with a formatting toolbar. That is the classic editor, usually because the Classic Editor plugin is active or the page holds a Classic block. Content still saves into the page. Layout control is minimal.
• A button that says Edit with Elementor, Edit with Divi or Beaver Builder. The builder stores the layout in its own data, not in the page content. Elementor’s listing in the WordPress.org plugin directory describes it as a drag and drop website builder, and the practical consequence is that the page’s design belongs to it. Edit that page in the block editor and you either change text nobody sees or you wreck the layout. Stay in the builder, or rebuild the page deliberately. Our explainer on what a landing page builder really does covers that tradeoff.
• The Site Editor, reached through Appearance then Editor. WordPress.org’s documentation says the Site Editor is only available when a block theme is installed and activated. If Appearance shows an Editor item, part of what you see on your pages is a template, and headers and footers are template parts rather than page content.

The same distinction explains locked blocks. If you select a section and the layout controls are missing, you are usually inside a pattern, which opens in content-only editing, or inside a template part being edited from a template. Text is editable, structure is not. Edit the pattern at its source, or open the template part directly, which is the same path as editing the footer in WordPress.

Change the block, not the container

Most “I broke the design” damage is a container that moved. A paragraph sits inside a Group, which sits inside a Column, which carries the padding. Drag the paragraph and the spacing goes with it.

1. Open List View (the icon at the top left of the editor). It shows the real nesting. Select the block you mean to edit there, not on the canvas.
2. Use the sidebar, not just the toolbar. Dimensions, spacing, colour and typography live in the block settings panel on the right. If one call to action has custom padding and the next inherits theme defaults, they will look aligned in the editor and uneven on the live page.
3. Duplicate a section that already works rather than rebuilding one. Right-click the block in List View, choose Duplicate, then change the text. Inherited settings come with it.
4. Save a draft first on anything structural. Revisions are good for text and weak for layout, especially with synced patterns involved.
5. Preview in a new tab, and check it logged out. An incognito window shows what a visitor gets, without your admin styles or your cache.

For small markup fixes, the three-dot menu at the top right switches to the Code editor, and a Custom HTML block holds raw markup inside a page. Structural changes belong in a child theme, not in the page.

You clicked Update and the live page looks the same

The edit almost always saved. Something else is deciding what visitors see. Work down this list in order, because the cheap causes are also the common ones.

1. Your browser. Hard refresh with Ctrl+Shift+R, or Cmd+Shift+R on a Mac, then load the URL in a private window.
2. Site and CDN cache. Purge the caching plugin, then the host’s cache, then Cloudflare or whatever sits in front. Two cache layers with no exclusion for the admin will also break the editor itself, not only the front end.
3. The wrong page. Compare the slug you edited against the URL in the address bar. Duplicates and translated copies look identical in the Pages list.
4. A template is printing the homepage. Check Settings, then Reading, which is where WordPress decides whether the front page shows your latest posts or a static page. Even when that setting is right, the theme handbook’s front page hierarchy checks front-page.php before the page you selected, so a theme file can output a layout that owes nothing to the page editor. Change it in the template, in a child theme so an update does not wipe the work.
5. The content is builder data. Open the page and look for an Edit with Elementor or Edit with Divi link. If it is there, that is where the visible text lives.
6. You are looking at the wrong environment. Staging edits stay on staging until someone pushes them.

The WooCommerce Shop page deserves its own line, because it is the single most reported version of this. WooCommerce’s own documentation lists Shop, Cart, Checkout and My Account as pages created automatically during setup, and notes that Shop requires no content. WooCommerce builds the product listing on the fly. Editing that page does nothing. Change the Product Archive template in the Site Editor, use your theme’s catalog options under Appearance then Customize if it has them, or build a normal page with a shortcode such as [products columns="3" orderby="date"] and assign it as the shop page in WooCommerce settings.

If tracking down which layer owns a change is not how you want to spend the afternoon, SiteSelf handles WordPress page edits through chat: you say what to change, the agent finds the page, makes the change, fetches the result and reports what it changed and what it checked, and pages owned by Elementor, Divi or Beaver Builder are refused at the moment of work, with the reason.

When the editor will not load at all

A blank editor canvas, a critical error on the edit screen, or a 404 on the edit link is a different problem from an edit that does not appear. WordPress.org support replies and builder documentation converge on the same sequence. Follow it in order; the early steps are reversible and the last one is where people lock themselves out.

1. Browser and cache. Different browser, private window, cache cleared. Five minutes, and it settles a surprising share of cases.
2. All plugins off. Not two suspects, all of them. If editing works, reactivate one at a time until it breaks. The last one you switched on is the culprit. One WordPress.org thread titled “Cannot edit page until I disable BOGO” is a clean example of the pattern: the reporter first blamed the theme and the host, saw “You attempted to edit an item that doesn’t exist. Perhaps it was deleted?”, and found the answer in the plugin they had installed most recently. Our guide to fixing WordPress plugins that are not working walks the isolation process in detail.
3. Default theme. Switch to a recent bundled theme such as Twenty Twenty-Five and retest. Theme and core updates that land out of step are a repeatable trigger: a theme stylesheet loaded into the editor can render your content white on white.
4. Check /wp-json/. Load yourdomain.com/wp-json/ in a browser. You want JSON. A 403, a 404, an HTML page or a PHP warning printed above the JSON gives you the classic blank block editor. Resave Settings, then Permalinks, with no changes to reset routing, then look at security plugins and host firewall rules that filter that path.
5. PHP memory and logs. A white screen with nothing in the browser console usually means a PHP fatal error. Add define('WP_MEMORY_LIMIT', '512M'); to wp-config.php, and raise the server’s own memory_limit too, since WordPress cannot exceed it. Then read the PHP error log, or ask the host for it, because more memory hides a fatal error rather than fixing it. The white screen troubleshooting guide goes through the log reading.
6. Roles and capabilities, last. “Sorry, you are not allowed to edit this item” on an account that shows as Administrator usually means capabilities in wp_usermeta are wrong, or a membership or role manager plugin is overriding them, or you are an admin on a different site in a multisite network.

When to stop and get help

Stop at the database. Editing user capabilities by hand in phpMyAdmin is how people lose access to their own site, and it is the step to hand to a developer along with the error log. Stop too when the cause is a plugin’s code rather than its settings: a plugin that opens output buffering without closing it, or ships files with whitespace after ?>, corrupts the JSON the editor depends on, and only the plugin author or a developer can fix that. And back up before any of this, on a staging copy where you have one. Running a full plugin deactivation test on a live store during business hours is its own outage.

Frequently asked questions

What is Quick Edit actually for?

Title, slug, date, parent, template in some themes, status and password protection, all without loading the editor. It is the fastest way to fix a URL or unpublish something. It cannot touch the page’s body content.

Can I edit a page’s HTML directly?

Yes. The three-dot menu at the top right of the block editor switches to the Code editor, which shows the block markup for the whole page, and a Custom HTML block holds raw markup inside a layout. Anything structural, like the wrapper around the content, is a template file and belongs in a child theme.

Why can I not edit the WooCommerce shop page?

Because it is not a normal page. WooCommerce’s documentation lists Shop among the pages created automatically at setup and notes it needs no content; the product listing is generated on request. Edit the Product Archive template, use your theme’s catalog settings, or build a page around a products shortcode and point WooCommerce at it.

Is the classic editor gone?

No. The Classic Editor plugin still works, and pages already holding a Classic block still render and open for editing. If you cannot find a Classic block to insert on a recent WordPress version, that is a change to what the inserter offers by default, not the removal of classic editing.

Can I edit a builder page in the block editor to save time?

Not safely. The layout is in the builder’s data, so the block editor shows you a stripped version at best. Deactivating the builder to “switch to Gutenberg” leaves orphaned shortcodes and missing sections. Either keep editing in the builder or rebuild the page on purpose, with the old version still live until the new one is ready.

How do I let a marketer edit copy without touching the design?

Give them the Editor role, then lock the structure rather than the person: keep hero sections and repeated layouts in patterns and template parts so they open in content-only editing. Text stays editable, spacing and columns do not. A short written note saying which page holds which section beats any capability tweak.