Better Blog Formatting. Better Presentation. Better Search Results. Get Started
WhatsApp LinkedIn Facebook YouTube
Post Uploader
  • Home
  • About
    • About Us
    • Leadership Team
    • Recognition & Trust
    • Request Consultation
    • Help & FAQs
    • Careers
    • Contact Us
  • Pricing Plans
  • Services

    Our Services

    • Blog Formatting & Publishing
    • eCommerce Product Listing
    • Get a Website
    • Website Content Population
    • AI Workflow Automation
    • Virtual Assistant Support

    Our Clients

    • Digital Marketing Agencies
    • Small & Growing Businesses
    • Startup Companies
    • SaaS Companies
    • Travel & Lifestyle Blogs
    • Recipe & Food Websites
  • Case Studies
  • Blog
Get in Touch Get in Touch
  • Home
  • Blog
  • Blog Post Formatting Guides
  • How to Create Anchor Links on the Same Page with WordPress Editors
Guide to creating anchor links on the same page with WordPress editors
Anchor Links on Same PageClassic Editor Link SetupGutenberg Editor Anchor LinksImprove User Experience WordPressWordPress Navigation Tips
PostUploader.com
October 27, 2024
Blog Post Formatting Guides
0 Comments:

How to Create Anchor Links on the Same Page with WordPress Editors

In the world of blogging, creating seamless navigation within a post can make a world of difference to readers. With effective internal links, you can guide users to specific sections within a blog, making it easier for them to access content they’re interested in.

This tutorial will walk you through the step-by-step process of adding links within a WordPress blog post, covering both the Gutenberg and Classic Editors.

By the end, you’ll have all the knowledge to improve user experience and SEO in your WordPress blog.

Watch the following video to get visual instructions for internal linking in WordPress:

  • Benefits of Internal Linking in WordPress
  • Step-by-Step Guide to Adding Links in Gutenberg Editor
  • Setting Up Internal Links in Classic Editor
  • How to Test and Optimize Internal Links
  • Best Practices for Anchor Names
  • HTML Anchors and IDs Explained
  • Frequently Asked Questions
  • Conclusion

Benefits of Internal Linking in WordPress

Adding links that direct readers to specific sections isn’t just about aesthetics; it’s a practical approach for improving user experience and SEO. For instance, if your post includes multiple sections, a direct link can help visitors navigate quickly, especially in lengthy tutorials.

WordPress offers two primary ways to do this through the Gutenberg editor and Classic editor, each with its own method for creating effective, internal links.

Step-by-Step Guide to Adding Links in Gutenberg Editor

Using the Gutenberg editor, creating a link within a post is a quick and user-friendly process.

