Skip to end of metadata
Go to start of metadata

We have setup your new site and have installed the Franklin Air Theme. This site is pre-loaded with some dummy information. There are several areas you will want to update in addition to creating your own pages and removing the dummy pages. This document will walk you step-by-step through the process.  We are not able to offer you hands-on direct support. There will be links in this document for you to reference if you need more help.

Important notice regarding data backup and recovery

Icon

Franklin OIT takes a nightly snapshot of the entire Faculty and Research Lab server in its entirety in the case of catastrophic drive failures. These backup copies are only meant to be used for system wide recovery. Franklin OIT is not able to restore content from a single faculty or research lab site.

Before you make significant changes to your site, we recommend you save down a copy of your site locally for reference purposes in the case that you delete or alter content accidentally. You will be able to view your site offline with the local copy to find material you may have deleted or altered before the change. You will have to manually copy and paste the previous content on your live site but at least that provides a small safety net for you.

For directions on how to make a local copy of your site, please view our instructions.


How-to Guide for making changes to your site.

Terms used in this guide:

  • Drupal: a content management system that makes creating and editing a web site as easy as filling out a form.
  • Content Type: specialized form that turns raw data into a display.
  • Responsive means the content will resize when viewed on a small screen (mobile) device.
  • The header area refers to the top of the page where the logo, the site name and slogan are displayed.  The main menu is often found here too.
  • The most popular web design trend over last couple of years is a series of sliding horizontal panels also known as a Slide Show, Sliders or Carousels. It's a very effective method to increase the web site usability and engage the user with imagery or targeted messaging.

  • Block: A box that can display an image, text content or a menu.  Blocks can be placed in different Regions which are areas that are defined in the site template.

  • Unpublish:  Synonymous with disable, this is the best route to take when you want to remove content from a site.  Although they appear in several options throughout the site, delete and remove are permanent and cannot be undone.

  • View: a component of Drupal that creates displays for a variety of content (e.g. the Slide Show which is displayed in a Block).

 

Login in to your site.

 

Attention

Icon
The URL to manage your site should have been sent to you in an email. Please refer to that e-mail to get the link to your site.

To manage your site append /user to your URL.

Your user name is your MyID (the same as your Athena ID) and your password is the password you use with your MyID.

Changing how things look.

Appearance Settings (click to enlarge)

Icon

The chart below lists and provides a brief explanation of the Appearance options available in this theme.

Changing things in the header area.

Changing/Adding the Logo or Header Image

Icon

We have placed a temporary header information at the top of your page for demonstration. It consists of a logo image, site name and site slogan. You will need to replace this information with your own or disable these features.

 

Replacing or Removing the Logo (header image)

You do not need to use an logo in your header. You have a choice of removing it altogether or replacing it with an logo of your choosing.

The recommended size range for a logo: minimum 60 by 60 pixels maximum 100 by 100 pixels. We recommend using a png, gif or jpg file (the png format retains a transparent background). Larger images may be placed here but the placement of the site name and slogan, eventually the main menu will become problematic perhaps even unsustainable.

To access the area where you change the logo, click the "Menu" button (upper left) which will expand the menu then click "Appearance."

Now click "Settings" next to the Franklin Air (STARTUP GROWTH) Theme.


Scroll down slightly on the settings screen until you come to a "Logo Image Settings" section.  See Image below:


If you want to remove the logo uncheck the box for Logo under "Toggle Display" and then click "Make It So." When the icon is removed the text (site name and slogan) will move all the way over to the left. You can go back to your homepage and reload the page to see the change. Changing the text is handled in a different area of the site and will be detailed in the next section.

If you want to replace the icon, uncheck the box "Use the default logo" under "Logo display settings." Click the "Choose File" button which appears under "Upload logo image." Find the image you want to use from your computer and choose it, then click "Open". Click the "Make It So" button at the bottom of the page. You should now have your own logo on the site. You can go back to your homepage and reload the page to see the change.

Changing the header text

