This document explains how to edit various aspects of the Exiles website.

Table of Contents

    Users

    Everyone related to the Exiles should have an account. Accounts can be found under the Users section of the site editor. When people join using the online membership form, they get a “Subscriber” role. 

    To give someone access to edit the site, change them from “Subscriber” to “Administrator”. Careful! This gives them the “keys to the kingdom” – they can do all kinds of things. 

    If someone was given their account before the new online membership form, they need to fill out the membership information before they can join or renew their membership. To do this, they need to do this:

    Pages, Events, News, Media

    Most of the content on the site is either a PAGE, an EVENT, NEWS, or MEDIA.

    Events

    Events are exactly that: things that are happening. These are the most common items to update on the site. Events that occur regularly are created as a recurring event, and are all the same except for the date, like programs, orientations, and business meetings. When you have specifics about an instance of an event, you “detach” it from the recurring event, and it becomes just a standalone event, and you can provide details. Events are assigned Categories so that we can treat different kinds of events differently. You can add/modify event categories by selecting Event Categories in the Event menu.

    The Past Programs page is a list of all of the events of type Program.

    Upcoming events automatically appear on the home page and the Future Events page.

    Recurring Events

    Events that repeat on a regular basis are “recurring” events. This is great to use to avoid a lot of work creating these events, but beware of them creating unwanted events.

    For example, when we take the recurring program event, entitled “Monthly Program, TBD” and make it into a “real” program, we detach it and edit it. This basically removes that instance from the recurring event. However, if you make any edits to the recurring event end date, it recreates everything prior. See this article for more detail. Because of this, DO NOT change the end date! Make a new recurring event.

    Pages

    A page contains either content and/or a list of events. The way to know the difference is if the content changes dynamically. For instance, the Past Programs page changes every time a program is in the past, while the Membership page is just content. The home page is a collection of lists. The next month’s program showing on the home page is a list of exactly one element.

    News

    News items are special. They appear on the home page in the upper right. They stay there until manually removed. Removing a category is done by changing it from News to OldNews.

    Media

    Any file that you want accessible on the site is of type Media. This includes images, PDFs, or any other file.

    How to Create a New Event

    Go to Events > add event. Fill out the event title and description in the main fields. Event date and time go into fields to the right. The Event location goes into a field lower down. Just start typing the name of the location in the Location Name field and it will come up if it is a saved location.

    Below the Location fields is the Excerpt field. All events should have a excerpt. Program events can also have a featured image, preferably 200px tall. When a program is coming up, the excerpt will show on the home page, and there will be a “more…” link to the full description of the event.

    Be sure to choose a category for the event from the sidebar menu. This is important to make sure that designated events show up on the front page. Hit publish and you are good to go.

    Programs

    Overview

    Programs are just events with the category of Program and Future Program. To make it appear correctly in the Past Programs list, also include the category for the year of the program. To add a picture, add a Featured Image (lower right). Ideal size is 300×200. If what you upload is too big, you can go to Add Featured Image (or Edit) and edit it from there, to scale it down.

    In order to make sure the program shows up in the Past Programs list, be sure you select the correct program year under Event Categories. For instance, if the program is in 2020, select “program2020”.

    To control what’s on the first page, include a summarized version in the “Excerpt” field.

    To show the standard program footer, include this global content block:

    [\\contentblock id=program-footer]  (in the “Text” view of the edit window, without the “\\”)

    Past Programs

    Before the first program of a year, you need to create a new section on the Past Programs page. Create it at the top, with the current year.

    Note that you need to include the “limit” part of the query, or it weirdly drops off some programs. Make it as big as is needed.

    Uploading Files (Media)

    All files are uploaded to the Media Library. That includes pdfs, docs, excel files and zip files as well as images. To upload media go to Media > Add New. Drag and drop files to upload them.

    For images only upload jpgs, gifs and pngs. Do not upload images bigger than 1mb. Images will be automatically resized into a couple of different sizes.

    There are a variety of header background images in the Media Library. To give an image the website “look” edit it in Photoshop. Use Adjustments > Hue/Saturation.

    Select Colorize, then Hue: 210, Saturation:15, reduce the lightness as much as needed to look right. If you are going to use the image as a background for the header section it should be in the range of -50 to-70. The header background is 1140px X277px.

    Pages

    A page is just that: a web page that is not an event or news or in any other category.

    To add a page, create the page by selecting Pages > Add New. To add that page to the menu, go to Appearance > Menus.

    Main Site Header

    How to change the header background image

    Find the url of the image you want by clicking on it in the Media section.
    Edit style.css in Appearance > editor.  Find the .site-header CSS and replace the background-image url, being careful not to disturb the rest of the code. It looks like this.

    .site-header {
    background-color: #76d2c5;
    background-image: url(https://theexiles.org/2015/wp-content/uploads/header_01.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    padding: 48px 48px;
    overflow: hidden;
    }

    Go to Appearance > Customize. Tag-line is in Site Identity. Logo is in Header Image.

    Main Section Front page

    To change what shows up in each section

    Go to Appearance, Widgets, then click Customize.

    To edit the content of an event–edit the content of the event listing itself, found in Events. To remove or re-order content, remove or re-order the widgets in Appearance > Widgets.

    Program listing: Edit the Event Manager widget called Events, found in Appearance > Widgets > Home-top Left.

    To add or delete “(program starts at 8)” to the listing, the code in the box in the Events Widget looks like this:

    CodeProgram8

    Simply insert or delete the code in red to comment out or show the line.

    Statement: To change the statement on the front page, go to Appearance > Widgets > Home Top > Text.

    Orientation listing: To change format, parameters or information edit the Event Manager widget called Events-Orientation, found in Appearance > Widgets > Home-Bottom Left.

    Business Meeting listing: To change format, parameters or information edit the Event Manager widget called Events-Business Meeting, found in Appearance > Widgets > Home-Bottom Left.


    To change format, parameters or information included in the full events list in the right column, edit the Event Manager widget, found in Appearance > Widgets > Home-Bottom Right.

    You can see the widgets on the sidebar by going to Appearance/Widgets, under Primary Sidebar. The top one is for News items, and the second one is for the Contact Us section.

    ScreenShotMore
    To edit the content of a sidebar item–edit the page that controls it. All sidebar items are called Widget-whatever-the-page-is.

    To make widgets in the sidebar appear or not appear on pages–change the visibility settings of each widget in Appearance > Widgets > Primary Sidebar.

    In order to not have the sidebar on a page, when you are editing the page, scroll down, below the text area, to “layout settings.” Choose the far right option.

    To add a new item to the sidebarcreate a new page. Call it Widget-Your-Page-Name. Add whatever content you want to appear. Go to Appearance > Widgets. Drag a Genesis-Featured Page widget from the left-hand column to the Primary Sidebar box, and place it where you want it to appear in relation to the other Featured Pages. Open your new Featured Page widget and type in the title you want to appear. Choose your page from the drop down menu. Check the Show Page Content check-box. Select Visibility to control which pages the sidebar content will appear on.

    To add a news item to the top sidebar–create a new post and assign it the “News” category. The News section is automatically populated with posts in the “News” category. To take down an outdated news post, just change it’s category to “Old News.”
    To add a read more link, put your cursor where you want the break and click the more icon or the more button, depending if you are in visual editing or text editing mode. The more and the link will be inserted automatically.
    ScreenShotMore2

    Connect with the Exiles section: To edit, edit page called Widget-Connect with the Exiles. The Join the Mailing LIst button goes to the Add to the Mailing List page, which contains just one shortcode which says to use Contact Form 7 (info about that here) using the “Add to mailing list” form. This can be found under Contact/Contact Forms.

    (Note that there is currently a bug here: Under “Mail” the From field is correct, showing the website address. But for some reason this isn’t working: you still see the Membership address in the actual emails. We worked around it by putting the Website email in the Reply-to, in the Additional Headers field.)

    Buttons

    To create a button that looks like the Click to Renew button, make a link and then wrap it in a div with the class renewbutton. Here is what the code looks like:

    Screen Shot 2015-11-29 at 2.38.17 PM

    Photo galleries are found in the “Gallery by Supsystic” plug-in, accessible on the bottom of the left nav. To embed a photo gallery in a page (as you see in our Photo Gallery page), use this code:

    “supsystic-gallery id=’1”’  (replace the double quotes with left and right square brackets)

    WordPress content

    You can access files that are part of the website back end using the cPanel (see link at the bottom of the page). The login name is exilessf. You go to File Manager to see everything. The location of the files we are currently using is public_html/new/wp-content/themes/lifestyle-pro.

    Go to public html/new/wp-content for other content.

    Plug-ins are located in wp-content/plugins.

    MEMBERSHIP

    Membership Special Fields

    Edit by going to Snippets>PMPro special fields. This contains different commented sections for customizing various parts, including:

    Testing Membership Pages

    There is a test member called Testing2, password Test12345678!!, which is tied to the membership@theeexiles.org email. This can be used to test out the member experience.

    There is another test member called Testing3, same password, which is a Supporting member, to test that out.

    Membership Card

    Basic customization of the card, especially the printout, is done in membership-card.php, which lives in “public html/new/wp-content/plugins/paid-memberships-pro/pmpro-membership-card/templates”. You find this by going to Linksky.com, then clicking on cPanel, then File Manager.

    This contains the customization of the name to use the scene name, and the placement of the featured image. The rest of the customization is in Snippets>PMPro special fields, at the bottom, as described above.

    The expiration date is calculated adding 366 days to the last order date. the Member Since date uses either the first year they joined (manually entered – for use before the online system), if it has been filled in, or the year they joined the online system.

    You can change the emails people get from the membership system by using the instructions here: https://www.paidmembershipspro.com/documentation/member-communications/customizing-email-templates/.

    A list of all of the customizable templates, and when they are sent, can be found here: https://www.paidmembershipspro.com/documentation/member-communications/list-of-pmpro-email-templates/

    Extra fields are not added via editing the templates: they are automatically added via code shown in pmpro-register-helper.php, which can be found in /home/exilessf/public_html/new/wp-content/plugins/pmpro-register-helper/, via File Manager in cPanel, accessible from Linksky.com.

    Other Sites

    There are a few other sites that support the Exiles’ web presence:

    Volunteer Signup

    This folder contains the form and the responses spreadsheet. It needs to be updated on a regular basis as events pass and new events are added.

    Email lists

    Documented in the Managing Mailing Lists google doc.

    EMail forwarding and other stuff

    All of the email addresses at theexiles.org are forwarders, meaning that they are not real email boxes, but just forward to email addresses. You access these using the cPanel, which is available by logging in to http://www.linksys.com. The login name is exilessf. Click on Forwarders.

    Google Maps (for event locations)

    In order to show locations of our events, Google Maps requires that we use something called an API Key. We have one registered to exilessf@gmail.com, which we got through this page. Our key is:

    AIzaSyDEUDskd138Ld_ttJy8N0_HGInQSBJMWmo

    This is entered onto our site under Events / Settings / Google Maps.

    The key can be managed through this interface (once logged in as exilessf):

    https://console.developers.google.com/apis/credentials?project=mimetic-cooler-241116

    In order to make the maps work, the associated APIs must be enabled. These can be seen here:

    https://console.cloud.google.com/google/maps-apis/api-list?project=mimetic-cooler-241116