Links

 

Links are any textual, visual, or in some cases, email element in HTML. In the ProProfs Knowledge Base editor, you can insert links to an internal/external URL to add a reference to your knowledge base articles. You can even add an email address as a link to invite user feedback & queries via email.

 

This article shows a step-by-step procedure for adding links to other pages.

 

Benefits of adding links:

 

  • Simplifies navigation to related articles

  • Redirects users to the relevant information

  • Boosts help pages' search visibility

 

Here's how various link types can improve page navigation.

 

Link to an external URL

 

Link to an external URL

 

Anchor Link

 

Anchor Link

 

Link as an email

 

Link as an Email

 

This article covers the following:


Link Dialog Box Overview

 

To insert a link into your page, press the "" icon on the toolbar or use the Ctrl+L keyboard shortcut. 

 

If you want the link to be assigned to a specific text, select that text first. The link URL or email address will appear as is on the page if no text is picked.

 

The Link dialog box contains two sections: Link info and the Advanced section. Let’s see how these options work:

 

NOTE: When Link Type is selected as “URL,” you have one more option as Target in the Link Dialog box.

 

 Link Info

 

The Link Info tab is the default tab that opens after you click the button on the toolbar in which you have:

 

  1. Link Type: It allows you to choose one of the following options:

  • URL the web address of anything available on the Internet, such as a website, a PDF document, or an image. For example, you can use http://example.com/about.html or http://example.com/image1.jpg as the URL.

  • Link to anchor in the page – an internal link to a designated point on your page. For example, you can use #anchor1 to anchor text.

  • Email Use an email address as a link. For example, use myname@example.com to link email.

 

  1. Protocol This is the communication protocol used with the web address. You can choose one of the following options: http://, https://, ftp://, news://, or . to use in the protocol.

  2. URL This is the website address for the external resource to which the link will redirect users. For example, you can use the URLs: http://example.com/about.html or http://example.com/image1.jpg.

  3. Browser Server - You can also browse the server to select an image or file. If you upload a file using the file manager, you can add a link on a page to download the file.

  4. Link to Page - This will open an overlay to link to another page.

 

 Link URL

 

In your ProProfs Knowledge Base page editor,

 

Step 1: Select the text and click “” in the toolbar.

 

Select Text and click the Link icon

 

  • Select the link type as “URL,” enter the link and click OK.

 

Enter Link details

 

How to set the targeting options

 

After adding the URL, you need to set the Target options. Switch to the Target tab, select the target option and click OK to save the changes.

 

Configure the Target Settings

 

Here is a brief description of how these target options work:

 

  1. <not set>: Opens the link in the same tab.

  2. <frame>: Opens the link in the named iframe.

  3. <popup window>: Opens the link in the popup window.

  4. New Window: Opens the link in the new tab.

  5. Topmost Window: Opens the link in the entire body of the window.

  6. Same Window: Opens the link in the same window or frame.

  7. Parent Window: Opens the link in the parent frame.

 

Link Type > Email

This feature allows you to insert a clickable email address, subject, and body of the email message to your pages when you click the link.

 

Link Type> Email

 

The Link Info tab contains the following fields that let you configure the recipient and the message content:

 

  • Email Address This is the address of the recipient of the email message. This field is required for the email link to work.

  • Message Subject This is the default text in the email message's subject line.

  • Message Body This is the default text in the email message as its content.

 

Link Type > Link to anchor in the text

To use anchor links, you will need to insert anchors in the page. To insert an anchor, press the button on the toolbar. The following Anchor Properties window will appear:

 

Create a New Anchor


In order to create an anchor, enter its name in the Anchor Name text box. Once you click OK, the icon will appear on the page.

To remove an anchor, select it and press Delete.
 

Do not use spaces between words in the Anchor Name. If you need a space, put a dash such as "how-to."

 