Click "Configuration" from the Drupal administration menu,

then click "Site Information".


The section at the very top of this next page called "Site Details" is where you will edit the text (site name and slogan) for your header. Replace the text under Site Name with your name, name of your project, or name of your lab or whatever you want the first line of the header to say. Replace the text under Slogan with your Department name or Affiliation or whatever you want the second line of your header to say. You can leave e-mail address as is, or change to your own e-mail address. This field isn't really used in this particular site configuration.

Make sure to click "Make It So." There is no need to change any other settings on this page. You can go back to your homepage and reload the page to see the change.

If you want to remove any or all of the header text return to the Appearance > Settings page and uncheck the box for the header text (site name or site slogan) that you wish to remove. Go to the bottom of the page and click "Make It So."

Changing images on the site (direct file upload).

We have preloaded the site with five slide images (the maximum number allowed) and a series of other images to demonstrate various elements in the theme. You will want to replace or remove these images and add images of your own.

Changing images in the slide show

Icon

Editing Existing Slides

Slides are simply pages specified as the content type "Slide". Click on "Content" in the Administrative menu. See image below:

You will see a list of all existing pages in the site. A handy way to isolate just the Slides is to Filter the Content Type list by selecting "Slide" from the pull down menu.

 

Those are the slide images you can change.

Click the "edit" link next to one of the slides.

Change the Image

Scroll down to the area for Image. See image below:


 

Remove the existing image by clicking the "Remove" button. The "Remove" button will be replaced with a "Browse" button. Click browse, find the image you want to use, and then click "Upload". Make sure to click "Save" at the bottom of the screen after you upload.

 At this point if you would like to add a link to the slide simply fill out the two fields (title and URL) under "Slide Link."

Manage Site Pages

We have pre-loaded your site with several dummy pages that seem to be the most popular pages on faculty web sites. You can delete these pages and add new ones, or you can use them as is, and just edit the content on the pages.

Editing an Existing Page

After you login to your site, you can edit the content on any page by viewing the page within your browser as if you were a regular user, and clicking the "Edit" tab. See Image below:


After you make the changes to the page that you want, click Save.

