Documentation

The below steps will outline how to add flashcards manually to your WordPress site:

1. In the Flash Cards menu, click on "Add New"
2. You will see a page to "Add New Flashcard Set" along with areas to add a title and the flashcard front and back
3. Give your flashcard set a title/name and click "Publish"
4. Simply enter the flashcard front (or term) in the field that says "Front" and enter the flash card back (or definition) in the field that says "Back." You can insert text, images, video, or audio.
5. Add more cards to the set by clicking the "+" icon
6. Remove cards from the set by clicking the "-" icon
7. Click the "Save" icon on each card to add it to the set
8. Click the "Publish" button to create the flash card set
9. Click the "Flash Cards" menu item to see your created flash card sets
10. You can edit your sets here as well as find the set shortcode for embedding the set in any post or page on your site

The below steps will outline how to utilize the shortcode to embed your flash cards on your site:

1. Navigate to your flashcard set(s) by clicking the "Flash Cards" sub-menu item
2. Find the set you would like to embed on your WordPress page or post
3.  On the right, you will see the shortcode that looks something like this:

   [ flashcard_set id='514' ]

4. Simply copy the shortcode (including the brackets) and paste it into your WordPress page or post of your choice
5. The flashcard set will be displayed on the frontend after publishing the page or post

The below steps will outline how to use the controls on the flashcards:

1. To flip a card, simply click or tap the card
2. To advance a card, simply click the forward arrow or swipe left
3. To go back to the previous card, simply click the back arrow or swipe right
4. To shuffle the cards in the deck to randomize, simply click the "crossed arrows" icon
5. To un-shuffle and return to the regular card order, click the "crossed arrows" button again
6. To switch the card terms and definitions to show the definitions first, simply click the "parallel arrows" button
7. To return to the terms on the front and definitions on the back, simply click the "parallel arrows" button again
8. To "save" a card for study later, simply "star" the card in the upper right corner
9. To study only the "starred" cards, simply navigate to the end of the deck/set and click the "Study X starred terms" button. This will automatically populate the deck/set with only your "starred" cards
10. To remove a "starred" card, simply click the "star" in the upper right hand corner to un-highlight it

The below steps will outline how to change the sizes of the flash cards:

1. Navigate to the "Flash Card Settings" sub-menu item
2. Here you will find a page that shows fields for "Card Width" and "Card Height" in pixels
3. Simply enter whatever numbers you prefer for the sizing of your cards. Typically, sizes that look good are around 500-600 pixels. You don't need to worry about mobile appearance as WP FLASHCARD is built to be mobile friendly and is responsive to different screen sizes.
4. Click the "Save Changes" button to see the new size on your site

You can add video to flashcards from YouTube, Vimeo, Wistia, or your own media library.

The easiest way to upload video to a card is to use your own media library. To do this simply use the "upload" icon (found in the flashcard creation backend area when adding cards) and select your video from your media library (or upload it to add it to your media library). It will automatically be inserted into the card when you choose to insert it. Then save the card. Add any other cards and update the set and you are good to go.

However, using video from your own media library is not the best method because the videos will need to load directly from your server every time a user wants to view it, which uses up bandwidth. Therefore, a great method is to have your videos hosted elsewhere on a video service platform like YouTube, Vimeo, or Wistia. See below to understand how to use video from these platforms...

To add a video from YouTube:

1. Click the "Share" button on any video you wish
2. Click the "Embed" button
3. Copy the video URL, which looks like:

https://www.youtube.com/embed/BHACKCDNBMD8

4. Insert the copied URL into your flashcard
5. Save the flashcard
6. Save the flashcard set after you have finished adding cards

To add a video from Vimeo:

1. Click on the "paper airplane" icon to share for any Vimeo video
2. Copy the source url (src) which looks like this:

https://player.vimeo.com/video/32397239487?

3. Paste the URL into your flashcard
4. Save the flashcard
5. Save the flashcard set after you are finished adding cards

To add a video from Wistia:

1. Copy the video URL, which looks like this:

https://fast.wistia.net/embed/iframe/{video id goes here}

2. Paste the video URL into your flashcard
3. Save the flashcard
4. Save the flashcard set after you have finished adding flashcards

When you insert the shortcode for the flashcard set into a page or post, you will see the videos appear on your cards on the frontend of your site.

The below steps will outline how to upload flashcard sets via a CSV file:

1. Download the CSV file template here
2. Enter the terms with their definitions in the appropriate areas in the template. You can also enter the URL to any images, sounds, or videos you want to use if necessary. If using video, please see the tab in this documentation on "Adding Video To Cards."
3. Save your new spreadsheet as a .CSV file in UTF-8 format. BE SURE TO CHECK YOUR SPREADSHEET FOR UNRECOGNIZED CHARACTERS. If your spreadsheet contains unrecognized characters (they will appear as a "question mark" (?), the upload will fail and present you with "Importing not finished..." and you will need to look at our Troubleshooting tab to fix it.
4. In the Flash Cards menu, click the "Flash Card Import" sub-menu item
5. Name your flash card set
6. Click the "Choose File" button to upload your spreadsheet that contains all your terms, definitions, sounds or images.
7. Click the "Import Flashcards" button to import your terms and definitions and create your new flash card set
8. Navigate back to the "Flash Cards" menu item to see your newly created flash card set

The flashcards allow for "rich text" input when creating them from the backend. This will allow you to change the font styles, weight, etc. for any individual cards rather than the default WP Flashcard setting controls on the backend. You can still set your general defaults in the settings page and then add your HTML "rich text" markup for individual cards as needed.

When adding a card "front" or "back" you can add the rich-text HTML markup directly into the text box.

When the cards are shown on the frontend, it will display whatever HTML rich-text markup you have added for that card or cards.

You can also include your HTML rich-text markup in your CSV spreadsheet in the appropriate fields such as "Front" or "Back." After it is imported and the shortcode is placed on a page or post, the rich text that was included will show on the frontend as desired.

If you are trying to add two media types on the same side of a card (ie. an image with audio on the same side), you can use some Rich Text HTML coding which would look something like this:

<img src="img.png" style="display: inline-flex;width:150px;height:150px;"><p>TEXT</p>

<audio controls controlslist="nodownload noplaybackrate"><source src="httpsaudio.mp3"></audio>

Simply insert a code like this on either the "Front" or "Back" card input areas.

If you want to translate the plugin from English (the default language) to any other language, you can easily do so. Our plugin is made to be translatable out of the box.

Simply install any translation plugin to your WordPress site and follow their process to translate the .po file. This will change the encoded English to your language.

We recommend using either WPML or Loco plugins for this purpose.

If you are having issues with the plugin, please see the solutions to common issues below:

1. CARD DISPLAY LOOKS STRANGE

If you are using a caching plugin, be sure to turn it off and try again in a private browser window. Most issues are caused by third-party caching plugins. Be sure to turn off all minification and combining settings, especially in regards to Javascript and CSS.

2. CARDS NOT DISPLAYING AT ALL

Turn off any caching plugins and try again in a private browser window. Try inserting your flashcard shortcode into a blank WordPress page without using a page-builder. Turn off all minification and combining settings, especially in regards to Javascript and CSS.

3. ISSUES WITH THE CSV IMPORT

Be sure that you have saved your CSV file as CSV UTF-8 format. Windows and Mac have different versions of CSV format so it is essential to save it as the universally accepted UTF-8 version. After you have saved it in the correct format, be sure to check your spreadsheet to ensure there are no unrecognized characters present. They will likely be displayed as a "?" (question mark). You will need to fix these characters before uploading your spreadsheet.

Additionally, if you see this message:

"The DISABLE_WP_CRON constant is set to true. WP-Cron spawning is disabled."

It means that your installation is not using WP-Cron. WP-Cron is required for the CSV upload to function. Normally, WP-Cron is turned on by default as it is part of the WordPress core and is a required function for many parts of WordPress. If you or your host/server has disabled WP-Cron, be sure to turn it on and try the CSV import again.

Once the WP-Cron is active, you should be able to upload the CSV file without issue.

4. HOW TO FIX "IMPORTING NOT FINISHED..."

If you are receiving the "Importing Not Finished..." message, this is caused by incorrect characters in your spreadsheet. You will need to fix your spreadsheet as described above and try again. However, you will need to completely un-install WP FLASHCARD and clear your caches. Then re-install WP FLASHCARD again and activate it. Once your spreadsheet is fixed, try again with your import.

5. HOW TO FIX MOST ISSUES

• That you are running the most up to date version of WordPress
• All themes and plugins are up to date
• Clear any caches (if running a caching plugin/service)
• Clear browser cache
• Try a different internet browser
• Deactivate any caching plugins/services and check the plugin functionality