---

KyTekHTMLeditor for iPad, iPhone and iPod touch; lets you edit the textual content of html documents as they appear in a browser - no codes to worry about. The KyTekHTMLeditor supports display of mixed fonts and sizes, varying type styles, colored text, colored backgrounds, underlining and numbered and bulleted lists. Left aligned, right aligned, centered and justified text are supported along with varying left and right margins. Text can be copied and pasted from/to other applications and within the editor. Images can be placed/pasted and sized. Tables can be created and edited. Spell checking and searching are supported. CSS style definitions can be created and edited on iPad.
The best way to reach us with comments or questions is via email:
Support
 The Options button lets you specify a number of preferences related to use of the KyTekHTMLeditor including:

• Select paper "width" which can either be the screen width (dependent on screen orientation) or a fixed width from 3 to 8 inches.
  
• Select default body text size. In the absence of a font-size specification for your body style the "Default text size" you specify in the Options is the size applied to text.
• Specify that the return key should automatically generate new list elements when your cursor is at the end of a list element (</li> is to the right of the cursor as displayed in the right cursor button when editing).
  
• Save the login credentials of your last login to either an ftp site or your Google docs account. If you select OFF then none of the information you type is stored for future use. If you select ON then your Google docs account name and password are remembered so the next time you access Google docs these fields are filled in with that information. Similarly if ON is selected then the last ftp address, user name and password are remembered and filled in to the associated fields the next time you tap the FTP button.
  
• Choose to use Advanced Search with regular expressions when using the search function if running with iOS 3.2 or greater. If you select ON then you can type in the search bar regular expressions as defined by the ICU User Guide.
  
• Elect to have the auto-save function overwrite your existing file. If you select OFF then if the file you are working on must be auto-saved as when you tap the home button, switch apps or take a phone call then a new document is created having the name of your document with the date and time appended as a character string. If you select ON then your existing file is overwritten when an auto-save is necessary.
  

 Tap on the document to display a vertical cursor indicating a point at which you want to edit the text. Tap on the Edit button at the bottom of the screen (NOT the "Edit html" button) to display the keyboard allowing you to insert and delete text. While the keyboard is visible you can scroll around the document and change the insertion point by tapping on your document. When you finish editing tap the Done button to hide the keyboard.

 The navigation bar is replaced by a toolbar while editing. The leftmost four buttons are for adding heads, styling text, changing font and changing color as described below.
The next two buttons (just to left of the Done button on iPhone, the two rightmost buttons on iPad) are cursor motion buttons that also display the current object (character or tag) to the left and right of the cursor location in the text. Tap on the left cursor button and you'll see your cursor move to the left and the buttons updated to contain new left/right objects. Similarly if you tap the right cursor button. If you move left or right over a tag the cursor in text won't move but the cursor buttons will update to show the new elements left and right. This lets you precisely control the cursor placement to the left or right of html tags when that is necessary.

 On the iPhone only five characters are displayed in each button to represent tags, more characters are displayed on the iPad. Short tags are completely displayed, eg <u> and </u> for start/end underline.

 Longer tags omit the < and > and if they aren't too long then they'll also include the first character of a tag attribute. Close tags include the leading '/' character while open tags do not have this.
 You must tap within a table cell to place the cursor within a table. If your cursor is before a "<table ...>" tag or after a "</table>" tag and you use the cursor keys to move forward or backward over that tag then the cursor steps over the table as though it is a single character.
 When tapping the left/right cursor buttons when the cursor is located in a table cell the cursor will move between table cells when you tap the left cursor button at the start of a table cell or the right cursor button at the end of a table cell. If your cursor is located at the start of the first table cell or the end of the last then the cursor will pop out of the table.
 The leftmost four buttons on the toolbar are for applying style tags before inserting text or for applying a new style to selected text. From left to right they are: paragraph (or block) styles, character (or inline) styles, font/size and color.
 If you want to add a head or list or define a paragraph with different horizontal alignment (left, center, right or justified) or create an element with a CSS style defined in your document then position your cursor in the document at the point you want the new element and tap the Paragraph (leftmost) button. Choose the type of element you want to insert from the left list. If you want to add a Class and/or ID attribute then select a Class from the middle list and an ID from the right list. Tap Select. Type the text. A new paragraph with the styling you have chosen is created.
 If you chose a numbered list (ol) or bulleted list (ul) then your first list element is automatically added. You can begin typing the first list element. If your Options indicate to automatically create new list elements (the default) then each time you type a return when your cursor is just prior to the close list tag (</li>) a new list element is automatically generated for you.
 If you want to add text with a bold, italic, underline or similar inline style tap the Style button (stylized B with underline). Choose the style of element you want to insert from the left list. If you want to add a Class and/or ID attribute then select those from the middle and right lists. Tap Select. Type the text.
 If you want to add text with a different font and/or point size tap the Font button (double A). Choose the desired font and size and tap Select. You can choose any size from 1 to 99 point. If you only want to change the font leave the size selection at zero. If you only want to change the size leave the font selection at "No Change". Type the text.
 If you want to add text with a different color or different background color tap the Color button (C). You can choose three different types of coloring on the three wheels. The leftmost wheel sets the color of the text itself. The middle wheel selects an inline style background color which only applies to the immediate background of the text. The rightmost wheel sets paragraph background color which spans the margins. You can set any or all of them. For any types that you don't want to change leave "No Ch." selected.
 Horizontal rules can be placed by tapping the Paragraph button and selecting Horizontal Rule or another defined horizontal rule definition. A horizontal rule is treated the same as a <br> (return) so it can be deleted with the delete key as can a <br>. On iPad you can create and edit horizontal rule related styles, classes and id's. This lets you specify rule color, alignment, length, thickness and margins including top and bottom to control vertical spacing.  Double tap a horizontal rule and select Edit from the copy/paste popup. A dialog appears allowing you to specify the attributes associated with the rule. Once you have set the class, id and other attributes as you want them tap the Save button and the back button and the modified rule appears in place of the rule that was there.  Tap the Paragraph (leftmost) button and select Table from the list of paragraph tags on the left wheel of the popover. Choose a Class and/or ID from the center and right wheels if desired. Tap Select. You are presented with a dialog where you indicate the number of columns, header rows, body rows and footer rows. If using an iPad you can also select Class and/or ID attributes for each of the table structure tags (section, row, cell) if desired. Tap Save. If you have specified non-zero values for the number of columns and rows then a table is created with placeholder numbers in each of the table cells. Double tap a placeholder to select it and type the replacement text.
 Tap within a table cell within the row you want to add rows after. If you want to add rows before then be sure your cursor is at the start of the first cell in the row. Tap the Paragraph (leftmost) button and select Table row (tr) or a "tr" related paragraph tag on the left wheel of the popover and select a Class or ID on the right wheel if desired. Tap Select. In the next dialog indicate the number of rows you want to add and tap Save. If you want to add only a single row then tap Save as the default row count is 1. If using an iPad then you can also select Class and/or ID attributes for the table cell tags that are created.  Tap within a table cell within the column you want to add columns after. If you want to add columns before the first column of the table then be sure your cursor is at the start of the first cell in the first column. Tap the Paragraph (leftmost) button and select Table column on the left wheel of the popover and select a Class and/or ID on the center and right wheels if desired. Tap Select. In the next dialog indicate the number of columns you want to add and tap Save. If you want to add only a single column then tap Save as the default column count is 1. If using an iPad then you can also select Class and/or ID attributes for the table cell tags that are created.  Images are placed by tapping the Character attributes button and selecting Image (img). A popover appears listing all the images in your folder. You can place images into this folder via iTunes or ftp. When you choose an image from the wheel the second and third wheels show the width and height dimensions of the image if they are less than 1000. If either dimension exceeds this then the larger dimension is specified as 100 and the smaller is proportional to this. Choose the dimensions you want the image to appear in your document in units of points (72 points = 1 inch). If you know the width or height that you want then specify that dimension and set the other to zero or leave the field blank and the other dimension is calculated to maintain the aspect ratio of the image.
 You can copy an image from your Photos library and paste it into your document. Use the Photos app to copy the image then tap at the point you want the image to appear in your document and choose Paste from the copy/paste popup menu.
 An image is treated the same as a character so it can be deleted with the delete key.
 Tapping the left side of an image places the cursor to the left of the image while tapping the right half places the cursor to the right.  Double tap an image and select Edit from the copy/paste popup. A dialog appears where you can change the image, specify the text that is displayed when a browser can't display the image, specify the class, id, width and height. Specify either the width or the height as zero (or leave the field blank) and that dimension is calculated so as to maintain the aspect ratio of the image. Specify both fields as zero (or blank) and the image dimensions are used directly. The current image associated with the tag is displayed in the dialog if available in the file listing.  You can place background images in tables and table cells with a two step process (you can skip the first step if you've already define the class or id):

1. First you must define a class or id style that includes a background image. When the keyboard is not visible tap Edit Styles in the upper right of the iPad. Tap '+' in the upper right of the style listing to create a new class or id. Tap the Class or ID button, enter the name and tap Create. In the dialog that appears tap the Background Image button and select the image you want to use for the background from the popover. Select any other attributes you want to associate with the class or id and tap Save. Tap the back button and then tap the back button again to return to your document.
2. Tap in a table cell where you want to apply the background. Tap the Edit button at the lower left so the keyboard appears and then tap the edit tag button at the top (the "< >" button). Select cell or table from the popover and tap Select. The dialog that appears lets you specify the attributes to associate with the table or table cell tag you've selected. Tap the Class or ID button at the top and choose the class or id you defined in the first step. Tap Save and the back button when you have defined any other attributes and you are returned to the document and the table or table cell has the background you've defined.

 If you want to apply styling to existing text then you must first select the text. This is done by tapping at a selection point. A single tap identifies an insertion point for new text. A double tap selects the word around the point that is tapped. Triple tap selects a sentence, quadruple tap selects a paragraph and 5 taps selects the document.
 The selected range is highlighted. The left/right cursor buttons (displayed in Edit mode) now display the object to the left/right of the selection range. You can extend the selection range to the left/right by tapping the appropriate cursor button.
 When a range of text is selected you can use any of the editing buttons to apply new styling to that range of text.
 You can tap the delete key to delete the selected range of text. Or you can begin typing text that will replace the selected range.
 Tap a location within a table cell. Then tap five times on the location of the blinking cursor. The innermost table containing that table cell is selected and highlighted. You can then cut or copy the selected table and paste it at another location or in another file. This approach precisely selects from the <table ...> tag to the </table> tag. Alternately, if your cursor is not in the body of a table (in other words, not in a cell of that table) then the table is treated as a character. If you select a range of text before or after the table and use the cursor keys to extend the selection range then you can extend the selection to include a table.
 When selecting text within a table cell you can select at most the content of a single cell, in other words between the "<td ...>" open tag and the "</td>" close tag (or other implicit close tag). First single tap at a location within the desired range of a cell so the cursor is displayed there. Next multi-tap at that point to select a word, sentence or paragraph.  Double tap an image to select it. The image is highlighted and you have the choice to cut, copy or paste it. If on an iPad you have the additional option to edit it. If you don't see the Edit option tap on the right arrow of the copy/paste menu. If you tap the Edit tab of the copy/paste popup a dialog appears allowing you to edit the image (img) tag. See the related section on editing images.  Double tap a horizontal rule to select it. The rule is highlighted and you have the choice to cut, copy or paste it. If on an iPad you have the additional option to edit it. If you don't see the Edit option tap on the right arrow of the copy/paste menu. If you tap the Edit tab of the copy/paste popup a dialog appears allowing you to edit the rule (hr) tag. See the related section on editing horizontal rules.
 On iPhone and iPod touch copy/paste functions are only available when the keyboard is NOT visible. On iPad the functions are only available when the keyboard is visible and it is automatically made visible when a copy/paste operation is possible.
 On iPad there may be two paste options presented, Paste and PPaste. When both are present on the menu then Paste will insert formatted text (ie with tags previously copied) while PPaste inserts only the plain text without tags. When copying on iPad you cause formatted text to be put on the pasteboard by assuring the tags in your selected range of text are balanced.
 On iPad there may be a Clr option. Tap this to clear the current contents of the pasteboard.
 Tap the search icon to find text within your document. The Search toolbar appears at the top of the screen. Type the text you want to search for and tap Search. On the iPad you'll also see a popover containing recent searches. Tap one in the popover to search for it. The selected text is highlighted if found between the cursor and the end of the document. Search for the next instance by tapping the search icon and then the search key.
 If you have selected ON for the Advanced Search (use regular expressions) option then you may enter a regular expression into the search bar. See the Options section above.
 Tap to place your cursor at the point in your document where you want to begin spell checking. Tap the spell button and the first mis-spelled word is scrolled to and a popover dialog displayed with choices: LEARN, SKIP, DONE, REPLACE and a list of zero or more possible replacements. If one of the replacements is suitable tap it and the mis-spelled word is replaced and the next mis-spelled word is scrolled into position. If the word is correctly spelled and you want the spell checker to remember this as a valid spelling tap LEARN. Tap SKIP to skip the word but not add it to the spelling dictionary. Tap DONE to terminate spell checking. If you tap REPLACE then spell checking is terminated and the keyboard displayed with the mis-spelled word selected so you can type the replacement. If you want to continue spell checking after typing the replacement hide the keyboard and tap Spell and checking continues from that point
 Save the changes you make to your document by tapping the Save button. Or, if you want to save the changes to a document with a different name tap Save As, type the new name and tap Create. Should you accidentally leave the KyTekHTMLeditor for any reason with unsaved changes the document is automatically saved with the current name and the date and time appended to it in the form 20100115_0932 (ie 4 digits for the year, 2 for the month, 2 for the day with the time following the '_');
 Tap the "Edit Styles" button to edit your document styles. A list of styles defined in the <style> ... </style> section of your document appears. This list includes the standard tags (h1 - h6 for example) for which your document may not contain specific definitions. Tap a style name to edit that style.
 If you choose an inline style (eg 'i') then the dialog that appears allows you to set the font, font size, font color, text background color and text decoration (underline, line-through, overline). If you selected a block style (eg 'h1') then the dialog additionally allows editing of text alignment, margins, line spacing, padding attributes and border attributes. Note that the block text background color spans the width of the margins as distinct from the inline background color which only spans behind the affected text.
 You can type attribute values into any of the text fields. There are also buttons beside some of the fields which if tapped provide you with a list of choices for the field. The "Choose Font" button lets you select one of the fonts installed on your device and/or the point size. The various color selection buttons let you choose from the standard colors. You can also type standard color names or type a three or six digit hex color value (eg #ff0 or #ffaa44) or type an rgb value (eg "rgb(255,0,0)"). The color fields display a color swatch to their right corresponding to the color specified in the field.
 If a field is blank then it indicates either the default value for that field or what determines that default value.
 The font size, margins and line height fields let you choose whether the value you specify is an absolute value in points or a relative value (percentage or em).
 The border attributes (width, color and style) allow you specify a common value for all four sides or a unique value for each side. Selecting "All" beside the "Top" field for each attribute sets the value for that attribute the same for all four sides. Selecting "Top" lets you indicate a unique value for each side for that attribute. Similarly, the padding can be set for all sides or individually.
 If you change any of the attribute values the "Save" button is highlighted. Tap it to save your changed style definition for use in the document. Note this doesn't actually save the modified document - you will need to do that on return to the document editor. If editing a text field tap the Done button on the keyboard to exit that field and enable the "Save" button.
 When done editing tap the back button in the upper left to return to the "Edit Document Styles" list. If you tap this button before exiting a text field you have modified or without tapping the "Save" button you'll receive a dialog asking if you want to save the modified style.
 When done editing all styles tap the back button in the upper left of the "Edit Document Styles" view to return to your document view where you'll see the effect of the styles you changed. If any styles were changed you'll note that the "Save" button at the lower left of your document window is enabled.  When the "Edit Document Styles" view is visible tap the '+' button in the upper right to create a new style definition. You have the option to create a definition associated with a particular tag or a generic style. If you want to create a style associated with a particular tag then first tap Base Style Name and select the tag. Otherwise leave this as None. Next tap either Class or ID to indicate the type of style. Finally type in the name of your style and tap create. Edit and save the definition as previously described.
 Once a new style definition is created it appears in the lists presented when tapping on the paragraph and/or style buttons while editing text as described above.
 If you create a new generic ID it will appear in the right list as:
  name
 If you create a new tag specific ID it will appear in the left list as:
  tag#name
 If you create a new generic Class it will appear in the center list as:
  name
 If you create a new tag specific Class it will appear in the left list as:
  tag.name
 For styles that include a base tag this is the same as the name appears in the <style> ... </style> section of the underlying html document. For Class and ID styles the leading '.' or '#' is dropped. Select a range of text around which you want to create a link or tap a point to create a link at a point to which you will add the text visible to the reader. Tap the Style button (stylized B with underline) and then select "Link (a)" from the left column. The dialog allows you to specify the destination of the link, the name of the link and the target. If all three fields are specified the resulting tag is "<a href="destination" name="anchorname" target="target">. You may also specify font and color attributes if desired.
Editing a link is the same as editing any other tag. Place your cursor such that the innermost tag is the link tag of interest (by tapping at a point and/or using the left/right cursor keys) and tap the "< >" or "Edit Tag" button.You can create a generic div or span tag around a range of text or at a point by tapping either the Paragraph button (to create a generic div) or the Style button (to create a generic span). Then select from the left column of the popover either "Generic (div)" or "Generic (span)". A dialog is displayed allowing you to specify whatever attributes you want the tag to have. After setting the attributes of interest tap Save (or if the keyboard is visible first tap Done) and then the back button in the upper left.  Printing is supported by tapping the print button (arrow coming out of a box) on the toolbar at the bottom of the display.  Tap the View button and your document is displayed with Apple's built-in web browser. This will display all document elements including those not supported by the KyTekHTMLeditor. Press the back button to return to the editor view. Note that you must save your document before tapping the View button to see any editing changes you have made to your document.
 The KyTekHTMLeditor supports four means to copy your documents onto or off of your device including:

• iTunes file Sharing
• Google docs
• FTP
• Email

 Each of these methods is described below.  When your device is running iOS3.2 or greater and it is connected to your computer and you are running the latest iTunes on that computer then when you select your device in the left panel of iTunes and choose the Apps panel and scroll to the bottom of the window you see KyTekHTMLeditor in the left scroll view. Select it and the KyTekHTMLeditor documents on your device appear in the right scroll view. You can copy documents into and out of this scroll view. Documents copied into the scroll view are copied onto your device and will appear in the KyTekHTMLeditor on your device. Documents copied out of the scroll view are copied onto your computer at the chosen location.
 Tap the Google docs button to sign in to your Google docs account (must be set up separately). Under the Downloads screen you can select an html document and tap Download to download the document to your iPhone, iPad or iPod. Download as many documents as you like. Tap KyTekHTMLeditor Docs (the "back" button) to return to the listing of the documents on your iPhone that you can then edit.
 While signed in to Google docs you can also upload html documents from your iPhone, iPad or iPod to your Google docs account. Tap Switch to Uploads to see a listing of documents on your iPhone. Select one and tap Upload to transfer that document to your Google docs account. Upload as many documents as you like. Tap the back button to return to your iPhone document listing.
 Tap the FTP button to sign in to an ftp site. The FTP Sign In requests the Address of the html document name you want to download or the folder you want to obtain a listing of, the User Name and Password. If you want to download a single document enter the complete address, pathname and file name (for example ftp.host.com/index.html). If you want to obtain a folder listing append a '/' to the end (for example ftp.host.com/ or www.host.com/). For anonymous ftp leave the User Name and Password fields blank. Tap Sign In.
 If you entered a document name (no trailing '/') then it is downloaded and you are returned to the KyTekHTMLeditor documents view. If you requested a folder listing then the listing is displayed. When there is no selection the button in the upper right displays Refresh. Select an html, htm, shtml, asp or css document and the button displays Download. Tap it and that document is downloaded to your device. Select a folder name and the button displays Open. Tap it and a listing of that folder is displayed. Tap the back button to return to the previous listing. Tap the Refresh button when nothing is selected and the current listing is downloaded again.
 Tap Download Folder at the bottom of the screen to download all recognized file types in the folder.
 When an FTP download listing is displayed you can tap the Switch to Uploads button to upload files to the FTP folder you are currently viewing. After tapping Switch to Uploads a listing of html documents on your device is displayed. Select one and tap Upload and that document is uploaded to the ftp site. You can switch back to downloads by tapping Switch to Downloads.
 You can quit the ftp access by tapping the back button until you return to the home screen (KyTekHTMLedDocs).
 Tap the mail icon to send your document via email. You'll see the standard mail screen with your document attached. Fill in the To field and any other fields and tap Send.
When you have attached an external keyboard tap the "KB" button at the bottom of the "KyTekHTMLed Docs" view. KyTekHTMLEditor then knows that an external keyboard is in use. When you disable the external keyboard tap the "KB" button again.  You can edit the html codes directly by tapping "Edit html". If you first tap a location in the document then you will be taken to that point in the html codes. YOU MUST BE KNOWLEDGEABLE OF HTML CODING TO EDIT YOUR DOCUMENT IN THIS WAY. Tap the back button to return to the KyTekHTMLeditor.

Copyright 2011 - 2012, KyTek, Inc. All Rights Reserved.

The best way to reach us with comments or questions is via email:

or

KyTek, Inc.
PO Box 338
Weare, NH 03281
USA