Help related to viewing, creating and customizing Sites on the Commons.
Recently, Google changed the way it allows you to embed a Google Map. Now it requires that you set up an API key. At first it looks like you need to add a payment option when using Google Maps, but Google Maps offers $200 credit per month for free and you will not be billed unless you go over this limit.
API stands for Automated Program Interface. As Wikipedia notes, an API:
… is a way for two or more computer programs to communicate with each other. It is a type of software interface, offering a service to other pieces of software.A document or standard that describes how to build or use such a connection or interface is called an API specification. A computer system that meets this standard is said to implement or expose an API. The term API may refer either to the specification or to the implementation.
So Google’s API follows rules (or “specifications”) that other computer systems can hook into. In our case, the Commons (a computer system) is able to understand what Google’s API does and how to connect with it. Google Maps is a service which we (and any other computer system) can use if we follow the agreed upon specifications.
So Why Do We need API “Keys”
An API Key is a way to control the use of a service and monetize its use. The Google Map API, or any API, certainly is costly to build, and API Policies control how they are used. Academic sites such as the Commons are certainly not big Google customers and as long as hit to the API remain relatively low, the service is provided for free. But API keys are needed to track usage.
API Policies
Again from Wikipedia:
The main policies for releasing an API are:
Private: The API is for internal company use only.
Partner: Only specific business partners can use the API. For example, vehicle for hire companies such as Uber and Lyft allow approved third-party developers to directly order rides from within their apps. This allows the companies to exercise quality control by curating which apps have access to the API and provides them with an additional revenue stream.
Public: The API is available for use by the public. For example, Microsoft makes the Windows API public, and Apple releases its API Cocoa so that software can be written for their platforms. Not all public APIs are generally accessible by everybody. For example, Internet service providers like Cloudflare or Voxility, use RESTful APIs to allow customers and resellers access to their infrastructure information, DDoS stats, network performance, or dashboard controls. Access to such APIs is granted either by “API tokens”, or customer status validations.
The Simply Static plugin generates a static version of your website. It combs through your database and creates html versions of every post and page and creates a zip file that you can either use to archive your site or deploy on your server, a static host service or a CDN (Content Delivery Network). Static sites are extremely fast, since no database is used, and extremely secure. But they are static, meaning nothing can be changed. If you want to change something, you will need to go back to your dynamic WP site on the Commons and regenerate the zip file and archive it again, or redeploy.
So, for example, you can set up a free account on a service such as Netlify, deploy your zip file and have a free static version of your site up and running. Or you could decide the publish/archive your site on CUNY’s Manifold instance. Or you can just make a copy of your site as it was at a certain point in time.
As Simply Static is creating the static pages, it will automatically replace the URLs for the WordPress installation with either (a) absolute URLs, at a domain of your choice or (b) relative URLs, so you can host the static files on any domain or (c) URLs constructed for offline use, so you can browse the site locally on your computer.
Here is a screenshot of Simply Static’s dashboard.
The Rehabilitation Act was amended in 1998 by the U.S. Congress to require electronic and information technology accessible to people with disabilities.
Section 508 of the Act sought to eliminate barriers in information technology and give new opportunities to people with disabilities. It encouraged development of standards that federal agencies should use to develop, procure, maintain, or use electronic and information technology. Under Section 508, federal and local agencies must give people with disabilities comparable access to information that is available to others.
WCAG 2.2 is scheduled to be finalized in August 2023. More information is in What’s New in WCAG 2.2. (https://www.w3.org/WAI/standards-guidelines/wcag/)
The WCAG guidelines established standards to be followed by state and local governments to make web content accessible to a wide range of people with disabilities, “including blindness and low vision, deafness and hearing loss, learning disabilities, cognitive limitations, limited movement, speech disabilities, photosensitivity and combinations of these.”
When designing websites, the most common accessibility issues are
PDFs lacking OCR
Low Color / Contrast
Missing Alt tags on image
Content opening in new tabs
Lack of Captioning on Videos
Lack of transcripts for Audio content text surrogates
WCAG’s four principles for accessibility found in WCAG’s Quick Reference Guide. They are grouped under Perceivable, Operable, Understandable and Robust.
Read below for a quick overview of the guidelines:
Perceivable
This principle ensures there are alternative ways of accessing content.
Non-text content should have text alternatives so that it can be accessed via screen readers. If you have audio recordings, you should provide a text version that screen readers can access.
Video recordings should be captioned.
Web content should be organized so that it is easily parsed by screen readers. If content needs instructions to operate and understand, those instructions should not “rely solely on sensory characteristics of components such as shape, color, size, visual location, orientation, or sound.”
For those who are visually impaired, contrast is very important. A color scheme that looks great to you might not have the required contrast. Be aware that 1 in 12 men are color-blind and 1 in 200 women are color-blind.
Color should not be the only way to convey information.
If the web page has video, there should be an easy way to pause, replay and play.
There should be an easy way to increase font size.
Images should be added with “alt” tags so screen readers can explain what the image looks like.
People with disabilities should incur no loss of understanding or functionality due to scrolling.
Operable
Functionality should not depend on a pointing device. Keyboards should suffice to find content. Input fields should be accessed via tabbing.
Keyboard shortcuts should be able to be remapped, active only on focus, or simply turned off.
There should be no time limit in viewing content.
There should be no dynamic content that induces seizures.
Web pages should be titled to reflect content.
Headings and labels should accurately describe content.
Functionality used to access other parts of the site can be turned off if needed for screen readers to function.
Understandable
Web page should indicate the language used (i.e. “lang=en”).
Language should be understandable, free from jargon and unexplained abbreviations.
Content should be predictable: “on focus” and “on input” should not change the web context.
Navigation and components should be consistent.
Errors should show error codes and descriptions. Labels or descriptions should guide input. Suggestions should guide users to successful form completion.
Robust
Content should parse correctly, elements should have start and end tags, elements should not have duplicate attributes, and ids should be unique.
User interface components like forms, links and scripts should be able to be programmatically identified. Users can set states, properties, and values programmatically and notification of these changes should be available to user agents, including assistive technologies.
Users can develop audio and oral history projects on the Commons. As part of creating an audio-based projects, users will need to figure out where to host project audio files, and how the audio will be embedded and displayed on the Commons. There are two options for storing audio files:
If the project and audio files are relatively small, the user can host the audio on the Commons.
If the project will grow over time and/or the audio files are large, the user should host (store) the audio on an external website and embed the audio on the project website on the Commons.
The Commons platform has a 128mb limit per file upload. This means users cannot upload files that are larger than 128 mb. There are no exceptions to this rule. This restriction is set by the technical database limits and is not an administrative restriction. You may need to compress audio in order to be within these upload limits if you plan to upload your files to the Commons. Typically, in an MP3 file 1 minute of audio should equal ~1MB.
No matter where a user decides to host the audio online, the Commons team strongly recommends keeping a local backup.
Hosting Audio on the Commons
Users can upload audio to their sites’ media library. Audio can be embedded in a page or post using the “Add Media” button in the classic editor, or the “Audio” block in the block editor.
The Commons audio player is simple, with a playback bar and play/pause button. Sample below.
In the Linguistic Landscape project below, the project admin uploaded audio files to the Commons and used the built-in audio player.
When audio is hosted externally outside of the Commons, it means the audio file is stored on another platform and embedded into your Commons site. Hosting audio externally often has less space limits, and also means that the audio is backed up on an external platform. Be aware that free services can always begin charging for storage at any time.
Spotify for Podcasters offers free hosting (for now) and audio can be embedded on the commons in a similar manner to how commons hosts and displays audio. You can also embed audio from Spotify and SoundCloud but both require some form of payment based on your account.
You can also upload audio files to YouTube and embed the audio into the Commons as a Youtube video. If you upload audio to Youtube, you can also upload “cover art” for the video and this is what will appear as the “video” portion of the player as the audio plays. The file upload size limit on YouTube is 256GB per file.
See below for how various audio embeds display on the Commons:
If your project will be growing and expanding over time, you might also consider investing in your own server space from a web host so you are guaranteed to have stable, consistent storage for your project materials. If you are looking for an external hosting company, we recommend Reclaim Hosting (shared hosting starts at $30/year).
Introduction
The Hyperaudio Plugin can create transcriptions (or subtitles) from audio files and video files. It allows the viewer to skip to various parts of the text and immediately listen to the place where the cursor points.
If your audio file is very large, you can convert the audio to a video file using YouTube or hosting it on SoundCloud (proprietary) or Spotify Podcast (currently free).
Watch video to see how to convert audio files to youtube video:
Step One
There are most likely many ways to implement this plugin. In this example we will use YouTube and SavSubs.
First, we need to create the transcription file. The best format to use is SRT.
For YouTube conversions, go to https://savesubs.com/sites/download-youtube-subtitles
Fill in your YouTube URL and click on “Extract Links” for SRT file type (highlighted below):
You should see the following after clicking on Extract Links:
Click on the SRT box highlighted above and your file will be downloaded to your computer.
Step Two
Now that we have the transcript file in a SRT format, go to your site’s Dashboard and click on Settings>>Hyperaudio.
You should see the following:
Hyperaudio uses shortcodes to display transcripts. Please note the example highlighted at the top. Copy the example and paste the shortcode into your page or post. Click publish so that you do not lose it.
Next, you back to Settings>>Hyperaudio. Scroll down to the converter. This is where you need to paste your SRT file in order to get the hypertranscript that you need.
Open your SRT file in a text editor and copy the entire file into your clipboard. Then paste it the space labelled “Paste Here”. Choose SRT as the file format. Hit the Convert button.
At this point you can click on “Rendered View” and edit the transcription. You will probably want to capitalize the beginning word at the start of each sentence.
Next, go back to “Markup View” and copy the entire hypertranscript file to your clipboard and go back to your page or post where your shortcode was saved. Now you need to make the following changes.
Overlay the example’s “span” tags with your hypertranscript data that is in your clipboard. Be careful not to lose the tags at the end. You should just overlay the “span” tag.
Find the embed code of your YouTube video. Click the share button and copy the URL that is located inside the iframe code.
Past the embed URL into the src attribute on the first line of the shortcode.
Your shortcode is now complete. Click on update
Your should now see the results below:
[Music]
[Music]
welcome to ready get set a series of
five short videos designed to give black
and racialized youth and their families a better understanding of the justice system and how to navigate it this video
is how community supports can change
your outcomes delta family visor center consists of youth justice workers reintegration workers and also family counselors the roles are supported in black and also racialized youth and their families the team at delta is passionate about helping the youth and the families working by identifying each of their individual needs
community supports can make a difference in your outcomes with court they can help improve your outcomes by providing many specific supports that will show the judge that you are serious about changing your path community supports can provide you with the support letters which you can show to your lawyer as evidence that there are agencies and people who will vouch for you they can provide free programs which demonstrate your personal commitment to changing your behavior youth justice workers can refer you to the relevant services servers i mentor on your journey and be an important confidential non-judgmental
person you can talk to about your situation they can explain and guide you through the justice process tell you some of your options and support you and your family during this time they can provide free counseling and other supports for you and your family’s well-being as you go through this process some community agencies can also assist your family by providing short-term relief in terms of access to food and gift cards
other agencies include urban rest solutions for youth initiative think twice somali women and children network and also peace builders they provide support to youth by working closely with the family resource center
i’m chelsea from albia neighborhood services ans and i’m the youth balance prevention coordinator there we are really excited about our new partnership with the eu justice centers as we’ll be able to provide wraparound services to both the youth and their families who are experiencing core issues or legal matters through this partnership we will be able to provide satellite support for those who don’t have access to the physical court space or technology they’ll be able to do it right here at the hub
the northwest justice center understands that community supports are an integral part in assisting residents with navigating the justice system ultimately the goal is to reduce charges and provide a system that supports youth
and families in navigating these processes
luminous a community agency that is very visible in the courts assists youth and families to navigate and link to community support that are culturally relevant wrap around services to support
them with their needs
colvin makes internet access critical and we know that lots of families have been having challenges making appearances for court due to this issue
there are two locations which youth and
families can go to access virtual court
supports luminous located at their finch west location as well as alvia neighborhood
services which is located at the rexdale
hub
youth and families can go to one of the
two hubs and access
internet for court appearances find out information about their court case and
get supports from youth justice workers
and those assistants
he partners in this northwest justice
initiative include delta family
the justice center satellite locations
city of toronto justice for children and youth legal aid ontario and mental health and
social work services community supports can make a big difference when you’re in court so please make sure to check out all these valuable resources
this series has been developed by delta family with support from the ministry of the attorney general and partners delta family provides culturally relevant free youth justice and counseling services to black youth and families and has served diverse communities in northwest toronto for 40 years
The WPDiscuz plugin super-charges the way comments work on your WordPress site,. It enhances your users’ discussion experience and keeps them engaged by offering multiple ways to embed images, videos, social icons, and text. There are three colorful layouts to choose from:
The comment textbox comes with a toolbar for easily adding rich text and images. Roll over the icons to see what they do:
There are numerous powerful options and settings to explore that control the discussion environment:
On the Comment Content and Media Settings page, you can enable shortcodes and use them in your comment so you can, for example, embed a video.
The Easy Appointments plugin provides a way to embed forms and calendars within a WordPress site. The plugin uses three preset fields: Location, Service, and Worker. The labels for these can be easily changed. For example, Location could be changed to Office, Service could be changed to Meeting Type, and Worker could be changed to Professor.
The trickiest part of this plugin is set up what are called Connections. A connection pulls together the dates and time slots that are available for the particular Location/Service/Worker. In the form below, you specify what days of the week appointments are possible, the beginning and ending times, and the number of slots available within this time range.
To set up an appointment on your site, ,create a page and add a shortcode to generate the following form:
To avoid spam, you probably want to make the form only available to members of the Commons, or else password protected.
Another shortcode can display a calendar of appointments:
If you have posts or pages that are long, you might want to offer your readers a way to go up to the top of the article. Yes, if you know HTML, this can be done with an anchor tag. But the Simple Scroll To Top plugin makes such a function a breeze.
Once you activate the plugin, go to the Settings page. Here you can customize where the button will be shown and what it will look like. There are 10 symbols and 4 backgrounds. They are all from the FontAwesome library, so there are 40 variations for your scroll to top button. You control the size and color and on which pages it should appear. The button only appears when your reader is scrolling down. This is extremely useful if your reader is using a tablet or mobile device, where scrollbars are less than effective.
Here is the setting page:
Each WordPress post or page has exactly one “Featured Image.” Depending on the template used by your theme, this image may appear at the top of your post, on the side, or not at all. On a page that aggregates your posts or pages (perhaps by category or tag), the featured image adds interest to the listing. If missing, it throws off the appearance of the page.
That is where the Default Feature Image plugin can be useful. If a page or post does not have a featured image, a default image will be assigned.
The default image is set up in the Media Settings on the WordPress dashboard:
