December 22nd, 2008 by Heather
WordPress H1 Hack -
This has most commonly been used in the page.php file of the WordPress themes only, but can certainly be applied to any page that you would like the ability to set the h1 tag (or some cases, if you prefer, the h2 tag). Remember, it is recommended to set the default theme h2 tags displaying the header of the pages to H1 for an SEO advantage.
This documentation will demonstrate applying this hack to page.php in your theme, but can easily be understood from that point on doing the same to your template pages, index.php, single.php, etc.
Step by Step:
2. In your favorite editor for editing your theme pages, or using the Theme Editor under the Presentation tab of the WordPress admin area, open pages.php for editing.
3. In the default theme of WordPress or the theme you are using, you will see a section toward the top of the file that looks exactly like or similar to this:
It’s this line – <h2><?php the_title(); ?></h2> that you will be changing. It may not look exactly the same, but will almost always be enclosed in h2 tags.
You will want to replace the contents inside those tags, but it is highly recommended that if they currently say <h2></h2> to change those to h1.
4. Replace that line with the following:
So your file should now look similar to this:
5. Save the file and upload it to your theme folder or save the file in the theme editor.
6. Now you can edit or create new pages and use the custom fields to change the heading of the page without changing the actual title of the page.
7. To do this, as an example, let’s create a new page named “Test”.
8. Publish the page, then view it from your WordPress site.
9. You can see that not only the title in the browser, in the menu, and the heading of the page says “Test”.
10. Now back to the admin area, edit the page “Test”.
13. Here you will need to add “changeH1” to the key text box for the first time. Be sure that changeH1 is spelled exactly the same and the “H” is capitalized.
14. After you have done this the first time, you will be able to select the changeH1 from the drop-down box under the word Key instead. It is only necessary to add the key once with a value, and from that point, it will remain in the drop-down list to be selected easier.
15. Now change the header by typing a new one in the Value text box to the right. Let’s just test it out by typing “This is my new heading text”. Then click “Add Custom Field”.
16. Save and continue, or save the page now.
17. Go back to your site and refresh to see the change.
18. Now you can edit any page to display a different heading just by setting the “changeH1” key in the drop-down list and typing in the heading you want in value. Don’t forget to click “Add Custom Field”.
19. If you have already set a heading in a page using this method, you can also go back to editing the page, and change the value in the box just above where you set it originally. After making the change click on “update”.
97 Responses to “H1 Hack for WordPress Pages”
Leave a Reply