Here’s how:

  1. Open the Post in Gutenberg Editor: Start by navigating to your WordPress dashboard and selecting the post you want to edit.
  2. Select Text to Link: Highlight the phrase or word you’d like to serve as the link. For example, you might write “Jump to Conclusion.”
  3. Use the Link Tool: Once your text is selected, use the link icon in the editor toolbar. You can also use the keyboard shortcut “Ctrl + K” to open the link menu.
  4. Set the Anchor with Hash (#): In the link field, type “#” followed by the anchor name (e.g., #conclusion). This tells WordPress that the link will navigate within the same page.
  5. Designate an Anchor in Target Section: Scroll down to the section you want to link to. Select the block, then go to the right sidebar and click on “Advanced.” Here, you’ll see an HTML Anchor option where you can type the same anchor name (e.g., conclusion)—just without the #.

Setting Up Internal Links in Classic Editor

Unlike Gutenberg, the Classic Editor requires a slightly different method for linking internally.

With this editor, you’ll need to manually add an HTML ID to the target section:

  1. Open the Post in Classic Editor: Select your post and open it in the Classic Editor.
  2. Highlight the Linking Text: Just like in Gutenberg, select the text you want to link (e.g., “Take me to the Introduction”).
  3. Insert the Hash Link: Use the hyperlink icon, and type in #introduction to set the link. Press enter to save the link.
  4. Create an ID for the Target Section: Now, scroll to the section you want to link to. Switch to the “Text” tab of the editor. Here, locate the tag for the target text (like a heading or paragraph) and add id="introduction" to the opening tag.
  5. Save and Preview: Save the changes and preview your post to ensure that the link works as expected.

How to Test and Optimize Internal Links

Testing is essential. After you’ve added your internal links, preview the post, click each link, and verify that it takes readers to the correct section.

Smooth scrolling is typically enabled by default, creating a better user experience as users won’t be abruptly moved around the page.

“Anchor Links provide readers with an optimized experience and can also improve site navigation and SEO performance.” — SEO Expert

Best Practices for Anchor Names

Anchor names should be intuitive. They should relate directly to the section you’re linking to, such as “summary,” “conclusion,” or “examples.” This approach keeps your page organized and improves accessibility, especially for screen readers. Avoid spaces in anchor names; use underscores or hyphens if you need to separate words, like conclusion_section.

“Clear, consistent anchor links are key to a well-organized page, creating a fluid experience for readers.” — Content Strategist

HTML Anchors and IDs Explained

For those using HTML for linking, anchor links are set up with a specific ID attribute on the target section. The ID serves as a marker for the browser to locate when the link is clicked. Remember, each ID must be unique within a page; duplicate IDs can cause navigation errors and hurt accessibility.

Frequently Asked Questions

You can use the link tool in both the Gutenberg and Classic editors. Select the text, add a # followed by an anchor name, and add the matching anchor in the target section.

Use descriptive terms, like “summary” or “conclusion.” Avoid spaces by using underscores or hyphens.

This method is primarily for internal navigation within the same page. For linking to other posts, use the full URL.

While not mandatory, internal anchors improve user experience and help search engines understand page structure.

Yes, but you need to add HTML IDs to the target section manually.

Ready to Learn More? Subscribe to Our YouTube Channel! For those who prefer visual tutorials, visit our YouTube Channel and subscribe for more WordPress tips.

Conclusion

Adding internal links within a WordPress blog post is a simple yet powerful tool. By following the steps outlined above, you can create smooth navigation that enhances both user experience and SEO. If you’re still uncertain, watch the video above for a step-by-step visual guide.

For advanced help with WordPress blog uploads, you can find additional support on our WordPress Blog Upload page. And for any questions or specific assistance, don’t hesitate to contact us.

  • Anchor Links on Same Page
  • Classic Editor Link Setup
  • Gutenberg Editor Anchor Links
  • Improve User Experience WordPress
  • WordPress Navigation Tips
Share
Prev Post Next Post

Recent Posts

Before vs. After: How Blog Post Formatting Transforms the Same Content
Before vs. After: How Blog Post Formatting Transforms the Same Content
May 19, 2025
Blog Post Formatting Services
Weekly Blog Post Formatting Services: Save Time and Improve Quality
May 4, 2025
how to format a blog post
How to Format a Blog Post Like a Pro: The Ultimate Guide to Presenting Your Blog Beautifully
Apr 9, 2025

Tags

  • Adding Featured Images
  • Add Media and Text in WordPress
  • Add Text Over Images in WordPress
  • AffiliateX Plugin
  • Affiliate X Plugin
  • Blog Engagement
  • blog formatting
  • Blog Formatting Tips
  • Blogging Tips
  • Blog Post Formatting
  • Blog Post Optimization
  • Business
  • classic editor
  • Combine Media and Text in WordPress
  • Digital
  • Funds
  • Gutenberg editor
  • Gutenberg Editor Tips
  • Install Jetpack Plugin
  • Jetpack Features Guide
  • Kadence Block
  • Kadence Blocks
  • Leadership
  • SEO Optimization
  • Tech
  • Text Overlay in WordPress
  • WordPress Blog Optimization
  • WordPress Blog Post Formatting
  • WordPress Blog Tips
  • WordPress Content Management
  • WordPress Customization
  • WordPress Design Without Photoshop
  • WordPress Editing Tips
  • WordPress formatting
  • WordPress Image Upload
  • WordPress Media and Text Block
  • WordPress Plugin
  • WordPress Plugins
  • WordPress SEO
  • WordPress Text Formatting
  • WordPress Tips
  • WordPress Tutorial
  • WordPress tutorials
  • WordPress user roles
  • WordPress without Plugins
PostUploader.com

Post Uploader LLC

75 E 3rd St Sheridan, WY 82801, USA info@postuploader.com +1 (307) 310-2432

Secure Payments

Payments on this website are processed securely through Stripe.

We accept major credit and debit cards, including Visa, MasterCard, American Express, and Discover.

Additional payment methods such as Google Pay, Cash App Pay, Amazon Pay, and the express checkout option “Link” may also be available depending on your device and location.

About

  • About Us
  • Recognition & Trust
  • Leadership Team
  • Blog

Our Services

  • Blog Formatting & Publishing
  • eCommerce Product Listing
  • Get a Website
  • Website Content Population
  • AI Workflow Automation
  • Virtual Assistant Support

Our Clients

  • Small & Growing Businesses
  • Digital Marketing Agencies
  • IT & Technology Businesses
  • eCommerce Businesses
  • Bloggers & Niche Websites
  • Physiotherapy & Healthcare Websites

Important Links

  • Privacy Policy
  • Terms of Service & Refund Policy
  • Request Consultation
  • FAQ's
  • Careers
  • Contact Us

©2022 - Post Uploader LLC, All Rights Reserved.

PostUploader
Focus on writing while we handle formatting, structure, images, and publishing—everything your blog needs to go live professionally.

Check our pricing below to get started today.
See Pricing Plans

Post Uploader LLC

75 E 3rd St Sheridan, WY 82801, USA info@postuploader.com +1 (307) 310-2432
Live Chat
1
Scan the code
Message Us on WhatsApp
Hello,
Welcome to PostUploader.com
May I help with your Blog Post Formatting and Publishing?
Start a Chat