One Page Text Link Element

01/03/2019

The One Page Text Link Element is a very simple element, that allows you to add an anchor link anywhere on your page. This connects with an anchor id, somewhere else on the page.

By setting up an anchor link, and then adding an anchor id somewhere else on the page, potentially with the Menu Anchor Element, people can click on the anchor link and be taken directly to the section with the anchor id.  See below to read more about this handy element. For more information on anchors generally, follow the link to the Anchor Scrolling documentation.

Example: This is an Anchor Link, created with the One Page Link Element, that will scroll down to the Anchor ID lower on the page when clicked.

Read all about Anchor Scrolling Here!

How To Use The One Page Text Link Element

Using the One Page Text Link Element allows you add a text or HTML link to target a specific section of the page.

Step 1 – Create a new page or post, or edit an existing one.

Step 2 - Add a text based element, and add your content, leaving a space for the Link.

Step 3 - Now we need to add the One Page Text Link Element. To do this, position your cursor at the place you want the link, and then click the Fusion Builder Element Generator icon on the toolbar, as seen in Example 1.

Step 4 - Locate the One Page Text Link Element and click it to bring up it's options window.

Step 5 - In the Name of Anchor field, enter a unique Anchor link.  Preface it with a #, eg. #anchor.

Step 6 – In the Text or HTML code field, add the text you want to carry the link, or add HTML, for example, to use an image. See Example 2.

Step 6 – Once finished, click ‘Save’. You'll be returned to the original text based element, and you can see the One Page Tex Link shortcode has been added to the code. See Example 3. Save the element to save your changes.

Step 7 - Next, you need to add an Anchor ID, somewhere else on the page. There are several ways to do this, including the Menu Anchor Element, so read about Anchor Scrolling for more information.

NB. The Anchor Link will always display in the main site color.

One Page Text Link Element Example 1
Example 1
One Page Text Link Element Example 2
Example 2
One Page Text Link Element Example 3
Example 3

Element Options

Location: The edit screen within each Element.

You can deploy as many individual Elements in pages and posts as you need, there is no limit. Within each of the Elements, you will see a tab or tabs that house an array of options that make it possible for you to configure each Element independently, and greatly enhance your flexibility and creative options.

  • Type - Unique identifier of the anchor to scroll to on click. Preface it with a #, eg. #anchor.
  • Text or HTML code - Insert text or HTML code here (e.g: HTML for image). This content will be used to trigger the scrolling to the anchor.
  • CSS Class - Allows you to add a class to the wrapping HTML element.
  • CSS ID - Allows you to add an ID to the wrapping HTML element.
View The Options Screen

Global Options

There are no Global Options for the One Page Text Link Element.

One Page Text Link Element Parameters

Copy to Clipboard
  • link – The unique identifier of the anchor link to scroll to on click.
  • name – The unique name of the ID to use on your one page menu. Learn more here.
  • class - Add a custom class to the wrapping HTML element for further css customization. Learn more here.