The Link Info tab allows you to point to an anchor previously set on the page. This tab contains the following options that make selecting an anchor an easy task:

 

  • By Anchor Name This is a drop-down list containing the names of all anchors established on the page.

  • By Element Id This is a drop-down list containing the identifiers of all anchors established on the page with the ID attribute.

 

If you do not have any anchors defined on your page, a message telling you so will be displayed in the Link Info tab.

 

Here is how you can use Anchor Links

 

Step 1: Open the ProProfs Knowledge Base page editor.

 

Step 2: Select the text and click

 

Link Type> Anchor

 

Step 3: Select the link type as “Link to anchor in the text,Anchor name, and Element ID. Click OK.

 

Configure your Anchor link

 

The anchor tag in the URL would be in the format: URL$AnchorName

 

Here is what the URL with an anchor tag would look like - http://instruction.helpdocsonline.com/unique-features$editor

 

In the above example,

 

  • URL is “http://instruction.helpdocsonline.com/unique-features$editor

  • AnchorName is “editor.

 

Link Type > Add an external link using HTML 

ProProfs Knowledge Base editor also allows you to use HTML code to insert links in the text.

 

Step 1: Open the page editor and click the “view source” button.

 

Go to Source Code of your Help Page

 

Step 2: Replace the text with an anchor link and anchor text with the following HTML tag:

 

<a href=” ADD YOUR LINK HERE” target=”_blank”>ADD THE ANCHOR TEXT FOR THE LINK</a>

 

Step 3: Save the changes.

 

Add Anchor Link and Anchor Text

 


 

Link to Download a File

First, you have to upload the file to your library. After you have uploaded it, you can insert a hyperlink that will download that file. 

 

Step 1: Open the ProProfs Knowledge Base page editor.

Step 2: Select the text and click .

Link Type> Anchor

 

Step 3: Click Browser Server

 

Go to Browse Server

 

Step 4: Select the file to download.

 

Select File to Upload

 

Step 5: Click OK to save the changes. A hyperlink will appear on the selected text.

 

 

The External File URL will appear in the space

 

Advanced

The Advanced tab lets you configure additional link options, such as assigning an ID, a class, a tab index, a tooltip, or CSS-style properties. It is meant for advanced users with knowledge of HTML and CSS.

 

Go to the Advanced Tab

 

Here is a brief description of Advanced tab elements:

 

  • Id A unique identifier for the link element in the page (id attribute).

  • Language Direction The direction of the text: Left to Right (LTR) or Right to Left (RTL) (dir attribute).

  • Access key A keyboard shortcut to access the link element (access key attribute).

  • Name The name of the link element (name attribute).

  • Language CodeThe language of the link element is specified according to RFC 1766 (lang attribute).

  • Tab Index The tab order of the link element (tab index attribute).

  • Advisory TitleThe tooltip text appears when the mouse cursor hovers over the link (title attribute).

  • Advisory Content TypeThe content type of the link (type attribute).

  • Stylesheet Classes The class of the link element (class attribute). Note that a link element might be assigned to more than one class. If this is the case, separate class names with spaces. Learn more about CSS properties.

  • Linked Resource Charset The character set of the linked resource (charset attribute).

  • Relationship The relationship between the current page and the link target (rel attribute).

  • Style CSS style definitions (style attribute). Note that each value must end with a semi-colon, and individual properties should be separated with spaces. Learn more about CSS properties.

 

Removing a Link

Step 1: Open the ProProfs Knowledge Base page editor.

 

Step 2: Select the link and click the unlink button in the toolbar. Save the changes.

 

Unlink the text

 

 

Step 3: Click Preview to see the changes.

Unlinked Text Preview

 

That is all about adding links in the ProProfs Knowledge Base editor.

 

 

Related Articles

 

Was this information helpful?

The page cannot be found

The page you are looking for might have been removed, had its name changed, or is temporarily unavailable. Please make sure you spelled the page name correctly or use the search box.

add chat to your website