Back to contents

JetEngine: Dynamic Link Widget Overview

This tutorial will show you around the Dynamic Link widget provided by JetEngine plugin.

With the help of JetEngine’s Dynamic Link widget, you will be able to add links that display content from the predefined source.

Features Overview

1 Step — Add a Dynamic Link

Go to the admin dashboard, open Pages, and choose the page where you need a dynamic link. Click the “Edit with Elementor” button. In the Elements tab, find the Dynamic Link widget and drop it to the page.

dynamic link

2 Step — Define the features

Take a look at the left-side menu. The Content tab is opened by default when you start customizing the dynamic link. Let’s take a closer look at the features.

Source

This is where the link will be taken from.

Permalink

The link will be taken from the page’s URL. For example, if you add this type of dynamic link to a listing item, it will lead users to the page of the concrete item in the listing grid that they are currently clicking at.

Delete current post link

This type of link allows users to delete some of the posts they don’t like right from the front end. After clicking this button, the user will get a confirmation notification. Type in the text of that message into the Confirm deletion message text area. When the user confirms deletion, they can be redirected to some other page. Put the URL of that page to the Redirect after delete bar. Lastly, define if the post will be “moved to trash” or “deleted permanently” in the Delete post type drop-down menu.

Add to store/Remove from store

These two dynamic links allow the user to add/remove some items to/from the separate store (like Wishlist or Favorites page). You can find more details about this type of dynamic link in our Data Stores tutorial.

Options

After choosing this type of link, you will see an additional drop-down menu – Options. The link will be taken from the value of the meta field you choose in the Options drop-down list.

options of the dynamic link

Profile Page

This type allows you to choose the Profile Page and, after clicking on the link, it will lead a user to that page.

profile page

Other meta fields

If you’ve already created some meta fields, they will be automatically displayed on the list. When you choose one of them, the link will be taken from the value of that meta field.

In case you want to pull the link out of a custom post, enter the ID of this post in the Custom meta field/repeater key text area.

Label

In this bar, you can name your link. This is how it will be seen by users on the front end.

Add Query Arguments

If you turn this toggle bar on, you will get access to the addition of arguments to the link’s URL. The value that you put into the Query Arguments text area consists of two parts – the key and macros. 

query arguments

The macros you can use are listed under the Label bar. If you leave the pre-set query argument (_post_id=%current_id%), the URL will look like this:

URL Prefix

It is a short tag that is added before the URL. If you type “tel:” into the bar, for example, the URL will look like this:

url prefix

Field Icon

Besides a short text label, you can also add an icon to the dynamic link. You can either choose it from the Icon Library or upload an SVG file.

field icon

HTML Wrapper

Here you can specify the needed HTML wrapper markup for the link. You can wrap that link into DIVs, SPANs, or make it a Heading (from H1 to H6).

Open in the new window

Enable this option in order for the linked page to be opened in a new window in your browser. It is more convenient for the users than opening the link right on the page they currently are.

Add “rel” attr

“Rel” attribute defines the relationship between the page a user is on now and the one that they open with a link. If you want to learn more about “rel” attributes, check out these tables.

rel attribute

Alignment

Here you can set the alignment for the dynamic link item.

Hide if value is empty

Toggle this option if you want this field to be hidden in case it is not filled.

After finishing with the features, open the Style tab and customize the widget’s look using the available options. That’s all! You can now add and customize the dynamic links easily with the help of JetEngine functionality.