HTML and CSS

There are limited options to change the HTML or CSS for a page. Most of the HTML is created by the developers of the campus site. However, when the content creators add content to a column, HTML will automatically be created for that content. You can also add local CSS to this HTML code. However, it is rarely, if ever, needed. 

To access the HTML code that can be changed, click on the Source button on the top body menu bar for a column. If you edit the page and then edit this column, the source button is above this content in the menu. 

 

When you do, you will see the HTML for the section:

<p>There are limited options to change the HTML or CSS for a page. Most of the HTML is created by the developers of the campus site. However, when the content creators add content to a column, HTML will automatically be created for that content. You can also add local CSS to this HTML code. However, it is rarely, if ever, needed.&nbsp;</p>

<p>To access the HTML code that can be changed, click on the Source button on the top menu bar for a column. If you edit the page and then edit this column, the source button is above this content in the menu.&nbsp;</p>

<p>&nbsp;</p>

<p>When you do, you will see the HTML for the section:</p>

Once you change the text, either by changing the style (default, H3, H2...etc.) or by making it bold, italic, etc. The same goes for the paragraph style. You can see these changes by clicking the source when editing this column.

Bold, Italic, Strikethrough, superscriptx, subscriptx.

Centered

The HTML will be added for bullet points, numerical lists, an added image, etc. Edit this page and paragraph then look at the source for this paragraph to see how the HTML changes for the above examples. 

 

One of the most used changes to the HTML is when you add jump links, also called anchor links, to jump to on the same page. Look at the Embed section of this book to see examples of Jump Linkes. The Web Theme User Guide Jumplinks page has instructions on how to do this. It will require you to add

id="name of jump"

into the attribute that you want the clicked link to go to. This is very useful for pages with a lot of content or in special cases, for accessibility. WebAIM has good instructions for Skip Links; these are jump links but are called skip links here because it allows screen readers to skip over certain content.  

CSS


CSS is only useful if you want to change the look of many items at one time. For example if in a book you want to make all the H2 items in the book look a certain way that is different from the normal H2 attributes. CSS will allow you to change the looks of all the items by just changing the CSS attributes for that elements, i.e. H2. I have never used CSS here and I don’t think you will have to either, but just in case I have included a link to a tutorial.

w3schools tutorial