Return to Docs_Web_Page.tex CVS log

Up to [LON-CAPA] / loncom / html / adm / help / tex

- Remove superfluous word.

\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}