Library:Circle/Editing Guide for Website

This page is intended as a quick reference for useful documentation pages to assist with the creation of cIRcle Wiki content. For more general Wiki/Wordpress documentation, see the Library's tutorial page

Before You Start

• Categorize!

Add the category "Circle" to the bottom of your wiki page using the format: [[Category:categoryname]] (case and space sensitive!). See Help:Categories for more information.

• Watchlist

Click "Watch this page" at the bottom of each page you create, edit, or want to reference. You can then use the *Watchlist tab at the top of the Wiki page to navigate to quickly to all the pages you are working on. Note: You will receive updates about this page whenever it is edited so you may want to remove a page from your Watchlist if you no longer need it.

cIRcle Pages by Type

Wiki-Embedded Pages in WordPress

Most cIRcle WordPress pages feature embedded content created in UBC Library Wiki. As Admin, login to WordPress and also UBC Library Wiki. From the cIRcle WordPress site, navigate to a page using tabbed headings on circle.ubc.ca and click the "in Wiki Embed List" link at the bottom of the page. Then, click the link to the wiki listed under "URL", edit and save the wiki page. After you've edited the wiki content and refreshed it on the WordPress page, return to the WordPress page and click "Edit" and then "Publish". This will ensure that the WordPress page displays the same last updated date as the Wiki. See below for instruction on editing wiki content.

WordPress-Only Pages

These pages are created in WordPress and need to be edited there. Pages created here are typically policy related and, therefore, must be only be edited by cIRcle Staff members with administrator permissions. Most content can easily be edited using the built-in WYSIWYG editor, however, in order to properly preserve menus and anchored links on the Policies pages you may need to copy and paste some of the existing HTML. Forms need to be edited using the "Gravity Forms" plugin from the WordPress admin dashboard. For details on editing each of these sections, see below.

Wiki editing

UBC Wiki is composed with wikitext (or wiki markup). Wikitext is like a simplified version of HTML. You can choose to edit your text with Visual Editor or using the traditional wikitext editor.

Visual Editor is an "visual" or "WYSIWYG-like" online rich-text editor, which allows you to edit wiki article in a more intuitive way - just like in Microsoft Word. If you have basic knowledge about wikitext, and you want to have more control in how you want to format text or do something more advanced(such embedding a video,etc.) you can choose to edit in wikitext editor.

You can always switch back and forth Visual Editor and wikitext anytime.Take a look at the documentation below to learn how to format in UBC Wiki:

• Learn how to format in Visual Editor
• Learn how to format in Wikitext

Links

There are two main types of links that can be created on the the UBC Wiki:

1. internal links to other pages in the wiki
2. external links to other websites

Tips on Images for Wiki-Embedded WordPress Pages

Make sure your images are NO WIDER than 570 pixels in the main frame and 340 pixels in the sidebar, otherwise they will spill out of the frames.

If necessary, you can resize images using custom CSS in wordpress: for example .img { width:200px; height:auto;} will resize to 200px width and maintain the aspect ratio (See the "About cIRcle" page). This will apply to all images on the page; you will need to target the tags more specifically if you have multiple different sized images.

Editing Styles in Wiki-Embedded pages

The majority of the style and layout seen on these pages in the WordPress site is through the custom CSS box in WordPress. If design/layout changes are desired, edit the code under "Custom CSS" on the wiki page editor. For new pages, it is advisable to copy the custom CSS from the most similar existing page and work from that.

Creating Drafts of New pages

For drafts of new wiki pages, you can add an automatic draft message by typing the word "draft" between curly brackets {{}}. You may also choose to use the Sandbox, particularly if the name or location, or content of the page is still in development and you prefer to have it approved before publishing.

Wiki issues & Troubleshooting

Copying and Pasting

From Word: Don't do it. Use Libreoffice, and select "export to wiki." This will result in a plain txt document that you can then copy and paste into the wiki. It does a decent job with wiki markup, but be aware that it will likely still need to be edited to get the formatting right.

