<< return to training home page

Design your own website using Microsoft Front Page® software

Website Design Instructions for ministry helpers [lastedited 11/24/2003] ( email if you have any questions )   

If you will follow these instructions you should be able toproduce a very professional and very effective website (that would typicallycost the customer several hundred to more than a thousand dollars)  in 5hours time. Please read the entire instructions one time before starting.Suggest you print this page out and keep it on your desk while you are working.

This page is the equivalent of a whole college semester'sworth of web design class combined with 3 years of experience. Theseinstructions will show you how to create a website, submit to search engines,and even how to setup ecommerce.

Definitions: 

bulletBlank web template = the zip file with blank prescripted pages I sent you.
bulletPredesigned web template = a predesigned graphic template that is purchased/downloaded/or sent to you by me.
bulletDesign Themes = a native front page feature found by clicking file menu Tools, Theme.
bulletPagetemplate.htm = a blank page that is customized with the official theme and navigation of the website you are creating and which will be used to create all new pages so they all look alike.

Attachments:  (please makesure you have these or ask me for them)

bulletHTM church web design text file
bulletHTM ministry web design text file
bulleteGroup setup text file
bulleteMail setup text file
bulletInstructions on logo's, flash pages, pictures - see ** at the bottom of this page

Initial Preparations:

  1. Create website design request at www.hightechministry.org - click on free website design, then Order. Enter the customers information on the form, but indicate your name and your email address somewhere.
  2. Email me the proposed text content and request a design template (if needed). The content we need provided is in the attached file(s) titled 'htm church web design'. You must get the customer to provide this info.
  3. Have me purchase a new domain name if they don't already have one. To do so, I need the proposed text content and the website design request.
  4. Request web hosting at www.hightechministry.org/hostingorder.htm  using the customers information and the newly purchased domain name. Where the form asks for name, put your name followed by the customers name. eg. mark for John Doe.

Start Designing:

1a. If you are using a pre-designed template,unzip into a new folder that you create for this website.

a.  Then, Unzip this Blank Web Template file also unzip the file into this same new folder or c:\temp.

1b. If you are using a frontpage theme, clickhere for instructions.
   
[If you are using a pre-designedtemplate] Start Here
2a. Create page names and insert pre-scripted pages from Blank Web
  
 

    a. Create a blank content storage page and save it as content.htm. Paste all the website text and content onto this one page. From here, you will paste the text / pictures into each individual page. Cut the content as you go ( and leave the content page unsaved as you remove content in case you forget something ) pasting onto the new pages.

    b. Create the web page names by renaming template pages. Looking at your content, decide on new page names. Example: home, about us, and maybe one other page such as ministries.htm or missions.htm In folder list view ( you can see files names on left ) right mouse on the file name, choose rename, rename, click enter.

Note that we have the standard pages in the blank web template to give you page name suggestions already ie. contactus.htm, prayer requests.htm, confirm.htm, directions.htm, penpals.htm, tellsomeone.htm/thankyou.asp, biblesearch.htm, etc.

    c. Insert existing predesigned blank web template pages - Open (or create) contactus.htm, prayer requests.htm, confirm.htm, directions.htm, penpals.htm, tellsomeone.htm/thankyou.asp, biblesearch.htm, etc. one at a time. When page is open, click where you want to insert the content, click Insert, File, click on the file name you want to insert, ok, save. Reformat as necessary. Make sure you adjust the form properties on Contact, Pen Pals, Missionary Invites, and Prayer Request pages

     d. Start creating remaining page designs and page content.

for Cobalt Servers e. One exception: thankyou.php - Open the page by double clicking. Modify the customer email address and ministry name. Copy the entire code. Open the pagetemplate.htm page, click at the top of the page where you want to insert the code, click on html tab, paste, save.

for Windows Servers e. One exception: - thankyou.asp  - Open the blank pagetemplate.htm and open the thankyou.asp prescripted page. Highlight and copy the text - 'Thank you for referring us, ---- . '  and paste into pagetemplate.htm. Now switch to html view (tab on bottom) and scroll to the very top. Highlight and copy all the red code between the <%  and the %> which ends right before the <html> tag. Copy and paste into the pagetemplate.htm html view above the <html> tag. Then save as thankyou.asp. You must modify the email address and the subject parts of the red code as per the purple instructions.

Ifyou are using front page themes
2b.
 - Openfront page and click File, New Web, choose web templates, then choose emptyweb. Create a new page by clicking file, new, page, and save it as index.htmor pagetemplate.htm. Then start your design and use a front page theme. Note:you must have a page named index.htm as that will be your home page.

a. Create a standard blank page template with the chosen theme or predesign. Save this one page without any text content as your blank page template. Save as - pagetemplate.htm  Later, you will open this page and resave it as each page name.

b. To format the design theme, click format, theme, all pages, then scroll down and select a theme, click ok.

c. Start creating pages.   Open the pagetemplate.htm and click Insert, File, and browse to each of the prescripted blank webtemplate pages (eg. contact.htm). This will insert the prescripted pages into this new page template. Then after you copy the content from each page into the new page, click File, Save As, give the page the appropriate name.    Open the page template file again and continue this till all pages are created. Specialized Purple text comments are included on each page of the blank web template.

