George Mason University Antonin Scalia Law School

Emergency Alert Message

In case of an emergency, we have implemented an alert message that would appear on every page at law.gmu.edu. Here’s an example:

To Activate the Emergency Alert Message

  1. Log into MODX Manager, navigate to the Emergency container (id#12996), and open up the Emergency Message resource (id#12996).
  2. Go to the Template Variables tab, select the Uncategorized tab on the left. Write an emergency alert message in the Content2010 box, which is the first box. Return to the Document tab, click on the Published button, then hit the Save button.
  3. Search for the 2012_template_top chunk, scroll down to this line (around line 29):
    [[-getResources? &parents=`12995` &depth=`1` &tpl=`emergency_alert` &tvPrefix=`` &includeTVs=`1` &limit=`1` ]]
    Remove the first hyphen (-) to activate GetResources. (Because we hardly used this emergency alert message, activating this snippet might affect the site performance when we are not using it)

To Deactivate the Emergency Alert Message

To deactivate the Emergency Alert Message, simply unpublished the Emergency Message resource (id#12996). Comment out the GetResource snippet (by adding the hyphen back into the 2012_template_top chunk) is not required, but a good practice to prevent an extra dynamic call.

CSS Style

CSS style for emergency alert can be modified in the emergency_alert chunk.

Layout Guides for the Law School Main Website

Here are some quick layout guides for the main law school website.

To create a simple button (see visit campus page), add the button class.

<div class="button">
	<a href=""></a>
</div>

To create three buttons in three columns with three different colors (see homepage), add grid3 and color-buttons classes:

<div class="grid3 color-buttons">
	<a href=""></a>
	<a href=""></a>
	<a href=""></a>
</div>

To create four boxes in four columns with four different colors, (see homepage), add grid4, color-buttons, and boxes classes:

<div class="grid4 color-buttons boxes">	
	<a href=""></a>
	<a href=""></a>
	<a href=""></a>
	<a href=""></a>
</div>

For a two-column layout (see the top of the People Finder page), use the grid2 class:

<div class="grid2">
	<section></section>
	<section></section>
</div>

For a three-column layout (see contact information on the Records Office page), use the grid3 class:

<div class="grid3">
	<section></section>
	<section></section>
	<section></section>
</div>

For a four-column layout (see icons on the Career page), use the grid4 class:

<div class="grid4">
	<section></section>
	<section></section>
	<section></section>
	<section></section>
</div>

For a two-column layout with one column takes up two-third of the space (see JD Admissions page) , add span2 class on that column:

<div class="grid3">
        <section></section>
	<section class="span2"></section>
</div>

For a two-column layout with one column takes up three-forth of the space (see the footer link and social media link at the bottom of the footer) , add span3 class on that column:

<div class="grid4">
	<section class="span3"></section>
	<section></section>
</div>

To add icons for the second level pages (see Admissions landing page), use the icons24 (24 is the dimension in pixels that all the icons were downloaded) class:

<div class="grid3 icons24">
	<a href=""><img src="" width="50" alt=""></a>
	<a href=""><img src="" width="50" alt=""></a>
	<a href=""><img src="" width="50" alt=""></a>
</div>

How to Connect Google Sheets to Contact Forms

After creating your form, click on the Google Sheets tab:

 

 

 

On your Google Drive account, create a new Google Sheet. Save it as something memorable.

You will need to grab the name of the sheet, the Google Sheet ID (directly from the URL of the sheet), and the Tab name (default is Sheet1).

Paste it in the fields below:

 

 

 

 

Once you have that, map the column names to the form field names you’ve chosen for your form. Pay close attention to the order of the field names. As you go down the form grabbing names, you need to paste them into the first row, moving from column to column, left to right.

Examples of the fieldnames below:

 

 

 

 

 

Test your form first to make sure the data is being pulled into your Google Sheet before releasing the form.

Setting up an RSS Feed Parser in MODX

MODX uses an add-on called getFeed to parse RSS content.

In order to use it, place this code on your page template (example uses the Faculty News Feed):


[[!getFeed?
&url=`https://sls.gmu.edu/faculty-news/feed/`
&tpl=`RSSFeedParser`
&limit=`1`
]]

The code pulls the RSSFeedParser, a custom chunk we made that pulls the most recent article title and link.

Titles are pulled using:

[[+title]]

Links are pulled using:

[[+link]]

Here is a list of other data fields that may be pulled from the RSS Feed, if available:

  • title – The title of the post.
  • link – A direct link to the post.
  • description – The description of the post.
  • pubdate – The date the post was published.
  • guid – The GUID of the post.
  • author – The name of the author of the post.
  • category – Any tags or category associations the post has.
  • summary – A short summary of the post.
  • date_timestamp – The timestamp of the post.

Like most MODx variables, wrap the data fields with double square brackets, but be sure to use the + sign prefix rather than the * symbol.

Full-Time Faculty Table

The Full Time Faculty Table implements one ditto that calls two separate chunks.

The chunks are:

ditto.people_finder.odd.tr.2018

and

ditto.people_finder.even.tr.2018

The structure of both dittos are the same, with only the row background color being different using the existing even and odd classes within the main style sheet.

When calling the ditto, filter the results using:

&parents=`5842,1794`

This sorts the list based on Faculty Type.

When adding fields use the + sign instead of the usual *, so to add the professor’s title, it would look like this:

[[+title_main]]

To integrate a link, use this format:

<a href="mailto:[[+email]]"">[[+email]] </a>

Main Site Top Navigation Bar

Assigning new pages to different sections of the site are done within the resource itself under Template Variables.

However, adding sections to the Top Navigation Bar requires manually editing a Chunks within MODX.

To add a new Admissions Program to the Admissions section, for example, Navigate to Elements, select Chunks, then Navigation, and select the nav_admissions chunk to manually add the page. Be sure to use Resource IDs in place of the URL.

Trouble Viewing Published Material on MODx?

If you’re making an edit to an existing page that has been unpublished in the past, be sure to take an extra look at the “Hide Template Variables on Output” field.

The field is located under most page templates under Template Variables -> Templates – Default TVs:

It varies, but the field in most page templates can be found at the very bottom of the page:

 

A Template Variable or TV, is simply what MODx calls a custom field found in page creation forms. When this field is set to “Yes” and the page is published, no content will be viewable.

This field is set to “No” by default and should not be a problem when creating new content.

 

 

Upgrading to PHP 7

This guide is for CentOS Linux systems running PHP 5.3 and up.

Start by logging into WHM and making sure the server is on Apache 4. Use EasyApache 4 to upgrade if necessary.

To upgrade PHP 7, SSH into the server and download Remi and EPEL Repository:

$ wget -q http://rpms.remirepo.net/enterprise/remi-release-7.rpm
$ wget -q https://dl.fedoraproject.org/pub/epel/epel-release-latest-7.noarch.rpm

Enable the respositories:

# rpm -Uvh remi-release-7.rpm epel-release-latest-7.noarch.rpm
FOR PHP 7.0 EXECUTE:
# yum-config-manager --enable remi-php70
FOR PHP 7.1 EXECUTE:
# yum-config-manager --enable remi-php71

Then upgrade to PHP 7:
# yum update

Events Planning Form Using Javascript

A short questionnaire to direct users to the right form using Javscript
window.onload = function() { document.getElementById('link1').style.display = 'none'; document.getElementById('link2').style.display = 'none'; }; //Clears div box

var x, y, z; //assigns variables to radio selections

function a1(answer1){ x = answer1; };
function a2(answer2){ y = answer2; };
function a3(answer3){ z = answer3; };

//if all answers are no, display link2 and hide link2; if any answers are yes, do the opposite.

function showdiv() { if (x==1 | y==1 | z==1){ document.getElementById('link1').style.display='block'; document.getElementById('link2').style.display='none'; } else { console.log("None of the questions is 1"); document.getElementById('link1').style.display='none'; document.getElementById('link2').style.display='block'; } return; }

//How to structure your HTML to code. Onlick assigns value to x,y,z variables

<input type="radio" onclick="a1(1)" name="q1">Yes
<input type="radio" onclick="a1(0)" name="q1">No

//execute code
<button onclick="showdiv()">What Form Do I Need?</button>

//hide show divs using IDs
<div id="link1">
Link 1
</div>
<div id="link2">
Link 2
</div>