Website Builder Walkthrough

Every portal comes standard with a website builder, public URL, and website hosting to help increase online visibility. Your website is easy to setup and updates automatically as you add content in OrgSync. To access the website builder, select Website along your portal's toolbar. Click here if you do not see this tool. This article includes a video training as well as a complete breakdown of the sections that constitute the website builder.

2014-04-04_1557.png

Pages

This tab allows you to define, create, and edit each page on your website. To create a new page, locate this option in the top right of the interface. To the right of each page, you are provided it’s quick URL (which can be used to link to the page) and several tools, including the edit, clone, and delete options.1.pngTo make changes to a particular page, hover over the gear icon and choose the edit option. This will take you into the CK editor used to customize each page of the website. The most important feature available in the editor is OS Modules because it allows you to publish content created in your portal to your website. For example, if you choose to place your calendar on the website, any events you create in your portal that are set to public will automatically populate the website calendar. Locate the OS Modules button in the top left of the editor to view the available options.2.pngIf at anytime you wanted to preview a page, click on the name of the page from the Pages list. You can also use the View Your Website button to quickly jump into the website.

Images

This tab is a section used exclusively for images you plan to use on your website.2014-07-15_1316.png

Files/CSS

This is where your website’s stylesheet (CSS) and any other files you want to use on your website are stored. You can customize the stylesheet to make formatting changes if you hover over the gears icon and click Edit. We suggest gaining a thorough understanding of CSS before making changes to this file. It’s easy to make a mistake that can break the formatting of your site. All website resets must be handled by a member of the OrgSync staff and you will lose all content in the reset process.4.png

Template Elements

This tab is broken into three separate text documents: the meta/head, header, and footer. The meta/head is used to communicate with browsers and search engines. It includes things like website title, description, keywords, and the favicon. Nothing in the meta/head affects the layout of your website. 5.pngThe header is used most often to define the navigation bar. Adding a new page does not automatically create a clickable link on the header. This has to be done manually within the code. See the following screenshot. The red box outlines the section of the code used to create each header link. To create a new link, simply copy and paste one of these lines of code. It’s important to change the pieces underlined in yellow and green. The yellow indicates the page name while the green indicates the name that will appear on the link.6.pngThe footer typically represents what appears at the bottom of each page on your website. This is often used for a disclaimer, contact information, or even further navigation.

Settings

This tab allows you to change your website’s URL and re-order your officers (if you are utilizing the officers module on one of your pages). The first portion of the URL is not editable and determined by your umbrella. If you would like to redirect an existing website to your OrgSync page, this must be handled through the host company. This process is not handled in OrgSync.7.png

Additional Resources

If you're interested in learning more regarding the principles behind HTML and CSS, we've compiled a short list of useful external resources below which will empower you to make the most of your website building experience.

Have more questions? Submit a request

Comments