Pasting is really, really buggy; it will often add extra line breaks, or remove all your line breaks. I found that copying text in, then selecting it all again and pasting on top of it sometimes worked to keep wiki from removing my line breaks. To my knowledge there is no ideal solution to this, but sometimes it gets it right, so refresh and try again if you keep getting the "line breaks removed" error. It may be necessary to manually go through and remove/add line breaks where necessary if nothing else works.

WikiEmbed Links

Links do not always behave correctly once pages are embedded in WordPress using WikiEmbed. To solve this:

1. Open the page you want to link to and copy the URL to your clipboard
2. Go to the Wordpress page you are linking from and click "in Wikiembed list" at the bottom (you must be logged in as an admin)
3. click "all"
4. browse through the list of links (you will need to mouse over them to see the URL) to find the one that is not working
5. click "Add Target URL" and paste in the correct URL. Note: this can appear to be identical to the one on the left; this is alright.

Wordpress Editing

Basic Editing

Use the WYSIWYG editor for basic text and page edits, it should work just fine. See below for editing forms and Policy Pages.

For wiki embedded pages, content must be edited on the wiki. In wordpress you should see a code that looks like this: [wiki-embed url="http://wiki.ubc.ca/Library:Circle/About_Circle" update="1440" tabs no-contents no-edit]

• the URL is the URL of the wiki page providing the contents
• update should be set to 1440 (24 hrs)
• specify "tabs" or "no-tabs" (see About cIRcle page for an example of tabs)
• specify "contents" or "no-contents" (see FAQ for an example of contents)
• pages should be set to "no-edit"

To view updates in Wordpress, you will need to click "refresh wiki content" at the bottom of the page.

Editing Policies Headers & Contents

The policy pages contents and headers are built in straightforward HTML. These should be added and edited using the HTML view in Wordpress.

To add a header and contents item;

1. copy an existing contents item and headline along with the accompanying HTML codes - you will want everything between and including the
2. tag for the contents items, and including and between the h3 tags for headers.
3. Paste these into the desired/appropriate locations, and then replace the old text with the new section title.
4. To create a new anchored link, replace the element after the # in href="#____" in the contents <a> tag with a new marker, and then;
5. replace the name="___" in the header <a> tag with the same marker.

These marker are currently capital letters, but can be anything and certainly don't need to be consecutive. So, for example, if you were to add a new section between section "K" and "L," you might use the marker "K1". Rule of thumb: copy and paste, try not to change too much.

Forms

Gravity Forms can be used to create online forms that site visitors can fill out and an email notification will be sent to the author each time a form is submitted.

cIRcle uses Gravity Forms for a number of different purposes. Our currently active forms are:

• cIRcle License
• cIRcle Item Submission Form
• Undergraduate Student Submission Approval Form
• cIRcle Content Proposal Form

See the Gravity Forms page for information on how to create forms, embed forms in Wordpress, or receive emails from forms.

To edit existing forms, choose a form to edit from the Forms page from the dashboard.

Archiving Forms

Gravity Forms in WordPress keeps database backups but data loss still might occur. To prevent data loss, form data should be archived twice a year. The first archive of form data (all time) occurred on July 31, 2013. Subsequent backups should take place at year's end or early January.

Instructions for archiving form data are as follows:

1. Login as administrator
2. Go to: Forms
3. Click on Import/Export on the left-hand side
4. Select the form you want to archive
5. Select all fields to export
6. Set the date range
7. Click "Download Export File"
8. Data should download to Excel.
   • Select the first column (click on first cell, click Ctrl+Shift+Down Arrow"
   • Select the Data Menu
   • Select "Text to Columns" (defaults should be set to "Delimited" and "Commas"
   • Save file to S:\Procedures\Records Management\Workflow Authorization Forms Archive

Advanced Editing

Use JIRA to request advanced changes through IT.