\label{Docs_Web_Page} \index{web page} Although web pages used in a course may always be uploaded to Authoring Space, published, and then imported into a course (and that certainly would be the favored approach for web page content that is suitable for re-use in multiple contexts), there may be content which is better suited to upload directly to a single course. For example, some content may logically really only belong in a single course. It may also be the case that some users may be granted privileges to edit course content, but not have an author or co-author role, which would allow them to publish content. There are four ways to upload a web page (and any embedded dependencies, e.g., images etc.) directly to a course: \begin{itemize} \item Upload an existing HTML file, see: \ref{Docs_Uploading_From_Harddrive} \item Upload an existing zip file containing a web page and any dependencies, see: \ref{Docs_Uploading_From_Harddrive} \item Add a blank Web Page \item Add a Simple Course Page, as explained in the section \ref{Docs_About_Simple_Page} \end{itemize} For the first three of these, the web page may contain multiple dependencies, e.g., images, applets, movies etc. By contrast, only one optional image file dependency is supported for the template-based ``Simple Web Page'', When working with web pages uploaded directly to a course, you will find that the procedure for adding images and other embedded objects to a web page is different to that encountered when managing web pages in Authoring Space. LON-CAPA Web Page documents are stored differently than they might appear on a typical server. Within LON-CAPA the Web Page and supporting image/multimedia are composed/uploaded via a single link on the course contents, instead of creating folders for the dependencies. Within LON-CAPA any subfolders are `virtual', in the sense that any subfolders will be created automatically, based on the specified path (e.g., for images, based on the subfolders in the src attribute of the img tag). The following procedure can be used to compose a web page online: \begin{itemize} \item\textbf{Course Editor -$>$ Other -$>$ Blank Web Page} \item\fbox{Re-initialize} the course. \item Click the \textbf{Edit} link (Actions column) in the row containing the new page. \item The main editor window will have a subsidiary menu containing: \textbf{Math Rendering/Change View, Edit,} and \textbf{Manage Dependencies}. \item The \textbf{Math Rendering/Change View} \index{math rendering} selector changes the rendering engine used to display mathematics, included within the web page inside $<$m$>$ $<$/m$>$. This tool permits you to view the web page using various settings. Unless you have configured a setting for the course, each student's settings are used when they view the page. See the section \ref{Course_Prefs_Display} for more information.\index{math rendering}. \item Clicking \textbf{Manage Dependencies} launches a pop-up window which will check the web page for links and embedded objects (e.g., images) and prompt for upload, if missing, or possible replacement, if found. This is helpful for changing dependent files for an existing page. \item Clicking the \textbf{Edit} button will display a textarea which can be used to edit the source HTML, or the ``Rich Format'' link can be clicked to switch to the WYSIWYG editor\index{WYSIWYG editor}. The WYSIWYG editor includes an image button which creates an $<$img$>$ tag and pops up a modal window in which you can specify a path for the image. You can use a link to external resources, or to published resources. The link to a resource in your published space looks like \\ \texttt{/res/$<$domain$>$/$<$username$>$/$<$path$>$/photo.jpg} where \\ \texttt{$<$domain$>$/$<$username$>$/$<$path$>$/photo.jpg} are replaced with the actual names. If you create an image link for a file used only for this web page, the path is virtual in the sense that you create a virtual folder structure and it will not be a folder structure that students browse. You should use a relative path, e.g. $<$img alt=``my photo'' src=``images/photo.jpg'' /$>$ as if ``photo.jpg'' is in a subfolder ``images''. For this type of image, you create the path in the $<$img$>$ tag before uploading the image using the \textbf{Manage Dependencies} button described next. The editing window also includes a \textbf{Manage Dependencies}\index{manage dependencies} \index{dependencies, manage}\index{image} button. After adding an $<$img$>$ tag with the src attribute pointing to a relative URL, click \textbf{Save and Edit}. In WYSIWYG mode a broken image icon will be displayed. Click ``Manage dependencies'' and you will be prompted to upload an appropriate file from your computer. Note that an \textbf{Edit} link provided in the Functions menu when viewing the page in course context (if your current role has course editing rights) is a shortcut to the editor for this page. \end{itemize}