How can I link the names of two people mentioned in the upcoming events section of my website to their respective personal bios in the about section using Webflow?

TL;DR
  • Assign unique IDs to each bio section in the About page using lowercase and hyphens.  
  • In Upcoming Events, wrap each name in a link using #id for same-page links or /about#id if on a different page.  
  • Test the links to ensure they navigate correctly to the corresponding bios.

To link the names of two people in the Upcoming Events section to their bios in the About section, you need to use anchor links or page links depending on your structure.

​

1. Identify the Bio Sections in the About Page

​

  • Go to the About page in the Webflow Designer.
  • Select the element (e.g., a Div Block or Section) where each person’s bio starts.
  • In the Element Settings Panel (D), set a unique ID for each bio (e.g., jane-doe or john-smith).
  • Only use lowercase and hyphens (no spaces or special characters).

​

2. Copy or Construct the Correct Link

​

Depending on where the Upcoming Events section is located (same page or another page), the link will differ:

​

  • If both Upcoming Events and Bios are on the same page:
  • Use an anchor link like #jane-doe.

​

  • If Upcoming Events is on a different page (e.g., Home), and Bios are on the About page:
  • Use a relative URL with anchor like /about#jane-doe.

​

3. Add the Link to the Names in Upcoming Events

​

  • Go to the Upcoming Events section in the Webflow Designer.
  • Highlight the person's name inside a Text Block or Rich Text element.
  • Wrap the name in a Link or Text Link by using the context toolbar or right-click menu.
  • In the Link settings, choose URL and paste the correct anchor link (e.g., /about#jane-doe).
  • Optionally, set the link to open in the same tab for smoother in-page navigation.

​

4. Test the Links

​

  • Publish your site, or preview it in the Designer.
  • Click the linked names and confirm they scroll or navigate directly to the appropriate bio section.

​

Summary

​

To link names in Upcoming Events to bios in the About section, add unique IDs to each bio and use anchor or relative links (#id or /about#id) in the Event section. This creates a smooth direct connection between the two sections.

Webflow Resources
Webflow templates
Webflow inspiration
Rate this answer

Other Webflow Questions

Explore Logic tutorials
How do I set up SSL hosting using NameCheap for a client site in Webflow?
How do I resolve issues with order confirmation emails and mobile optimization for ecommerce in Webflow?
What are the reasons for the error messages "Your upload failed because of a filename error" and "There was a problem creating a new asset manager folder" in Webflow when uploading pictures into a predesigned template or creating a folder for uploads?
How can I highlight the 'current' page in Webflow CMS collection template pages for my nav-bar links? (For example, I have a page called 'case studies' that shows items from a CMS collection also called 'case studies'. When showing the CMS collection template page for each case study, I want the nav link for 'case studies' to be highlighted to indicate the user's current location on the site). Can anyone suggest a solution? Thank you.
How can I auto start and loop a YouTube video in Webflow without the play button?
How can I pass the UTM parameters of a submitter in a hidden field using Webflow form and integrate it with Mailchimp? I've tried various solutions from different sources but have been unsuccessful so far. Any ideas on how to make it work?
Can Webflow provide Android scrollbars? How can they be implemented?
Is there a way to use Webflow's CMS to easily integrate page updates on our company's site, without needing to deploy code for each update? We want a method that allows another team to create or update content on Webflow, with those changes automatically reflected on our site. The CMS content should only affect the body of the page, while the header and footer remain the same internally. It should also maintain the responsive design created in the Webflow editor, and include images, text, and links to other pages. We have tried code exporting and using an iframe with a published .webflow.io domain, but encountered issues. Any solutions?
How can I create a lightbox hover effect with text in Webflow similar to the example shown in the tutorial?
Why am I getting a 400 Bad Request error when trying to change a reference field that references another collection in Webflow CMS?
How can I fix the "Uncaught ReferenceError: $ is not defined" and "Uncaught SyntaxError: Unexpected token <" errors on my Webflow site?
Is it safe to store sensitive data on Webflow's CMS?
Is there a way to add an automatic "click to download" option for resumes in Webflow, or do I need to send people to my Dropbox via a link?
How can I add hreflangs to specific CMS blog pages in Webflow without creating issues with multiple head tags?
Can I change the login form from an email ID tag to a Username ID tag in Webflow? What is the Username ID for this feature?
Can I capture a screenshot of a Webflow page on click and convert it to a downloadable PDF?
How can I alternate the layout of the image and heading for each collection item in a two-column format on Webflow?
How can I execute JavaScript code when clicking a specific button with a given ID in a Webflow project?
How can I disable the Webflow success or failure state for a sign-up form and display a custom thank you page using jQuery and the Webflow form submit state?
How can I create a vertical scrolling menu with Webflow, similar to the one on Apple's website, that switches to horizontal scrolling when the menu doesn't fit on one screen?
How can I change the language of the Google Maps embed from English to Arabic in Webflow?
How can I reduce the vertical space between lines within a bullet point in Webflow? Can I replace the bullet points with icons on the "Services" page?
How can the text color be changed for custom input fields on Webflow?
How can I add conditional visibility in Webflow to prevent a div from appearing on a published page if a CMS field is empty?
How can I stop a YouTube video from playing in the background in audio mode when I close a modal in Webflow?
How can I connect and use my JavaScript and CSS files for special functions and styles in Webflow?
How can I fix the "Ensure text remains visible during webfont load" warning in Webflow?
How can I implement a ThreeJS script as a background for my Webflow project using custom code?
How can I send data from a Webflow Form to ActiveCampaign without using Zapier? I have set the form to POST and input the form's action URL, similar to Mailchimp but it redirects me to the admin area of ActiveCampaign without sending the data. Has anyone had success with this method?
Can Webflow be used to create a "blob" elements effect in the header of a website using custom code or JavaScript?