So you want to build/edit a miis.edu page with Drupal? Here’s a brief overview to help you get started. Enjoy! [By Jeremy Borgia]
Need help? Make an Appointment at the DLC!
Are you a visual learner? Click the links beside each heading for a YouTube video that takes you through this training.
Logging on to Edit Mode
(Watch video)
Navigate to the miis.edu homepage, and scroll all the way down. Click on “Log On” in the bottom left.
Once you are logged in, you should see a new bar at the top of any page you have been authorized to edit.
If you do not see this, please contact Evelyn Helminen.
You will also see “Edit” links below content nodes on the page and in the sidebar
Back to top of page
Adding a New Page
(Watch video)
To create a new page, you will make it as a sub-page. First, navigate to the page you want to serve as your new page’s “parent.” You can think of this in terms of the sidebar navigation or the URL:
- Sidebar Navigation:
In the sidebar, you will see the tree of pages related to the page you are on. For example, at miis.edu/academics, you will see in the sidebar all of the sub-pages of that page (e.g. Academic Calendar, Courses, Faculty, etc.). Make sure you navigate to the parent page where you will want your page to appear in the sidebar
- URL:
Another way to think of sub-pages is to consider the URL. Sub-pages are found after the parent page in a URL. For example, our academic calendar page is a sub-page of our academics page. Thus, the URL is miis.edu/academics/calendar
Once you have navigated to the proper parent page, select “Add Sub-page” from the top bar.
You will now see a form to create your new page.
Insert a title for your page. (NOTE: This title will be visible in the sidebar and may appear across the top of the page, so please use a clear and concise title, and ensure that it is properly spelled and capitalized.)
Below your sparkly new title, you will see that a new URL has been generated for you. You can edit the URL by selecting “edit” to the right of the URL.
Edit this as needed to ensure that the URL is concise. (e.g. “joint-mba/ma-international-policy-and-development-program” has been shorted to “business-policy”. Ideally, URLs should have one or two words, joined with a hyphen instead of a space).
If you want to leave your new page hidden for now, you can hide it from the sidebar by selecting “Menu and layout” on the left and checking the top box for “Don’t show this page in the menu“. This is particularly useful for hiding your page while you continue to edit. (Please note that hidden content is still searchable. If you are developing sensitive content that needs to remain unpublished, please contact the web team [Melissa Sorenson or Evelyn Helminen]).
Now scroll to the bottom to find & click the “Create sub-page” button to finish your new page.
You will now be directed to your beautiful new sub-page. Before we move on to add content, double check that your title is correct and that in the sidebar your sub-page has (hidden) next to it, if you chose to hide your page.
Back to top of page
Adding/Editing Content
(Watch video)
***Our comprehensive Search Engine Optimization & Web Content Guidelines***
Congratulations on creating your page. However, with no content on it, you must admit it’s pretty boring and useless. Let us charge on and add some content!
On your page, you can begin adding content by clicking “Add content” (as circled in the above picture) or by selecting “Add” under “Content” in the blue section of the top toolbar. This displays a list of available nodes that you can add to your page.
Select the node type, “Basic Content.”
Back to top of page
Adding a Title & Heading
Insert a title for your node. If your page is using a large banner image, the page title will be displayed at the top. Often the page title and the node title will be the same; if you don’t want your title to appear twice, put [brackets] around your title.
(This is what your page might look like if you choose to NOT hide your title on most pages. Your page title will appear at the very top and your node title will appear at the beginning of your content.)
Back to top of page
Adding Text
In the “Opening Paragraph” section, place a short introduction (1-2 short sentences). It is automatically formatted to be larger, gray text.
The “Body” section is where you will likely spend the bulk of your efforts. Organize your content carefully so that viewers will be able to easily locate information. One easy (and crucial) way to do this is to add headings. To do this, select the drop-down menu that says “Paragraph” and select the proper heading.
As indicated in our SEO & Web Content guidelines, be sure to make your headings clear and descriptive. For example, if you were making a page about housing, rather than writing just “Housing” as your heading, perhaps you could write “Housing in Monterey.” Search engines take cues from heading text. So, being clear and concise in your choice of headings will improve MIIS’s search engine optimization.
The headings will pre-format your text in the following ways:
Note: you will likely only use the 2 & 3 headings.
When you write your content, be aware that search engines also give special emphasis to text (read, keywords!) that is underlined, bold, or italicized.
***When pasting text, please paste without formatting. This strips the text of any formatting (font, size, links, etc.) from the original source, so the text will conform to the MIIS site’s template. You can do this from the toolbox by selecting the “Paste as Plain Text” button.
NOTE: When pasting with plain text, you will need to ensure that you re-hyperlink any links.
Sidebars
You can also add text to the “Sidebar” section, which will appear on the right side of your content and will automatically reflow the body content around it.
Note: Sidebars are different from the navigation on the right-hand side of the page.
Once you’ve added the desired content, click “Save”
Example
Here’s what my new content looks like (red boxes have been added for instructive emphasis):
Back to top of page
Adding a Table
(Watch video)
You can add a table in order to better organize the content on your page. See the image below as an example from a real, live MIIS page that uses tables to organize its content.
***The author of this page used tables to organize the content into two columns.
To add a table, navigate to the section in which you want to place a table (body or sidebar). In the toolbox, click on the “Insert/Edit Table” icon.
In the window that opens, select the number of rows/columns you would like to include in your new table. Click “Insert.”
If you need to edit an existing table, you can use this same process, ensuring that your mouse cursor is in the table you would like to edit.
When your cursor is in the table, you will be able to use shortcuts to add or remove rows or columns:
Insert Row Before: 
Insert Row After:
Delete Row:
Insert Column Before:
Insert Column After:
Delete Column:
Back to top of page
Adding Hyperlinks
(Watch video)
You can go back into “edit” mode by clicking “Edit” underneath your content.
Select the text that you would like to format as a hyperlink. (NOTE: Use intuitive keywords as a hyperlink, rather than using “Click Here” or something similar. For example, rather than “Click Here for more information”, use “Learn more about the Digital Learning Commons.” The use of “Click Here” will harm our SEO.)
Once you have highlighted the text you would like to hyperlink, click on the hyperlink icon
In the dialogue box that appears, place the hyperlink in the box beside “Link URL.” (IMPORTANT: Ensure that you place the entire link, including http:// or https:// to avoid broken hyperlinks).
If you are linking to an outside website (not MIIS), open the dropdown menu beside “Target” and select “Open Link in a New Window.” If you are linking to a MIIS site, you can leave it alone.
In the box beside “Title,” write a clear and concise title for the page you are linking to. (NOTE: This will be visible on the site, so double check your spelling and ensure proper capitalization!) The title is the text that will appear when viewers hover over the link, and it is used in search engine optimization.
If you have added a link to a YouTube video, open the dropdown menu beside “Class” and select “Open Video Overlay,” which will open the video on your page rather than redirecting users to YouTube.
Click “Update” to save your hyperlink. You can test the hyperlink after you save the page in the editor and are returned to the live site.
Back to top of page
Adding Pictures/Media
(Watch video)
***Some of the processes to add pictures/media involve navigating to other pages. PLEASE make sure you save your work before navigating away. Forgetting to save=sadness and misery.***
Adding images to your website is a great way to make your page more interesting and dynamic. Depending on where you want to place an image, there are a few different processes you can use.
Uploading an image, PDF, or other file to MIIS Files
If you are uploading an image, please resize it before uploading it. When large pictures get uploaded, it negatively affects your page’s load time, which negatively effects our search engine optimization. You can resize your image using a variety of free services. For now, let’s use PicMonkey. Click on “edit,” then find and select your image. Choose the “resize” option, and choose a new width (NOTE: it will automatically change your height to keep the picture proportionally correct). Hit “Apply,” click “Save,” and then “Save to my computer.”
Sizing Rules
In General, use these sizing rules:
- Profile pictures in the body of a page: 150×150
- Profile pictures for the upper left corner on a profile page: 215×300
- Upper-right images: 238×350
- Top banners: 720×250
- Research Center Banners: 960×290
- News Story photos: 640×480
In order to upload an image, PDF, or other file to the MIIS site, first go to “Files (hidden)” on the far right navigation sidebar. This should be under the parent page of the sub-page that you are working on.
Once you have navigated to “Files (hidden),” go to the top edit bar and hit “Add” under “Content.” Then select the content type “File Upload.”
Select “Choose Files,” and select the file(s) that you would like to upload. Hit “Choose” and then “Upload.” Your files will load with the title automatically set as the name of the file. Please enter a clear and concise name for your file that is spelled and capitalized correctly. Ensure that your title will easily identify the file, as you will need to locate it later.
On the right, enter a caption if you choose. (NOTE: If you plan to use the image in the upper right-hand corner of the page, the caption will display, but in most other cases it is not necessary to add a caption because it will not show up. The exception is for top banner images. Contact the Web Team for help with banner images.)
Hit “Save.”
You will now be redirected back to Files (hidden). But wait! What is that at the top of the page? Your file! Don’t you feel fancy?
There are three places you can place an image:
- Upper right-hand corner (Selected from the drop-down menu)
- Body Section
- Sidebar
Back to top of page
Adding an Image to the Upper Right-Hand Corner
This process assumes that you already know the name/location of the file you want to insert. If you do not, you will need to either refer to the Uploading an Image to MIIS Files section to upload a new file or locate your file in the “Files (hidden)” sub-page.
This process allows you to insert files to your page that already exist in MIIS’s files. Note from the picture above that this process will always put your image in the top right, and will always include any caption associated with the image. This placement does not give you control over the placement or size of the image.
When in “edit” mode for your page, locate the dropdown menu titled “Add Image” after the “Body” section. Find and select your chosen image name. Scroll to the bottom and hit “Save.”
Back to top of page
Inserting an image into the body or sidebar of your text
Navigate to the section in which you want to insert an image (body or sidebar). In the toolbox, select the button with the mountains.
***If you need to upload the image, please refer to the Uploading an Image to MIIS Files section***
A window will open with a navigation tree of the MIIS site. Navigate to your image and select it. If you uploaded the image to the Files (hidden) of your sub-page, you must find your subpage (remember, you can follow the breadcrumbs of your URL, i.e. miis.edu/academics/programs/mba will be under Academics, then Programs, then MBA.)
Make sure there is an appropriate Title and Alternate text, and choose Full Content from the Style drop-down menu.
Click “Insert.”
(***NOTE: If placing an image in the sidebar, double check that your image isn’t too big. Save your edits and check that your image isn’t spilling outside of the sidebar. If it is, go back to edit mode and resize. It should be no wider than 238 px.***)
Back to top of page
Linking a PDF
To add a link to a PDF on your page, treat it like you would an image.
Navigate to the section in which you want to insert the PDF (body or sidebar). In the toolbox, select the button with the mountains.
***If you need to upload the PDF, please refer to the Uploading an Image to MIIS Files section***
A window will open with a navigation tree of the MIIS site. Navigate to your PDF and select it. If you uploaded the PDF to the Files (hidden) of your sub-page, you must find your subpage (remember, you can follow the breadcrumbs of your URL, i.e. miis.edu/academics/programs/mba will be under Academics, then Programs, then MBA.)
Make sure there is an appropriate Title and Description. Click “Insert.”
The PDF icon with a hyperlink to the PDF will automatically appear.
Congratulations! You are now the (hopefully) proud owner of a super-legit webpage!
Back to top of page
Questions?
If you have more questions, feel free to come in to the DLC. We’ll be happy to help.