Note that we have the standard pages in the blank web template to give you page name suggestions already ie. contactus.htm, prayer requests.htm, confirm.htm, directions.htm, penpals.htm, tellsomeone.htm/thankyou.asp, biblesearch.htm, etc.

d. Insert existing predesigned blank web template page content - Open (or create) contactus.htm, prayer requests.htm, confirm.htm, directions.htm, penpals.htm, tellsomeone.htm/thankyou.asp, biblesearch.htm, etc. one at a time. When page is open, click where you want to insert the content, click Insert, File, click on the file name you want to insert, ok, save. Reformat as necessary. Make sure you adjust the form properties on Contact, Pen Pals, Missionary Invites, and Prayer Request pages

for Cobalt Servers One exception: thankyou.php - Open the page by double clicking. Modify the customer email address and ministry name. Copy the entire code. Open the pagetemplate.htm page, click at the top of the page where you want to insert the code, click on html tab, paste, save.

for Windows Servers One exception: - thankyou.asp  - Open the blank pagetemplate.htm and open the thankyou.asp prescripted page. Highlight and copy the text - 'Thank you for referring us, ---- . '  and paste into pagetemplate.htm. Now switch to html view (tab on bottom) and scroll to the very top. Highlight and copy all the red code between the <%  and the %> which ends right before the <html> tag. Copy and paste into the pagetemplate.htm html view above the <html> tag. Then save as thankyou.asp. You must modify the email address and the subject parts of the red code as per the purple instructions.

Now, move to Step 3 and create navigation. Then come back here to step e.

e. Start creating remaining page designs and page content. Simply copy / paste the appropriate content from the content.htm page into the appropriately named pages.

3. Create website navigation (If you are notusing a pre-designed template) 
( pre-designed templates often use Includes. See d. below and will generallyhave most of the navigation set for you.)
 

Click View, Navigation, then drag / drop each page underneath the Home / Indexpage. (except the confirm and thank you page. drag those underneath contact.htmand tellsomeone.htm pages respectively)

     a. Set Shared Borders -Click view, page, and then format, shared borders, select top - left - bottom for All Pages. When page to the page view click the left border. Click insert, web component, link bars, bar based on site navigation and follow wizard. Choose 'pages under home page' and choose the home page checkbox. Save.

    b.  Set the Bottom Border with the contact info ie. Organization name, website url, address, phone, address, email address. Center on page.

    c. Set the Top Border by inserting the logo (see comments below) or a page banner. For page banner, click insert, page banner. Save. The page banner will read whatever you named the page in the step above when creating website navigation.

Option: create two levels of navigation - Global and Pages under Home Page.  Here, you might put some of the pages such as contact, directions, prayer, email a friend up on the top border and bottom border as global pages. To do so, click view, navigation, and drag these pages to the same level as the home page. Back to Page View. Click on either/both Top and Bottom border areas and click insert, web component, link bars, bar based on site navigation and follow wizard. Choose 'global pages' and  Save.

( pre-designed templates often use Includes. See d. below and will generally have most of the navigation set for you. You will likely need to add the few new pages you created to the include file or move them around a little.)

    d. Includes - many times the template will use Included files for the navigation INSTEAD OF shared borders, or they will use Included files for special messages. This enables you to modify just one file and it will repeat on many pages. Saves time. To edit an include file, right mouse click on the page where the file is included. Choose open in new window. Edit. Save. It will automatically update the pages it is included on. To insert a new Include file - click where you want the message or navigation included, click insert, web component, included content, page, browse, find the page to be inserted, ok/save.

4. To Finish the Recommend Us / Email A Friend page, forWindows Servers only  Click on the middle of the form, choose formproperties, click the script selection and make sure the form is sending tothankyou.asp. Save.

5.  To add an eGroup opt in eNewsletter: have the customer create an account at www.injesus.comCost$20/mo. Then use their login info to retrieve the code to put on theindex.htm page.  Login with their info, click MyInJesus, then click theirgroup on the bottom left, then Click promote. Copy the code and click yourcursor on the index.htm page where you want the opt in form to be. Click Edit,Paste Special, Select HTML, ok.

a. How to create an InJesus eGroup: go to www.injesus.com and click on the mailbox icon on the bottom left side. Enter email address and password, click login, complete the next form, click yellow button, complete the next form, click yellow button. Done.

b. To retrieve the needed code:  login to www.injesus.com if you aren't already logged in (note the 'click here' text in the upper right). Then click MyInJesus tab, click on the group name on bottom left margin, then click the Promote link on the left hand side. Copy the code for the style of button you desire.

c. How to create a free ChristianEmailService.com eGroup - click Create a New Account and follow instructions. The retrieve the html code and insert into the appropriate webpage.

d. How to insert code - copy from eGroup code, click on spot in website where you want to place the code, click edit, paste special, html code, ok.