You can also click "Content" from the Drupal admin menu. Just look for the page you want to edit in the pages listed (don't forget the filter option if you know the content type).


Delete an existing page

To delete an existing page, click "Content" from the black menu bar. See image below:

Then click "Edit" next to the page you want to delete. See image below:

 

 

Once you are in the "edit" mode, scroll all the way to the bottom of the page and click the "delete" button. See image below:

Now the page is deleted. 

 

Add a New a Page

To add a new page, click "Add Content" from the Drupal menu. See Image below:

     

Then choose the Content Type that you wish to add, in this case,  a Basic Page.  Enter the information in the appropriate fields (just like filling out a form) and save.

This tutorial will walk you through the process of editing and adding a new Basic page if you need additional assistance (the menu will look different in the video because a different theme is in use):

https://www.youtube.com/watch?v=JFbHGBhWk8M 

Content Types Available

Content Types

Icon

The chart below lists and provides a brief explanation of the Content Types available on your site.

Adding Images or Documents to a Page

There are several steps to adding an image or a document to a page.  Please follow these steps outlined below.

Step 1 Deciding where you want the image or document link to go

When you are in the "editing" mode for a page, place your mouse cursor where you want an image or document link inserted. 


Step 2 Opening the (IMCE) file browser

Click the button that looks like a picture frame. See image below


Step 3 Adding an image or document to the file browser

A file browser pop up will open. Click the "upload" option in the file browser. See image below:

Step 4 Finding the image or document on your computer that you want to upload

Clicking "upload" will bring up a box where you browse to find the image or document on your computer. See image below:

 

Click Browse and find the image/document on your computer. If you are uploading an image,  I recommend choose the checkbox for "large" to have the system automatically create a smaller size image for your page. 180x180 is a pretty good size for an image embedded in a web site. If your original image is exactly the size you want it, you do not need to check any of the thumbnail options.
Next click "upload".

Next click "UPLOAD".

Step 5 Inserting the image or document you just uploaded

After you upload the file, the file browser will show you the image/document you uploaded in the file list highlighted Blue, and if its an image, the preview of the image you uploaded. To insert that image  or document into your page, click the "Insert File" button at the top. See image below. An image upload will show the image but a document upload will just show a linked filename. You may want to change the text that is seen on the page from the file name to a more common sense phrase or word. 

Step 6 Save your page with image or document

Then you will be taken back to your edit screen and you will see the image or document link placed in the page where you had placed your mouse cursor. See image below:

 

Step 7 Add Alternative Text Tag if you uploaded an image

New laws require you make your Website accessible. One aspect of creating an accessible site is to label all images with descriptive text that screen readers will read to visually impaired users. To add an alt tag to your image, "right-click" on the image while you are still in the "edit" view of your page. Then choose "image properties".  See image below

Then on the Image Properties pop up, enter a description of the image as if you were describing it to a friend that wasn't looking at it. See image below:

Click OK.  Then make sure to save the page with the newly inserted image. Click the "save" button at the bottom of the page.

The News page (article content type)

This page is a list of the content type called "article." To add content to this list, make sure you are logged in, then go to "add content" and select "article."

     

When you save the content, it will appear on the news page.

If you want to edit content listed on the news page, click on the title of the content and then click on the "edit" tab.

The image below shows the types of fields available in the Article content type:

Organizing the Menu Structure

When you create a Basic page (or any other content type) there is a section at the bottom of each page where you may configure the page to appear in a menu. See Image below:

The checkbox/radio button for "Provide a menu link" is not checked by default because sometimes you may want to add a page that doesn't show up in the navigation (main) menu.

To have your Basic page appear in a menu click the checkbox/radio button.  The Menu link title will automatically be set to whatever you have entered in the Title field in at the top of the Basic page form.  You will need to choose the parent item (which menu it will appear on). If you are trying to create a top level page, leave it as <Main menu>. That will place the page name in the top navigation bar assuming you don't have too many pages listed already. There is a limit to the number of pages you can have in the top level bar, the limit varies with the length (in characters) of your menu items. If you want it to be under an existing page, choose the page it belongs under. This new page will then be listed in the left hand navigation panel when you navigate to the page you placed it under or any other page under that same parent.

Dealing with Blocks (and Regions)

Working with Blocks Created by a View

Region settings

Several items displayed on your website are in Blocks which are created by a View.  The easiest way to move or remove these items is to edit the Blocks on your site. As an example, let's go through the process of turning off the Slide Show on the front page.

First, use your mouse to hover over the upper left corner of the Slide Show on the front page:

Click on the "Configure block" that appears under the cog:

Now you will see the configuration window for the Block.  There are two things to note, the Region settings and the Pages section:

In the pull-down menu for "Region settings" choose "None."  This will  remove the  Slide Show from view without deleting it (often a bad thing to do).  The same method will also let you change the Region in which the Block is displayed.

Pages

If you still want a Block to be seen, this section allows you to set which pages on your site a Block is displayed on.

 

Working with Blocks not Created by a View

There is a very quick way to edit the contents of a Block which is not created by a View (Blocks created by Views start with "View:" when seen on the Block list or when you open the Block configuration).

First, use your mouse to hover over the upper left corner of the Block (e.g. Contact Information):

Click on the "Configure block" that appears under the cog:

Now you will see the configuration window for the Block.  There are three things to note, the Block body, Region settings and Pages.

Block body (content)

This is where you may change, add or remove text and image content using CKEditor.

Region settings

This is where you may change the Region a Block is displayed in.  Choose "None" to keep a Block from being displayed.

Pages (where the block is displayed)

If you still want a Block to be seen, this section allows you to set which pages on your site a Block is displayed on.

Regions

This generalized diagram displays the relative location of the Regions available in this theme. The Region names are in parentheses, several elements of the site are in the Region in which they appear.