A logo works as an identifier of anything. It also bears brand value. Here, let me show the brand logo in the carousel mode using our Elementor Logo Carousel widget developed by Element Pack.
Moreover, I’ll guide you in different phases of how you can insert & use the widget to design layout for the content (text, image, and video, etc.) you want to work with and style as well. Let’s start.
Content Tab
Using the content tab, you’ll be able to make a layout of a particular part of a website. And in this regard, some handy sections in the tab will assist you a lot in designing the image carousel.
layout
This section will allow you to set Columns number, Gap, Item Height, and Image Size(Thumbnails, large, medium, etc.)
Go to Content Tab > Layout
Logo Carousel Item
After dragging and dropping the widget in a new section, you will get a list group for the Elementor Logo Carousel. The list is not limited, you can add a new list in the group by just clicking on the ADD ITEM button.
You can edit every single list item(repeater). Simply, hit on the List Item and edit the field found in the List Item, and set Logo Image, Brand Name, Website Url, and especially Tooltip (yes/no) included in the list item.
Just go to the Content Tab > Logo Carousel Item
If you need to get the same designed content with the Elementor Logo Carousel, you’ll be able to duplicate clicking on the duplicate icon and delete clicking on the delete icon.
Tooltip Settings
Here, in this section, you’ll be able to set Animation (Shift-Away, Shift-Toward, Fade, etc.), Offset position, Distance, Arrow, and Trigger on click.
Come to the Content Tab > Tooltip Settings.
Carousel Settings
The Carousel Settings section will allow you to determine some controls such as Auto Play, Autoplay Interval, Pause on Hover, Loop, Center Slide. To do so. Go to the Content Tab > Carousel Settings to get these settings for the logo slider.
Navigation
If you want to place an arrow with the logo carousel. The section will give you hand. So, go to the Content Tab > Navigation
Style Tab
It is time to work with Style Tab. The tab will confidently have you style the web content (text, image, video, etc.) of the page you want to design.
Styling with the Style tab in Elementor will always give you a fantastic experience.
Let’s have a look.
Logo Carousel:
This holds two modes – Normal and Hover.
Under the Normal mode, you can place Background Color, Border Type and Radius, Padding, Opacity, and CSS Filters.
Just go to Style Tab > Logo Carousel > Normal
In the matter of Hover mode, you can set hover Background Color, Opacity, CSS Filters, Transition Duration, Hover Animation(pulse, shrink, pop, push, etc.)
Simply, go to Style Tab > Logo Carousel > Hover. Look due to CSS Filters’ effect youTube icon color has been changed.
Tooltip
To give style to the Tooltip, you just go to Style Tab > Tooltip and check all the controls.
Navigation
This section will allow you to style the navigation icon and to do so. Go to the Style Tab > Navigation and check all the controls found in the red rectangular mark.
I hope you’ll find this article very useful and to get more ideas about the use of the logo carousel/ how to use the logo carousel, you can visit our demo page.
Video Tutorial
Watch this quick video to get more visual on the Logo Carousel widget by Element Pack.
