Introduction #
Vlink is Verbolia internal linking engine, a powerful cloud-based solution to improve internal links between the pages of your website by injecting a linking block in existing pages.
Vlink takes an url in input and will identify the links and anchors to return based on destination urls and rules that have been defined in the Verbolia platform.
More info here.
How does Vlink work? #
Vlink requires:
- the installation of a Javascript snippet in the product pages OR setting up API calls from your server
- the setup in Vlink backoffice to provide destination url’s and create rules
Here is how the script works
- Initialization: the script will query our API which will first verify the quota usage
- The API will process destination url’s and Vlink rules and return a list of optimized links
Configure Vlink in Verbolia Backoffice application #
In the left menu of Vlink, we have 3 submenus:
1. Settings #
Configuration #
Maximum number of pages: maximum number of pages you can use in submenu ‘Destination URLs’. (can be increased depending on your subscription package. Contact us if you want to add more destination url’s )
Max calls per day: Maximum calls per day. (can be increased depending on your subscription package. Contact us if you want to increase the max calls per day)
Api key generation: Api key used for your account (for client side integrations, the api is already set in the javascript you will add to your page. In this case, it is just displayed for information purposes.)
Number of links to display: Choose the amount of links that will be displayed in the Linking bock.
Linking block design (relevant for client side integration only) #
Here you can define class names stored in your css and you can set class names you will define in the block below CSS.
Section title will be the title of your linking block and Links text will be the text under the title.
On the right side, you will see which Html tags will use the class names.
CSS : if you don’t use the classes defined in your css , you can create all the css you need to display the links.
Preview : you will see how links are rendered. However, if you are using css from your page, you will not see the correct design here.
Linking block position #
Here you can define where your linking block will be injected on your page.
First dropdown gives the possibility to add the links block after, before or inside the tag selected on your page.
Choose HTML elements of your « Host pages » to specify where the link block will be inserted.
Example of HTML elements notation
HTML tag: <h1>xxx</h1> = h1
HTML class: <span class= “h1“>XXX</span> = .h1
HTML id: <span id=“h1“XXX</span> = #h1
You can add multiple HTML elements in order of priority.
Host Page Custom parameter #
By default, our api will send you the H1, meta title and the url of your page. If you want to send other information from your page, you can create a new parameter like for example
Color => document.querySelector(‘input[name=color]’)!=null?document.querySelector(‘input[name=HtmlBlockClass]’).value:null
The new parameter color will be available in the submenu Rules.
2. Destination URLs #
On this page, you can manage the links that will be inserted in the linking block that will be added to the pages of your website.
- Import
- Export
- Add tag
- Remove tag
- Remove link
A link page or destination url must contain 4 fields:
- Destination URL : url of the page
- Anchor : the anchor of your link
- Tag : will be used by the rules
- Priority : to give a boost for some pages
3. Rules #
On this page, you will see all the rules you have created.
You are able to:
- Delete a rule
- Create a new rule
- Edit a rule
- Duplicate a rule
- Activate a rule
- Order the rule
Test linking rules : You will be able to see the linking results for a specific h1, url and metatitle.
Test linking script : The popup will give you a script to test a specific page. You just need to paste the script in the console of your browser. If a rule matches with the info of your page, you will see the linking block appear on the page.
Create a new rule screen #
We have 3 sections :
- Rule name : give a name to the rule.
- Trigger conditions: define the conditions that trigger which host pages links will be added. You can specify rules based on the host page’s H1, URL, meta title or custom parameter to control on which pages the links will be displayed.
- Links selection:
- Rules : define rules to select which links should be displayed based on host pages elements.
- Manual links : define manually which links and corresponding anchors should be displayed.
Integrate Vlink script into your pages #
There are 2 ways to add the Vlink widget to your pages.
- server side integration
- client side integration
1. How to use the api server side #
Endpoint #
- Api URL : https://linkingengine.prod.backend.verbolia.com/linkingengine/getlinkings
- Method : GET
Parameters #
Headers #
- Content-Type: application/json
- x-api-key: ***************************************
- Origin: https://yourhostname.tld
URL query parameters #
https://linkingengine.prod.backend.verbolia.com/linkingengine/getlinkings/[WebsiteName]/[WebsiteCulture]?metatitle=[metaTitle of the host page]&url=[DOMAIN URL]&h1=[H1 of the host page]
You may find the url query parameters in:
- Configuration > Settings : (DOMAIN URL)
- Dropdown of the main menu: (WebsiteName and WebsiteCulture)
IMPORTANT: all values in the querystring must be encoded using encodeURIComponent (javascript function). You can use this tool to manually encode links for testing purposes.
2. How to integrate client side #
On the Vlink settings page, you will see an integration guide button on the top right. When clicking, a popup will appear that provides the javascript you need to inject in your pages where you want to see the links.