Instructions for Using the 2-Col-Card Widget

 

Instruction

This widget dynamically generates cards with titles, subtitles, text, links, and customizable background colors. Follow these steps to customize the widget for your content:

1. Locate the cardData Array:

   • Inside the JavaScript section, find the cardData array. Each object in the array represents a card.

2. Customize Each Card:

   • Title and Subtitle:
     • Update the title and subtitle fields with your desired text.
   • Text Content:
     • Edit the text field to include the card's main content.
   • Links:
     • Add links to the links array for each card. Each link is an object with:
       • href: The URL for the link.
       • text: The text displayed for the link.
       • color (optional): The color of the link text. Leave this field empty for the default color.
   • Background Color:
     • Use the bgColor field to set a custom background color for the card. For example, use #ffffff for white or #f8f9fa for light gray.

3. Add or Remove Cards:

   • To add more cards, append additional objects to the cardData array.
   • To remove a card, delete its corresponding object from the array.

4. Preview and Save:

   • After making changes, refresh the webpage to see the updated cards. Save your changes when you're satisfied.