Turn Your Minimum Efforts Into Maximum Results
  • Products
      Explore package advantages
  • Support
  • Blog
  • Contact

Table Of Contents

How To Use The Remote Fraction Widget By Prime Slider

The Remote Fraction widget can be used on the Developed by Swiper carousel or slider widget to work as an additional navigation that you can customize separately and it’s completely separated from the slider/carousel widget body.

Let us show you how to configure it.

Inserting a Slider widget first

As a remote widget, we first need to have a Developed by Swiper slider/carousel widget within the page and then link it up with the remote widget.

So, go ahead and open the page you want to use it on in Elementor, and then drag and drop the Mercury Slider widget (for example) into that page. Please note that you need both Elementor and Prime Slider installed before using this widget.

After Inserting the Mercury Slider, you can go for customizations or leave it as it is and move to the next step.

Set CSS ID

Go to Advanced > CSS ID on the Mercury Slider and set a CSS ID name like EX: ‘Remote’ as seen in the image above. Please copy the CSS ID to use it later on.

Insert The Remote Fraction Widget

inserting remote fraction widget

Now, search and find the Remote Fraction widget on the widget menu in Elementor editor and then drop it on the Page where you want to work with. Although we dropped it right below the slider widget, you can place the remote in any place within the page and it will work just fine.

After inserting the widget, you would need to enter a CSS ID in the Remote Fraction Carousel CSS ID field from the options.

Now, enter the same CSS ID that you set on the Mercury slider, just copy and paste it. After Inserting the Remote Carousel ID and the remote widget will be linked with the slider and start to work.

Let’s Work With The Content Tab

Remote Fraction Section Customizations

Go to Content > Remote Fraction

You have already configured the Remote Carousel ID field for the widget. Without inserting the Carousel Id, Remote Fraction will not function. The Alignment option here works on the total count part and the Digit Pad here lets you select a 2-digit format, 3-digit format, or format as you want.

For example, we selected a 2-digit format and it’s showing the fraction like this in the image.

Work With Style Tab

Customize Of The Remote Fraction Section

Go to Style > Remote Fraction.

In this section, you can set the Alignment for the fraction within the container and adjust the Spacing between the digits and divider. Here you can also change the Current Fraction Color, Text Shadow, And Typography as your demand.

Then, you can switch to the Total subsection and also change the Total Fraction Color, Text Shadow, and Typography as your need.

Separator Customization

Go to Style > Separator

In this section, you can change the Separator Color and its Size to match your design.

All done! You have successfully customized the Remote Fraction widget on your website.

Feel free to check out the demo page.

Thanks for staying with us.

Take advantage of fine-tuned plugins

Get Customizable Elementor Widgets to Power Up Your Website

Take advantage of fine-tuned plugins to speed up web projects without sacrificing quality. We offer a 14-days money-back guarantee.
BdThemes is the sole owner of #1 market-leading addons for Elementor such as Element Pack Pro, Prime Slider, Ultimate Post Kit, Ultimate Store Kit, Pixel Gallery, and more useful plugins. This website is powered by Element Pack Pro and Rooten Theme.

Subscribe to newsletter

Get Tips & Tricks, Updates, Fresh Blogs & Offers.
Join Now

Join Thousands of Happy Users

Get Tips & Tricks, Updates, Fresh Blogs & Offers.
Need any further assistance? Call Us:+880 1700 55 95 95
Our supported payment system and security badge