6. For Contact, Pen Pals, Gods Free Gift, MissionaryInvites, and Prayer Request pages:  you must setthe form properties to insert the website owners email so that they will receivethe forms. See purple text instructions on each of these pages or the Front PageTutorial home page on how to edit forms.  www.hightechministry.org/cbt/frontpagetutorial.htm 

Note: The Gods Free Gift page includes a flash fileinserted. Leave it alone. Do not edit the newcreation pages and do not insertthem into the navigation either. There are 3 pages as part of this group -godsfreegift.htm , newcreation.htm, newcreation.swf

7. For Directions page - [ notapplicable to non USA churches ] locate a map from either www.mapblast.comor www.mapquest.com by searching with thechurch's address. When map shows, right mouse and save to your computer. Thenopen the directions page and insert. Best to use a close up and a zoom out.(This is not typically needed for rural churches and ministries in Africa...butit's your choice.)

8. Copy and paste the text contentfrom the content.htm page (created above) into each appropriate page. Save eachpage. The home page should have a 15-25 wordopening paragraph on what the website is about and what it is going to do forthe visitor and the website owner. It should have a picture or two to help bondthe visitor with the website. It should be like a magazine ad in that it is usedprimarily to grab the visitors attention. It should not be a grab bag ofeverything in the website. Use the other pages to fill in the detail eg. AboutUs, or Ministries.

9. Page titles, descriptions, metatags: Click View, Folders. Then right mouse on each page and choose properties. Giveeach page a unique informative name of say 6-10 words. On the home page (index.htm)copy the 15 word opening paragraph, then right mouse on the page and choose pageproperties. Click the Custom tab and click Add at the bottom right. TypeDescription in the first field and paste the copied 15 word description into thesecond field. Save.

10. Publish it now:  [note:you will NOT be using ftp. FTP is not compatible with front page websites] Youare done and ready to publish to the webserver and then ready to submit to thesearch engines. To publish to the webserver - within front page - click File,Publish Now, click Web Folders or Network Places icon, type in the full http://www.newwebsitedomainname.orginto the blank field, click OK, then enter username and password, then clickPublish.

** Logo comments - if the customer sends a logo, insert it into the appropriate location. If no logo is sent to you by them, I will have one made and sent to you - or we'll simply use the page banner feature of the design theme.

** Flash pages - if your template has a flash page, you will need me to edit it with a program editor called Swish. Typically, the flash page will be your index page and it will auto forward into the actual home page called home.htm.  Note that you will have a couple other files as part of the flash page ie. .swi or .swf and a movie.html page. Leave these alone.

** Pictures - a website is much more effective if it has pictures. It is best to obtain them from the customer and have them scanned in. A picture should be a maximum of 400 pixels wide and most often it should be a thumbnail of that say 125 - 250 pixels wide. This will keep your pages fast loading. Avoid overusing pictures on a page - say a max of 2 - 4 pages. To Insert: click Insert, Pictures, From File and browse to image. To ReSize: Click on the image, then click the thumbnail icon at the bottom, or right mouse and choose picture properties. Then specify the desired pixel size of the image and click ok. Then click the image and click the resample icon at the bottom. Click save. To find free pictures:  Click insert, picture, clip art, then on bottom right click Clips Online. You will be able to find free clip art and free pictures from Microsoft to add into your website. 2nd best bargain online. Alternately, you can find professional royalty free pictures for $20-30 many places online. Do a search in google.com for royalty free pictures.


Search Engines:
 

Please go to www.hightechministry.org/cbt/searchengines.htmand follow the step by step guidelines on how to submit to search engines forfree. This will take about 1 hour.

Ecommerce or Online Donations:

Paypal.com provides free merchant accounts without qualifyingwith a bank. You can accept credit card donations and only pay a small discountif someone sends you money. This is the best deal on the internet. It isavailable in many countries around the world. (not available in Africa exceptSouth Africa)

Go to www.paypal.com andcreate a free business premier account.[ not applicable to African countries]Note: create the account in the same name asthe checking account name you will be depositing the money in. Very important.

If your website is an organization and your checking account is a personal account you have three choices - 1. open a business checking account or 2. file a sole proprietor dba and take that form to your bank and have it added to your personal account as a co-owner or 3. open the Paypal account in your personal checking account name but mention the organization name in the Notes field or similar when creating the Paypal account. And consider mentioning it on your website. To see a working version, go to www.hightechministry.org and click on Make A Donation button.

Once you get the Paypal account created, you need to Add aChecking Account. Follow the instructions. Paypal will actually deposit twosmall amounts in the checking account to make sure it works. You will then needto verify with Paypal what these amounts were. This takes about 3 days to turnaround. Once completed, you will be able to deposit money into the account andpay bills out of this checking account!  You can now accept credit cardpayments and donations!

Exceptions:  if you arelocated in a country that is not served by Paypal, you can have a friend inanother country open a bank account in your ministry name and follow theinstructions above. Then, your friend can wire funds from this new checkingaccount to your bank account.

 

Grace and peace to you,
Mark S Disbrow
www.hightechministry.org
markdisbrow@hightechministry.org