Quickfinders

Quickfinder is a useful content element which can help to highlight some special advantages/properties of the products or services. Also it can help website visitor to navigate through the website. Quickfinder looks and works like a grid of text boxes, consisting of icon/image, title, description and button (optional). The cool thing is that in case you need to add multiple text boxes and don’t want to waste time on setting up each text box individually, you can add one quickfinder with multiple items and control its style within one place.

In the Elementor version of TheGem theme there is no special custom posttype for quickfinders, like in WPBakery theme version, as with Elementor it is no more needed. Now you can manage your quickfinders, its content, style and appearance all in one place, getting immediate visual results.

Check this demo pages showing different quickfinder styles:

https://codex-themes.com/thegem-elementor/pages/services-quickfinders/quickfinders-01/
https://codex-themes.com/thegem-elementor/pages/services-quickfinders/quickfinders-02/

Note: all this styles can be easily customized to meet your individual design needs. No coding needed.

You can find “Quickfinder” element in editing panel of Elementor in “TheGem Elements” group

Content Tab

Quickfinder Items

This section contains a repeater, where you can add any number of quickfinder items you need. Each quickfinder item contains general and additional content options

Under “General” you can:

  • specify item’s title. For titles you have multiple H-heading presets with two weight variants (bold and thin), as well as an option to disable H-Tag in source code, which can be useful for SEO.
  • use TinyMCE editor to type in item’s description
  • specify item’s link

Under “ Additional” you can:

  • select icon or image to use in quickfinder item. You can also disable icon/image in case you don’t need it in your item
  • enable/disable button with corresponding button content settings

Layout

Skin: we have added 12 design presets for quickfinders, divided in “Grid” and “Vertical” groups

Columns: in case you have selected any of grid present, here you can specify number of columns for this grid (including responsive settings for different devices)

No Gaps: this setting allows you to automatically disable any gaps between quickfinder items in grid. It is useful in case you use some boxed style presets and wish to “connect” boxes with each other, avoiding double border

Style Tab

Container Style

In this section you can style the main container of the quickfinder item.
For grid style presets, using “Horizontal Gaps” and “Vertical Gaps” you can control the spacings between quickfinder items in your grid.
For vertical style presets, using “Content Position” you can control the position of title and description relative to icon/image.

Title & Description Style

Specify styles for quickfinder item’s title and description

Icon Style

Here you can specify different style settings for your icon. You can choose between presets for shape, size and color split of the icon. Also you can specify vertical and horizontal position of icon inside quickfinder item. For “left” and “right” horizontal positions, you can additionally choose text wrapping options:

  • No wrapping
  • Inline without wrapping (text will not wrap the icon)
  • Wrap text (text will wrap the icon)

Image Style

In case you have selected to use image instead of icon in “Layout” tab -> Quickfinder Items section, here you can specify styles for image.

Button Style

In case you have enabled a button for your quickfinder item, in this section you can specify style of the button. You can select button position, choose between TheGem button size and style presets and customize with additional styling options.

Connector Style

This section appears in case you have selected any of vertical quickfinder presets. This is a set of settings to control the connector between quickfinder items.