Compatibility:
WebSite X5 Evo and Pro
We all played the Memory game at least once: you flip the cards to form pairs and with a little luck and memory - of course! - you beat your opponent by collecting more pairs than them. The game is pretty simple, and it can be used online for different purposes: from pure pastime, to exercise for students to make a topic more enjoyable, to game made to engage customers by incentivizing them by winning prizes or discounts.
With the Memory Game Optional Object, you can easily create your own Memory, and you can customize it in every detail. Check out some examples of what you can achieve on the Preview page, then use it on your web pages.
Create the Memory cards
The starting point to create your own Memory is setting up the cards:
- Double-click the Memory Game Object you added on the page to access the settings window.
- Stay in the Contents section and click on Add to import the images you want to use.
- You can remove
the images you already imported, decide if they should be displayed in bigger
or smaller 
format in the list and arrange them the way you prefer with the arrows. - Don't forget you can report some SEO parameters (Title and Alt Text) by clicking on the
button available for every image.
#tip - In the Memory game, you have to find pairs of the same subject, so if you want a total of 12 cards of instance, you will need to add 6 different images.
Define the Memory graphic style
Now you can customize other aspects of the game, so it better aligns with the overall style of your page:
- Access the Style section and add the Number of Columns where the Memory cards will have to be arranged, and define the Distance in pixel that will be displayed among the cards.
- Choose a Background color or image for the cards back. If you choose the image, you can define that the image automatically adjusts to the cards size (Fit Size).
- You can then complete the customization by defining any possible Rounded Corners as well as the Border color.
- Finally, you can choose the Animation on mouse click: cards can in fact rotate horizontally or vertically to display the hidden image.
Define what happens when the game is complete
As we said, you could use the Memory game as simple pastime on a simple game to be completed to get a coupon code or any other kind of reward. In any case, you will need to set up the feedback to be displayed when the user completes it by matching all the pairs:
- Stay in the Style section and use the options available in the Game completed section.
- Define the Background Color to be displayed instead of the cards. On top of that you can import a Background Image and define that the image automatically adjusts to the cards size (Fit Size).
- If you want to, you can set a link on the colored area or on the image displayed instead of the cards. Click on
and select the action from the window that opens. You can also activate the Automatically run the link option.
#tip - If your goal is to provide discount coupons, you can prepare an image that reveals the prize and set it as the background image for the completed game. Or you can use the image only to communicate the win and link a Landing Page where you have plenty of space to congratulate the customer and give them the promised prize.
Set up the last details
Your Memory game is almost complete and functioning, but you can still add some last touches with the following options:
- Access the Options section and possibly activate the Show statistics options. If you do, two kind of data will be displayed: the amount of moves made and the time taken to solve the game. You can then decide both the Color of the lettering and its Position relative to the game cards.
- Finally, you can add sound effects. All you have to do is choose the sounds you prefer for different events: Upon clicking the card, Upon two cards matching, Upon completing the game.
Now you just have to export your Memory game online. Have fun!
Are you curious to use this Object on your website pages? Install Memory Game now
You don't have enough Credits to buy this Object? Check out our Credit Packs