Home

DYNAMIC
[View Dynamic FAQ]





Allwebco Website Templates
DYNAMIC FAQ Add-on Setup:
This application is intended to be added to any website or any website template.

View Dynamic FAQ support page
View Allwebco add-ons

Outline: (Steps on this page)
#1. Unzip and place files and folders.
#2. Test.
#3. Create new FAQ page.
#4. Add Javascript to page head area.
#5. Add CSS to page head area.
#6. Setup the FAQ.
#7. Change/edit options.
#8. Troubleshooting.


STEP #1: Copy Files | More Details
Unzip the "FAQ-Addon.zip" file and place the "FAQ" folder and all files and subfolders in this zip file folder in your main template or website folder. Place the 4 .html pages in this zip file in your main template or website folder with your other HTML pages. Open the "help-popup-FAQ.html" or "help-dynamic-FAQ.html" in your website folder to proceed.


STEP #2: Test Dynamic FAQ
Open the dynamic FAQ samples page and click on any link on this page. Clicking the links should dynamically open the FAQ answers. If the FAQ links did not work, try copying the "FAQ" folder from the .zip file again into your template or website folder.


STEP #3: Create FAQ Page | More Details
  1. Make a copy of one of your existing HTML pages. For example make a copy of your "about.htm". Click here for help copying pages. Name this page "faq-page.htm".
  2. Open the "FAQ-dynamic_sample.html" included with this add-on in Notepad or a plain text editor.
  3. In the "FAQ-dynamic_sample.html" highlight the code between these notes in the HTML source code: "START COPY AND PASTE AREA" and "END COPY AND PASTE AREA".
  4. In the new "faq-page.htm" you created find the "MAIN TABLE" or the "CONTENT TABLE" note. Or find the start of the page text in your "faq-page.htm". Paste the code from the "FAQ-dynamic_sample.html" into this area on your new "faq-page.htm". Be sure to paste inside the main table. You may want to paste this new FAQ text and links over some existing page text.
  5. Save this page and test it in your browser to see how it looks. The FAQ links will still not work and the text DIV areas will all be open. You will just be checking for serious alignment errors or placement errors.

STEP #4: Add Javascript
Select and copy the following line of code in the box below. Paste this into the head of the new "faq-page.htm" page you have created. Add this code just above the </head> tag in the "faq-page.htm". NOTE: Optionally, if you are adding FAQ links to any of your other pages or in the menu paste this code into all of your HTML pages. Make backups first!!!



View the source of the FAQ-dynamic_sample.html to see where to add the code above.


STEP #5: OPTIONAL Add CSS
This step is optional. If you have a CSS file now in your template or website you may want to skip this step and use your site's default colors. Select and copy the following line of code and paste this into the head of the new "faq-page.htm" page just above the </head> tag in the "faq-page.htm".



#5 OPTIONALLY... You can just add this line to the bottom of your template CSS file:

.faqlinks { line-height: 22px; }


STEP #6: Edit FAQ Page | More Details
See the dynamic FAQ support page and also your dynamic FAQ sample page for instructions.


Search Engine Notes:
You may want to add the following line to your "robots.txt" to keep search engines from indexing the pages in your "FAQ" folder.

Disallow: /FAQ/



OPTIONS:



ADDING DYNAMIC FAQ LINKS ON OTHER PAGES: | More Help
NOTE: Be sure you do step #4 first on all pages that will link to a dynamic FAQ or this will not work. You can add an FAQ link to any existing page or to .js files. To add FAQ links on your existing HTML pages: Select and copy the following code. Then paste this onto any of your HTML pages (Example for FAQ 1):



To add an FAQ link in the sidebar.js or other .js file, you can use the following code:



NOTE: In some .js files you may need to edit the FAQ width in the "FAQ_dynamic.js".

NOTE: If you are adding links to the sidebar.js or need help adding links to your pages, see the following two support pages: Adding page links and also see Adding items to .js files.

DYNAMIC FAQ OPTIONS: | More Details
There are some options in the FAQ_dynamic.js. The FAQ_dynamic.js can be found in the "FAQ" folder and can be edited with Notepad or any plain text editor.

COLOR CHANGES: | Click for more details | More color details
The dynamic FAQ add-on features some color code in the "FAQ.css" file. Edit this file in Notepad to change the colors.



TROUBLESHOOTING:



FAQ not working:
If you do the steps above and the FAQ is not working:

  1. Be sure you have added the line of code in step #4 to any and all pages with FAQ links on them. Add the code in step #4 just above the </head> tag.
  2. You are linking the wrong .htm document or it is misspelled. Remember that hosting areas are case sensitive. Be sure all file and link names match exactly.
  3. Your "FAQ" folder does not exist or is named incorrectly.
  4. Try doing the above steps again from the start.
  5. FONT PROBLEMS: The "FAQ.css" defines some fonts that your template or website .css file may also be using. If you have any font issues you can paste the line in step #5 just above or just below your current .css line in your HTML pages, or skip step #5 to see what works best.
  6. Check the Pages or Files not Updating After an Edit support page.
  7. Check the Parts of the Template are Missing After Uploading support page.








COPYRIGHT © Allwebco Design Corporation | View Allwebco User Agreement
Unauthorized use or sale of this script, images or any files included in this download is strictly prohibited by law. By purchasing this script you are authorized to use this on a single Allwebco template, website or any template from another company. You are also authorized to modify all included files for this single site use. Click here for add-on re-use details and payments.

Purchaser is authorized to use any and all files included in the download on a single website.