Info Cards

https://www.muse-themes.com/products/info-cards

Our Info Cards widget is a great tool for displaying important information within stylish, custom cards. These cards allow for a variety of visual options such as ribbons, featured cards, icons, and linked buttons. Great for pricing tables, options, configurations and more.

  • Widget Compatibility: Highly Compatible (No known issues when combining with other MuseThemes widgets)
  • Current Version: 1.0
  • Supported Devices: Desktop, Tablet, Phone

Release Log

  • 1.0: Initial release




Setup in Muse

  • Place the widget where you would like the info cards to appear on your site.
  • Sizing of the widget container on the Muse canvas is important. The widget container size must account for the total height of the cards as well as the shadow effect when the page is previewed or published. It's a good idea to preview the page often to check that the cards or shadow are being clipped due to the widget container being too small.
  • Keep in mind that the widget has a separate mobile display mode. The mobile mode displays the cards in a vertical to improve compatibility with mobile device screens. This mode requires extensively more height applied to the widget container to avoid clipping. The info cards switch to mobile mode at 620px width. It may be best to create a breakpoint at 620px since the widget container will need to be sized differently above and below 620px width.

WIDGET OPTIONS

  • Open the widget option panel.
  • Number of Cards: This dropdown option determines the number of cards that will be displayed.
  • Card 1/2/3/4/5 Content: All of these sections contain the same options. The number of sections available for editing is determined by the Number of Cards set above. The options within the Card 1/2/3/4/5 Content sections are as follows...
  • Card Style (Standard or Featured): Standard and Featured cards have different sets of styling options, which allow the featured card(s) to have more prominent styling attributes.
  • Enable Ribbon / Icon / Plan Name / Price / Period / Description / Items 1-6 / Button: Every content section of the info cards can be enabled individually. Each section has its own customization options. These options are labeled with their exact purpose and will not be described here as they are self-explanatory.

STANDARD AND FEATURED CARD STYLING SECTIONS
These two sections contain an identical set of styling options. Generally, you will use the Card Size Scale option to distinguish the featured card from the standard cards. An example of this would be to use a Card Size Scale setting of 1 for standard cards and 1.15 for featured cards.

Styling options in these sections are extensive. Generally, each content section (Ribbon, Plan, Price, etc) have their own unique customization options. Since these settings are labeled with their exact function, they are self-explanatory and will not be discussed individually here.

Note: When using a font in the Font Family field, ensure you are using the correct CSS style name, and ensure that you are using the font elsewhere on the page. This way, the widget can load the font properly.



Commonly Asked Questions

No commonly asked questions


Known Issues/Conflicts

No known issues or conflicts


Additional Info Links