Wanting to create the perfect post slider for your blogging website? The Mercury slider answers your call with a fresh new outlook to showcase your blog posts with a minimalistic combination of text and image side-by-side and lots of smooth transitions to keep your visitors engaged.
Let’s explore the Mercury Slider customizations.
Inserting The Mercury Slider widget
You can add the Mercury Slider addon to WordPress by opening the page you want to use it on in Elementor and then dragging and dropping the Mercury slider widget into that page. Please note that you need both Elementor and Prime Slider installed before you can use this widget.
Work With The Content Tab
Layout Section Customizations
Go to Content > Layout.
From the first section, you can set the Image Height to adjust the net height of all slides and also can set the Content Max Width for showing your post content in a fixed range on the Mercury slider.
The Alignment option works on the text content so you can easily select the best text position on the Mercury Slider. If you turn On the Content Reverse switcher, the image and content will switch positions in the slider.
Query Section Customizations
Go to Content > Query.
This section works for setting the source location of data that you need to display by references like Author, Categories, Tags, and Formats. The references can be different in accordance with the source location.
Step-1
First, you can select the Source for the Mercury slider to show from the range of source items. Note that the source items shown in the screenshot are not everything and will depend on your WordPress environment.
Step-2
Then comes the Limit option that lets you set the number of posts in the query.
The Include / Exclude filters let you show or hide posts based on Terms (tags, categories, post names, etc.) & Authors.
While the Include field shows only the selected items and hides every other.
Step-3
The Exclude option does the opposite as it hides the selected ones and shows the rest.
Step-4
Date, Order By, and Order controls are here to arrange the data you want to display through Random, Title, Date, or Menu order wise and also with ascending or descending order.
The two switchers (Ignore Sticky Posts, Only Featured Image Posts) let you avoid sticky posts and posts without feature images from the display. Here, you can also set the Query ID that gives your Query a custom unique id to allow server-side filtering for the Mercury Slider.
Work With Additional Section
Go to Content > Additional
Step-1
In this section, you will get some switchers such as Show Title, Show Text, Show Category, Show Author, Separator, and Date. Turning on these switchers will make the corresponding element appear on your slider on the screen. The opposite will make them disappear.
If you enable the ‘Strip Shortcode’ option, then shortcode content will be removed from your slider content.
Step-2
Down below, you will find the Human Different Time, Time Short Format. You can easily turn On/Off the Switchers to tweak the post-publishing date showing inside the slider.
Customizations of Slider Settings
Go to Content > Slider Settings.
In this section, you will be able to see another bunch of Switchers and fields such as Effect, Auto Play, Auto Play speed, Pause On Hover, Grab Cursor, Loop, Animation Speed, and Observer.
What they do-
Effect: Let you select Fade or Slide animation effect when scrolling to the next/previous slides.
Autoplay switcher: If you Enable the Autoplay switcher button, your slider will slide into Autoplay mode, and you can set the Autoplay Speed as your wish.
Pause on Hover: If you activate the pause on Hover button, when visitors Hover the mouse cursor on the slider, then your slider will Hold, otherwise your slider slide Autoplay.
Grab The Cursor: Your mouse pointer icon will be changed into a grab cursor. Visitors can slide your slider manually with your mouse cursor.
Loop: When you activate the Loop switcher button, your slider will loop at a certain time interval. You also set up the loop animation speed here.
Observer: If you enable the option then you are able to use the slider/carousel in any hidden places (such as in tabs, Accordion, etc).
Work With The Style Tab
Items Sections Customization
Go to Style > Items
From the first section, you can select a Background Type (Classic, and Gradient) for the Mercury slider and then customize the Background Color for your slides. You can see the background color changing on the screen.
Also, set Content Padding to limit the text content to a fixed range.
Style The Title Section
Go to Style > Title
Step-1
This section offers Title color, Title Hover color, Typography, Spacing, and Text Shadow customizations. You can start with the Title Color and Hover Color first and then adjust the Spacing between the title and everything below it.
Step-2
The Typography option expands into Font Family, Size, Weight, Transform, Style, decoration, Line Height, Letter Spacing, and Word Spacing. Everything here helps you stylize the title font.
Step-3
The Text Shadow (Color, Blur, Horizontal, Vertical) options let you add 3D-like text effects behind the actual title text.
Customization The Text Section
Go to Style > Text
In this section, you can edit the Text Color and adjust the Margin for your text content. Here you also can set the Max Width to spread the text on the slide in a fixed range and customize the Typography to stylize the font.
Style The Meta Section
Go to Style > Meta
Here, you can customize the Meta Color, Hover Color, Spacing, and Typography.
Category Section Customizations
Go to Style > Category
Step-1
Here, the first scrollbar option lets you adjust the Spacing between the category and the rest of the content. Below, you will see two subsections (Normal and Hover).
In Normal mode, you can set the Category text color, Background color/image.
Step-2
In Hover mode, you will get a similar set of controls with the additional Border Color option to set up the hover effect.
Step-3
After that, you can set the Border Type, Width, Border Color, Padding, Border Radius, Space Between, Box Shadow, and Typography for the category.
Customize Of The Navigation Section
Go to Style > Navigation
Step-1
The navigation section starts with two modes; Normal and Hover.
You can change the Navigation color and Background Type in Normal Mode.
Step-2
Here in Hover mode, you will get a similar set of controls to modify the appearance of the Mercury slider just like how it’s in the normal mode.
Step-3
After that, you can set the Border Type, Width, Border Color, Border Radius, Size, Horizontal Offset, Box Shadow, and Icon Typography for the navigation arrows.
All done! You have successfully customized the Mercury Slider widget on your website.
Video Assist
You can watch this quick video to learn more about the Mercury Slider widget.
Thanks for staying with us.
