Gift Card widget in Restaurant Addon plugin is to give amount as a gift card. You can use this layout of the widget based on your needs. From the below steps, you will see how to work with the Gift Card Widget.
For Gift Card widget need to create a gift form using Contact Form 7 plugin. After creating a gift form you can select a form in the Gift Card shortcode.
Step O1 :
In the unique Restaurant Addon Widget you can see Gift Card Widgets in the Elementor Sidebar Widget. Simply drag and drop it to the highlighted area.
Step O2 :
After adding Gift Card widget in that content area you can simply fill the fields in the Content Tab.
The content tab consists of the content area for the shortcode.
- Section Title : You’ve options like Section Title, Section Subtitle, Title Image .
- Form Options : in this section Select Contact Form, Default Amount, Default Name, Default Message options are available.
- Gift Card Options : fileds based on the gift cards are available here like Card Background Image, Card Name, Recipient Title, Icon Type, Select Icon, Button Title, Button Link .
Step O3 :
In this step you’ll see what are the options available in Style Tab.
The style tab consists of options for changing the style of the shortcode.
- Section : Here you can control the Margin, Padding, Background Color, Border Radius, Border Type, Box Shadow of the Gift Card section.
- Form : All the form based style options are available here like Label Typography, Label Text Color, Typography,
Border Type, Placeholder Text Color, Text Color. - Title : Here you can control the Padding, Typography, Color, Title Shadow of the title.
- Sub Title : Here you can control the Padding, Typography, Color, Title Shadow, Title Left, Title Top of the sub title.
- Gift Card : Style options for gift cards like Info Padding, Message Padding, Background Type, Border Type, Border Radius, Message Border Color.
- In Amount section Amount Padding, Typography, Color options are available.
- Icon section options like Icon Padding, Icon Size, Color are available here.
- Card Titles : Here you can control the Padding, Typography, Color, of the card title
- Card Name : Here you can control the Padding, Typography, Color, of the card name.
- Message : Options like Padding, Typography, Color, are available for message section.
- Button : In this button option you have options for changing Button Width, Margin, Border Radius, Padding, Typography, Color, Background Color, Button Shadow, Border, Hover Color, Hover Background Color, Hover Border, Hover Button Shadow of the button.
Step O4 :
In this step, you’ll see what are the options available in the Gift Card widget Advanced Tab.
The Advanced Tab consists of options for adding the advanced options for the shortcode.
- Advanced : It consist options like Margin, Padding, Z-index, CSS ID, CSS Classes for that whole section.
- Motion Effects : it having the animation options for about me section.
- Background : This option having Background Type and Hover Background Type option with Hover Transition Duration in it.
- Border : In this option you’ve options for Border, Box Shadow, Hover Border , Hover Box Shadow with Transition Duration
- Positioning : Her you control the Width of the section and change the Position of the section
- Responsive : IN this option you can hide that section in Desktop, Tablet, Mobile based on your need.
- Attributes : It will help you to add custom Html Attributes but it will available once you installed the Elementor Pro version.
- Custom CSS : You can add your Custom CSS in this field. It will also available once you installed the Elementor Pro version.
You can see types of styles in Gift Card widget Here