Free Demo
1.866.696.8709
Atrixware » Blog Archive Custom Course Page in Weblearning - The Next Step - Atrixware
learning management system
Axis LMS
Ready to Enhance and Streamline YOUR Training?
Works on Windows, MacOS, iPad, iPhone & Android
FREE DEMO

Custom Course Page in Weblearning – The Next Step

In this article, I will be elaborating on the design features we went over in the last article Custom Course Page in Weblearning – The Basics.

Upload a banner file and a logo

Note: The banner size needs to be 800 by 150 pixels to be displayed properly
(If you are unsure how to upload files, please read Custom Course Page in Weblearning – The Basics)

Adding Your Banner

Ok, now that your files are sized and uploaded, you want to add the banner to your existing course. This is done by clicking your Courses tab > admin tools > properties and settings.
blog__layer-2.jpg

Select the banner image that you uploaded from the banner drop down menu.
blog__layer1.jpg

Click the Layout & Design tab > Login Page.

blog__Layer3.jpg

We now want to insert our logo in place of the arrow and change/add some wording. (You may have already done this in the previous tutorial) To change the background color of text, select the text and click the background color button at the top of the editor.

blog__layer-5.jpg

Now click the Text Editor Plugins button to bring up your editor features. After you have done this, we want to put in a line to separate the content we are about to add. One way is to use on the Insert Line feature to add a line. The other is to copy and paste the top line. This can be done by selecting the line, right click and select copy (ctrl + c). Place the cursor where you want to place it, right click and select paste (ctrl + v).

blog__layer-8.jpg

Now that we have a separation line, we will add some bold text then a youTube movie below.

To add the youTube movie, click the youTube movie button. Put in the web address and click OK.

blog__layer-9.jpg

We are now done editing the login page so if you haven’t done so already, you want to preview it and make sure everything displays the way you want. You should have something that looks like this…

blog__layer-11.jpg

Before I go any farther, if you know HTML you can do some advanced editing by clicking the HTML tab. If you do not know HTML and plan to do a lot of customization, it would be helpful to at least learn some basics.

blog__layer-10.jpg

Section 2: Customizing Tabs

Now navigate to Tab 1

Important Note: All buttons and tools discussed below are in the top of the editor. If you hover your mouse over each tool, it will give you a tool tip saying what the button is.

blog__layer-14.jpg

We now want to insert a table and align all of the information inside it to the center. Click the Add Table button.

blog__layer-15.jpg

Select the amount of rows (horizontal) and columns (vertical) you would like. I am going to create a 3 row by 3 column table.

blog__layer-16.jpg

Now that the table is created, select it and click your Align Center button. Now type some information into the top 3 table cells. Click the cells below and add some images.

blog__layer-18.jpg

Finally we want to merge the bottom row to be one line. This is done by clicking in the bottom left cell. Click the Merge Cells button 2 times to create one line and type some information.

blog__layer-20.jpg

You can also edit table properties, add a row, delete a row, merge columns etc. I would recommend testing most of the table buttons to get a better understanding of how each of them function. Finally, preview your custom pages.

blog__layer-21.jpg

If you enjoyed this article please consider staying updated via RSS.

Comments are closed.

A Better, Easier & Less Expensive Learning Management System
Try the Atrixware Axis LMS