Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

...

  • What to do with your Wordpress Site Crashes:  Lots of times this is due to a theme or plugin not be up-to-date or one of these are incompatible with each other.  The best thing to do if you can't log into the admin dashboard is FTP into the server on your host and navigate to your plugins folder where all plugins are installed.  Renaming this folder to something else (e.g. plugins-backup) will inactivate the plugins that are likely causing the site to crash.  You then should be able to log in the admin dashboard and update plugins and themes.  After this start with activating one plugin at a time (starting with most critical).  As you activate each plugin refresh and monitor the site.  If the website crashes again you may assume the latest activated plugin is the culprit.  At this point read documention or forums to find out if the theme or plugins are old and haven't been supported.  Also see if there are known incompatibilities.  You can either avoid that theme or plugin or ensure you have a compatible version.  Always feel free to call your hosting company to ask for their thoughts.
  • When you can't find an existing plugin that will accomplish what you want, you can always make a custom plugin. Plugins are written in PHP. You can create a template plugin from this site to act as a boilerplate starting point: http://wppb.me/
  • Uploading a new plugin to Mac - (may not apply to every wordpress, but read this guide for details) - UploadingNewPlugin(Mac).docx
  • Tip on editing themes - When editing the WordPress theme, best practices say to use a child’s theme. A child’s theme is a copy of the regular theme which helps protect the integrity of the parent theme. Changes are made to the child’s theme instead of the parent theme so that changes can be easily reverted if needed. More information can be found here.

...

Ning is a community building platform and advertises itself as great for creating social networks, however, it is fairly difficult to customize as there is no option to customize HTML and is lacking updated documentation.  

WordPress Shortcode API

WordPress Shortcode guide

Overview

The Shortcode API is a set of functions for creating shortcuts in WordPress to use in pages or posts. This API enables users to create special kinds of content (forms, quizzes, etc.). Shortcode’s API handles the technicalities behind parsing, getting rid of the need to use custom HTML or CSS. A major advantage about Shortcode is that you don’t need access to WordPress’s plugins library to use it. Since our team worked in an account tier that did not offer access to plugins, Shortcode was a very useful alternative to adding interactive features to our client’s site.

 

The following shortcode content tags are included with WordPress and can be readily used by default:

  • [audio] - adds a feature to your page where you can embed and play back audio files
  • [caption] - allows you to wrap captions around content
  • [embed] - allows you to wrap embedded items within a maximum (but not fixed) width and height
  • [gallery] - allows you to add one or more image galleries to your posts and pages
  • [playlist] - allows you to show a collection of WordPress audio or video files in a post
  • [video] - allows you to embed video files and play them back on your page
  • [quiz] - allows you to have an interactive quiz on your page; At their most basic, you can pose a question and have multiple answers to choose from. The correct answer will turn green when it’s clicked on, and the incorrect answers will turn red when they’re clicked on.
  • [forms] - You can use widgets and shortcodes to display contact form in your theme. Unlimited number of dynamic fields can be created for contact forms.

Formal Syntax

Shortcodes use square braces (‘[…]’) and keywords to embed certain features on a page/post. Take the gallery shortcode for example:


[gallery]


The gallery shortcode is parsed by the API as a special symbol because it is a registered shortcode. On the other hand, square braces are simply ignored when a shortcode is not registered:

 

[randomcontent]


The randomcontent text and its square braces are ignored because they are not part of any registered shortcode. You must use a keyword from WordPress’s Shortcode library (listed in “Overview” above) for it to work.


Tags must be enclosed with brackets: [ Example_Tag ] to be recognized as Shortcode.


Nesting Shortcode:



[tag-a]

CONTENT

      [tag-b]

      CONTENT

      [/tag-b]

[/tab-a]


Output

A list of tags can be found on the WordPress documentation and will result in different content. Shortcodes are parsed after “wpautop” and “wptexturize” post formatting has been applied. This means that your shortcode output HTML will not automatically have curly quotes applied.


How to make a quiz in Shortcode

For our project, we used Shortcode to create an interactive quiz feature on the client’s website.

Here are the steps to do so:

  1. Go to www.wordpress.com
  2. Log in as an administrator and go to the page you want to edit.
  3. Once in the correct page and in edit mode, click to add a “block” and search for the “shortcode” block. Adding this block will create the production environment to type out code.

 Image Added

4. Begin writing the code you would like to implement in the Shortcode environment you just created. Remember, WordPress shortcode uses braces (‘[...]’) and tags specific to the API.

5. To create a quiz, start with the opening [quiz] tag and end the block with the closing [/quiz] tag:

[quiz]

            quiz content goes here

[/quiz]

 6. After the opening quiz tag add a [question] tag and write the text you want your question to contain. Once you’ve written your question, close with the closing [/question] tag.

[quiz]

              [question]

                your question goes here

               [/question]

[/quiz]

 7. To create an incorrect answer choice, write the opening [wrong] tag followed by the answer choice text and the [/wrong] closing tag.

[quiz]

                [question]

                your question goes here

               [/question]

               [wrong]the wrong answer choice goes here

                 [/wrong]

[/quiz]


Note, for all answer choices in shortcode, you need to put your text directly after their opening tag with no spaces in between the text and opening tag. This ensures that the answer choice will be appear in the order you write your shortcode. If you add any spaces between the tag and the text, the quiz will not keep that answer choice in the same order you wrote it. WordPress Shortcode arranges the answer choices to place the correct answer as the first choice by default. This isn’t a good idea from a UX perspective.

 

8. When writing the correct answer to a question, use the tags [answer] and [/answer]. Note, the same spacing principles apply to the correct answer choice, so add the text directly after the opening [answer] tag with no space in between.

 

[quiz]

               [question]

                your question goes here

               [/question]

                 

               [wrong]the wrong answer choice goes here

               [/wrong]


               [answer]the correct answer choice goes here

                [/answer]

[/quiz]

9. Along with an answer choice you may want to add an explanation. This is text that will appear in response to the user clicking that answer choice (Ex. “Correct!” to let users know they chose the right choice). To add an explanation, open with the [explanation] tag and close with the [/explanation] tag. Place the explanation in between the answer choice text and the answer choice closing tag.

[quiz]

               [question]

                your question goes here

               [/question]

                 

               [wrong] the wrong answer choice goes here

                 [explanation]

                  add an explanation or error message here

                  [/explanation]

                  [/wrong]


                  [answer]the correct answer choice goes here


                   [explanation]

                  add an explanation or congratulations here

                  [/explanation]


                  [/answer]


[/quiz]

 

*Remember to close your quiz with the [/quiz] closing tag!

Sample Code

We created an example quiz you can use as a starting point for your shortcode. Check out the sample code below:

 

[quiz]

                [question]

                Why did the chicken cross the road?

               [/question]

                 

                  [wrong]Because her 374 client asked her to


                  [explanation]

                  Try again!

                  [/explanation]


                  [/wrong]


                  [wrong]To get to the other side

                  [explanation]

                  Try again!

                  [/explanation]


                  [/wrong]


                  [answer]To be at a safe social distance from her fellow hens


                  [explanation]

                  Correct!

                  [/explanation]


                  [/answer]

[/quiz]


Here is an image of the final product in a published WordPress page before the user selects any of the answer choices:

Image Added


Here is an image of what appears after the user clicks each answer choice:

Image Added


Try it out for yourself! Use the steps in this document or copy and paste our sample code into your WordPress page to create a quiz of your own.