Kansas Department of Administration

Getting-Started

The intention of this page is to get started on accessing source code, along with general information to help get you started with developing a functional webpage using Site-Viz.

If you have no experience with html or CSS visit W3schools

Editing a page

If you are wanting to learn how to use the Page Content Toolbox follow the link below to read from the documentation provided by site-viz

Site-Viz Manual

A Site-Viz username and password is required to access this.

Why Source Code

Although you can use the Page Content Toolbox for general tasks, there are still times where you may have to access the source code and make changes from there. For example applying classes or id's to certain elements, add styles to certain elements, the list can go on!!

Accessing Source Code

To access the source code simply click on the following button on the Page Content Toolbox.

Access Source by clicking the source button

Adding Classes

Although there are many ways to add classes and styles to certain elements using the toolbox, there may still be instances where you are going to have to access the source code to add classes or css styles to certain elements. Below is an example of adding a class to an <a> element and it's Result.

Source Code

Adding classes to elements

Result

Hello

Things to keep in mind

  • Make sure that you add the class attribute inside of the <> tags

  • Make sure the class name or names are inside of the quotation marks ("")

  • Classes are case sensitive

For more information about the class attribute follow the link below.

W3Schools - Classes

Adding Styles

Toolbar can help you add styles to certain elements like the table, links, images, etc. You can add your styles to your elements using source like the example below.

Source Code

Adding Stles to an HTML Element

Result

Hello

Things to keep in mind

  • Make sure that you add styles inside of the <> tags

  • Styles are case sensitive, and declarations should be lowercase.

  • To learn more about the syntax go to W3Schools CSS Syntax.

  • Inline styles are the only css styles accessible by content managers.

To learn how to use css elements visit the link below and browse the documentation.

W3Schools - CSS styles

© 2022 Kansas Department of Administration. All rights reserved.