Middlebury

Difference between revisions of "Editing in Drupal"

(RSS Feed)
(Pasting from Word)
 
(36 intermediate revisions by 5 users not shown)
Line 21: Line 21:
 
</ol>
 
</ol>
  
= Editing Interface =
+
= The Edit Console =
  
There is currently the option to choose from one of two editing interfaces, the "old" editing interface, and the "new" editing interface. In order to enable the new editing interface click the link in the old edit console that says "Try the new Edit Console". At the next page check the check box for "Use the new Edit Console" and hit the "Save" button at the bottom. You can switch back to the old console at any time by choosing "Old Edit Console" under the "Help" heading.
+
If you are logged in and viewing a page in Drupal where you have editing permission, you will see a multicolored ribbon at the top of your screen with many different actions you can perform on the page. This will not show up when you are viewing a single piece of content, which you can tell because there will be the text '''node/######''' at the end of the URL in your brower's address bar (exception: the [[Drupal_Webform|Webform content type]] has its own edit console that will appear when viewing a webform node.
  
The new interface discards the tabbed navigation in favor of displaying the various options under 4 main headings, each of which contain a few sub items as listed below:
+
The '''Edit Console''' has four sections:
  
<ol>
+
*'''Content''' (blue): These are actions you can perform on content on the current page.
<li>Content</li>
+
*'''Page''' (green): These are actions you can perform on the current page.
<ol>
+
*'''Sub-pages''' (reddish-orange): These are actions you can perform on sub-pages of the current page.
<li>View</li>
+
*'''Help''' (purple): These are links to resources that offer editing assistance.
<li>Add</li>
+
 
<li>Reorder</li>
+
== Content ==
</ol>
+
 
<li>Page</li>
+
[[File:Drupal Edit Console Content.png]]
<ol>
+
 
<li>Settings</li>
+
The items in this portion of the menu affect content on the current page, which will be the content currently displayed in the middle of your screen.
<li>Copy/Move</li>
+
 
<li>Delete</li>
+
=== View ===
</ol>
+
 
<li>Sub-pages</li>
+
Clicking this link will bring you to the current page so that you can look and the content on that page.
<ol>
+
 
<li>Add Sub-page</li>
+
=== Add ===
<li>Reorder Menu</li>
+
 
</ol>
+
This allows you to add content to the current page. New content will be placed at the top of the page. Clicking this link will bring you to a page that lets you select the [[Editing_in_Drupal#Content_Types|Content Type]] to add.
<li>Help</li>
+
 
<ol>
+
=== Reorder ===
<li>Documentation</li>
+
 
<li>Old Edit Console</li>
+
Each time you add or edit a piece of content, it is placed at the top of the page, above any other existing content. To get content to appear in the order you want, you must reorder it yourself. '''Note: If any content has been made sticky, it will always appear above all other content. If multiple pieces of content are sticky, you can reorder the sticky and non-sticky sections of your page separately.'''
</ol>
+
 
</ol>
+
*Click the "Reorder" tab. The screen now shows the name and type of all content pieces on the page, each with the standard move icon to its left.
 +
* Use the icons to drag the content pieces into the order you want them to appear on the page.
 +
* When you're done, click the "Save configuration" button.
 +
* A message appears to notify you that the contents have been reordered.
 +
 
 +
To change the order of items in a sidebar or other non-center content region, click on the "Edit" link above that region (or to the left for the Carousel) and follow the steps above.
 +
 
 +
=== Files ===
 +
 
 +
This can be used to locate content where an image or document is stored. Paste in the URL of the file on the Drupal site and click "Find!" You will be shown a list of content on the site that references that file. If the file was embedded in content since we upgraded to version 7.x-2.0-beta1 of the Drupal file_entity module (February 8 for www.middlebury.edu or October 23 for other Drupal 7 sites) you will also see a row for wherever it is being used.
  
The instructions below reference the old editing interface, but you are encouraged to give the new editing interface a try. It's simply a different layout of the same information and you should be able to follow along with these instructions using either interface. The new interface was designed to be clearer to understand at a glance and provides a clear view of all the available options.
+
[[File:Drupal_Edit_Console_Files.png]]
  
= Creating and Managing Pages  =
+
If you need to delete the file, click on the file title, then click "Delete" link -- this will move the file to the recycle bin. A "Delete" button can also be found at the bottom of the Edit form. To permanently delete the file, search for it again to find it in its recycle bin, then click delete a second time.
  
Most departments have had their architecture built out for them, but there are still pages that must be created. Where a page should appear within your architecture determines where it needs to be created. 2<sup>nd</sup> tier pages should be created from your main page, 3<sup>rd</sup> tier pages should be created from the 2<sup>nd</sup> tier page they supplement, and so on. If done properly, your new page will appear in the proper section of your navigation bar.
+
== Page ==
  
== Adding a Page ==
+
[[File:Drupal_Edit_Console_Page.png]]
  
<ol>
+
The items in this portion of the menu affect the current page and all content appearing on that page.
<li>Make sure you are logged on.</li>
 
<li>Navigate to the parent of the page you are creating.</li>
 
<li>In the red-orange ''Sub-pages'' section at the top of your screen, click the "Add sub-page" tab.</li>
 
<li>Enter a name for your page in the "Page name" field. The name should be descriptive because:</li>
 
<ul>
 
<li>The page name is what appears at the top of your window.</li>
 
<li>The page name appears in the navigation bar.
 
<li>The page name is used in compiling search results.</li>
 
</ul>
 
<li>Enter a URL in the "URL" field.
 
<ul>
 
<li>The URL determines the web address for the page.</li>
 
</ul>
 
<li>Scroll down and click the "Create sub-page" button.</li>
 
<ol type="a">
 
<li>The screen now shows your blank page and asks you to add content.</li>
 
</ol>
 
</ol>
 
  
==Page Settings==
+
=== Settings ===
  
 
Page Settings refers to a page's properties. These include the name, URL, permissions, appearance, and location in the navigation bar.
 
Page Settings refers to a page's properties. These include the name, URL, permissions, appearance, and location in the navigation bar.
  
=== Page Name and URL ===
+
==== General Settings ====
 +
 
 +
*'''Page Name''': This is the title of the page, as it will appear in the browser tab and in links to the page in search results.
 +
*'''URL''': This is the fragment of the site URL associated with this page. For example, the URL of the Offices & Services page on the Middlebury site is "offices" as it is located at http://www.middlebury.edu/offices. If you change the URL of a page after it has been created you may break user-created links to that page, though links in the site navigation will update automatically.
 +
 
 +
==== Menu and Layout ====
 +
 
 +
Click the ''Don't show this page in the menu'' to hide the link to the page in the navigation menu. '''This does not make the page password protected'''. You will need to change the page permissions for that. Pages which are hidden from the menu cannot be ordered in the menu; they will appear at the bottom of the menu list.
  
If at any time you wish to improve upon your choices for the page name and URL, you are able to do so.
+
*'''Location on screen''': See the [[Editing_in_Drupal#Page_Regions|Page Regions]] documentation.
<ol>
+
*'''Max number of child levels to display''' and '''Max number of parent levels to display''': As the user gets deeper down in the menu tree, higher-level entries will be removed. This keeps a deeply-nested menu from getting too indented. This setting is inherited by any sub-pages.
<li>Make sure you are logged on.</li>
 
<li>Navigate to the page who's name and/or URL you wish to change.</li>
 
<li>Find the "Edit Console" in the top left of your window. Click the "Settings" tab.</li>
 
<ol type="a">
 
<li>The screen now shows the page's current name and URL.</li>
 
</ol>
 
<li>To change the name and URL, simply modify the text in the appropriate fields.</li>
 
<li>Scroll down and click the "Save settings" button.</li>
 
<ol type="a">
 
<li>Above the text fields, a message appears to notify you that the settings have been saved.</li>
 
</ol>
 
<li>To return to viewing the page, go to the "Edit Console" and click the "Contents" tab.</li>
 
</ol>
 
  
=== Permissions ===
+
==== Appearance ====
  
Permissions determine what access users have to the page. These range from not even being able to access the page, all the way to full editing privileges.
+
This section allows you to set the page theme. There are several basic themes you can choose from. See the [[Drupal_Midd_Themes|Middlebury themes]] and [[Drupal_MIIS_Themes|MIIS themes]] documentation for more information about the available options.
  
==== Hierarchy ====
+
==== Archive ====
  
Information on the page level permissions hierarchy can be found at [[Monster Menus Permissions]].
+
Contents past a certain age will be automatically moved to a secondary page, where they are organized by date, if you choose to use an archive. This is useful for pages where you periodically post information about news and events. Selecting this will prevent you from ordering the items by hand, and instead have them displayed in reverse-chronological order.
  
==== How to Change ====
+
==== Meta Tags ====
  
<ol>
+
[http://en.wikipedia.org/wiki/Meta_element Meta Tags] can be used to supply additional information about your content to search engines and other programs accessing your content "behind-the-scenes". They are now shown on your page, but do appear in the HTML source of the page. The Meta Description is used by Facebook when you link to a page from that site. It is also often shown below the page link in search result pages in Google, Yahoo, and Bing.
<li>Make sure you are logged on.</li>
 
<li>Navigate to the page whose permissions you wish to edit.</li>
 
<li>Find the "Edit Console" in the top left of your window. Click the "Settings" tab.</li>
 
<ol type="a">
 
<li>The screen now shows 3 text fields.</li>
 
</ol>
 
<li>Below the text fields, click the "Permissions" link.</li>
 
<ol type="a">
 
<li>The page owner's name and 4 new links appear.</li>
 
</ol>
 
<li>Click the link of the permissions level you wish to edit</li>
 
<li>There are 2 ways to add users to this permissions set. You can:</li>
 
<ul>
 
<li>Add individuals.</li>
 
<ol type="i">
 
<li>Use the text field to search for a user. As you type, matches will appear below.</li>
 
<li>Click on a person's name to add them to the list.</li>
 
</ol>
 
<li>Add groups.</li>
 
<ol type="i">
 
<li>Click the "Add" button.</li>
 
<ol type="a">
 
<li>A new window pops up.</li>
 
</ol>
 
<li>Use the links to navigate to the group you wish to add.</li>
 
<li>Once you've found the group, click the "Select" link to the right of the group's name to add them to the list.</li>
 
<ol type="a">
 
<li>The extra window disappears.</li>
 
</ol>
 
</ol>
 
</ul>
 
<li>To change another permissions level, click its link and repeat the previous step.</li>
 
<li>When you are done, scroll down and click the "Save settings" button.</li>
 
<ol type="a">
 
<li>All the menus close and above the text fields, a message appears to notify you that the settings have been saved.</li>
 
</ol>
 
<li>To return to viewing the page, go to the "Edit Console" and click the "Contents" tab.</li>
 
</ol>
 
  
=== Appearance ===
+
See the [[Drupal_Meta_Tags|Meta tags documentation]] for more information.
  
''What does it look like?''
+
==== Permissions ====
  
==== Theme ====
+
Permissions determine what access users have to the page. These range from not even being able to access the page, all the way to full editing privileges. Information on the page level permissions hierarchy can be found at [[Monster Menus Permissions]].
  
''General appearance''
+
The '''All users''' row refers to anonymous visitors to our site. To make a page password-protected, '''remove the Read permission''' from the '''All users''' row and add the groups you wish to have access. You are not allowed to give '''All users''' any permissions other than '''Reader'''.
  
[[Drupal_Email_Newsletters|Email Newsletter Themes]]
+
The '''Owner''' of a page is typically the person who created or last updated the page. Don't worry too much about who "owns" the page, unless you don't want that person editing it.
  
==== Menu Appearance ====
+
We ''strongly recommend'' that you add '''Groups''' rather than '''Individuals''' to page permissions. This allows you to add and remove members using the [[AD_Group_Manager|Group Manager]] rather than managing them in Drupal, which is both faster and less error-prone.
  
<i>Does it show up in the nav bar?</i>
+
= Creating and Managing Pages  =
  
=== Menu Order ===
+
Most departments have had their architecture built out for them, but there are still pages that must be created. Where a page should appear within your architecture determines where it needs to be created. 2<sup>nd</sup> tier pages should be created from your main page, 3<sup>rd</sup> tier pages should be created from the 2<sup>nd</sup> tier page they supplement, and so on. If done properly, your new page will appear in the proper section of your navigation bar.
  
When creating a page in Drupal, it is automatically placed in the appropriate level of navigation. However, pages are inserted in alphabetical order by default. It is important to be able to organize navigation in the order you want.
+
== Adding a Page ==
  
 
<ol>
 
<ol>
 
<li>Make sure you are logged on.</li>
 
<li>Make sure you are logged on.</li>
<li>Navigate to the page who's menu you wish to reorder.</li>
+
<li>Navigate to the parent of the page you are creating.</li>
<li>Find the "Edit Console" in the top left of your window. Click the "Settings" tab.</li>
+
<li>In the red-orange ''Sub-pages'' section at the top of your screen, click the "Add sub-page" tab.</li>
 +
<li>Enter a name for your page in the "Page name" field. The name should be descriptive because:</li>
 +
<ul>
 +
<li>The page name is what appears at the top of your window.</li>
 +
<li>The page name appears in the navigation bar.
 +
<li>The page name is used in compiling search results.</li>
 +
</ul>
 +
<li>Enter a URL in the "URL" field.
 +
<ul>
 +
<li>The URL determines the web address for the page.</li>
 +
</ul>
 +
<li>Scroll down and click the "Create sub-page" button.</li>
 
<ol type="a">
 
<ol type="a">
<li>A new list of options appears.</li>
+
<li>The screen now shows your blank page and asks you to add content.</li>
 
</ol>
 
</ol>
<li>Click the "Reorder menu" tab.</li>
 
<ol type="a">
 
<li>The screen now shows the page name of each page appearing in your navigation, each with the standard move icon to its left.</li>
 
</ol>
 
<li>Use the icons to drag the page names into the order you want them to appear in navigation.</li>
 
<li>When you're done, click the "Save configuration" button.</li>
 
<ol type="a">
 
<li>A message appears to notify you that the menu has been reordered.</li>
 
</ol>
 
<li>To return to viewing the page, go to the "Edit Console" and click the "Contents" tab.</li>
 
 
</ol>
 
</ol>
 +
 +
== Copying/Moving a Page ==
 +
 +
To copy or move a page, navigate to the page, then click Copy/Move in the green "Page" section. Select the Mode, then choose the Destination where you want to copy or move the page. You can give the page a new name and URL.
  
 
== Page Regions ==
 
== Page Regions ==
  
 
Most of the content you create will be added to the "content" region in the middle of the page. However, you can add other editable regions to your pages, enabling you to use more of the space on this design.
 
Most of the content you create will be added to the "content" region in the middle of the page. However, you can add other editable regions to your pages, enabling you to use more of the space on this design.
 +
 +
=== New sub-section ===
 +
 +
Creates a new left navigation menu section and makes the page the top page of the section.
  
 
=== Sidebar  ===
 
=== Sidebar  ===
  
Sidebar content is created using the "Text for Right Column" block. This block will look up in the page tree until it find a page with content in the block. That content will then be displayed at the current level of the tree. To override Text for Right Column content from a higher level in the tree, create a new page at the current level with this menu appearance.
+
Sidebar content is created using the "Text for Right Column" block. This block will look up in the page tree until it finds a page with content in the block. That content will then be displayed at the current level of the tree. To override Text for Right Column content from a higher level in the tree, create a new page at the current level with this menu appearance.
  
 
For example, if this is your site hierarchy the content on the rightcolumn page will be displayed in the sidebar of all three departments:
 
For example, if this is your site hierarchy the content on the rightcolumn page will be displayed in the sidebar of all three departments:
Line 219: Line 175:
  
 
#Navigate to the level in the site information architecture where you wish to create sidebar content.
 
#Navigate to the level in the site information architecture where you wish to create sidebar content.
#Click Settings
 
 
#Click Add sub-page
 
#Click Add sub-page
 
#Enter a page name. We recommend "Sidebar Content", but you may use whatever name you like. <br>'''**NOTE: If the page name already has a name, go back and click on the ADD&nbsp;SUB-PAGE TAB.'''<br>
 
#Enter a page name. We recommend "Sidebar Content", but you may use whatever name you like. <br>'''**NOTE: If the page name already has a name, go back and click on the ADD&nbsp;SUB-PAGE TAB.'''<br>
 
#Enter a URL name. We recommend "sidebar", but you may use whatever name you like. <br>'''**NOTE: If it already has a url, go back and click on the ADD SUB-PAGE TAB.'''<br>
 
#Enter a URL name. We recommend "sidebar", but you may use whatever name you like. <br>'''**NOTE: If it already has a url, go back and click on the ADD SUB-PAGE TAB.'''<br>
#Expand Appearance.
+
#Expand Menu and layout.
#Expand Menu appearance.
 
 
#Under "Location on screen" choose "Text for right column".
 
#Under "Location on screen" choose "Text for right column".
 
#Make other page settings, such as Permissions as you normally would for a new page.
 
#Make other page settings, such as Permissions as you normally would for a new page.
Line 267: Line 221:
 
#Click Create sub-page.
 
#Click Create sub-page.
  
You can now add content to the carousel using content types as you normally would for page content. The content you add here will be displayed in the Carousel. Scroll to the left edge of the Carousel to see the Edit link for the Carousel. This will allow you to return to content editing for content at this level and any other where this Carousel page will be displayed.
 
  
= Content Types =
+
You can now add content to the carousel using content types as you normally would for page content. The content you add here will be displayed in the Carousel. Scroll to the left edge of the Carousel to see the Edit link for the Carousel. This will allow you to return to content editing for content at this level and any other where this Carousel page will be displayed. 
  
Drupal organizes information into '''Content Types''', which have a unique list of fields and a distinct way to display the content. For example, a content type for a news story might have fields for a title, the body of the story, and a dateline. A content type for a user profile might have fields for the person's job title, email address, and telephone number. Drupal organizes the information in these fields and displays them on the site.
+
If you use the "File Upload" content type to place an image in the Carousel, text cannot be added around the image.
  
This section describes each of the types of content available on our site.
+
To add an image to the Carousel with additional text:
  
# [[Drupal_Basic_Content|Basic Content]]
+
#Navigate to the Carousel Editor
 +
#Add  a "Basic Content" type.
 +
#Provide a title for the content.  If you do not wish to have this title show in the Carousel, place the title in between a set of brackets.  Example: [Title]
 +
#In the WYSIWYG editor, Embed the image in the editor using the directions provided at the following link: http://mediawiki.middlebury.edu/wiki/LIS/Drupal_File_Upload#Embedding_in_Other_Content.  Note:  If you previously uploaded your image, it may appear in another File Upload folder depending on which level the image was added.
 +
#You can adjust the size of the image once it has been placed in the WYSIWYG editor by selecting the image and moving the corners to the size you require.
 +
#Add the text that you wish to add around the image within the WYSIWYG editor.
 +
#If you wish to include text but need to adjust the alignment of the image within the editor:
 +
##Click on the image so that it is selected
 +
##Click the Insert/Edit Image button.  This button will look like a tree and will appear to the right of the overlapping mountains you used for uploading the image.
 +
##In the Insert/Edit Image window, you will see an Appearance tab.  In this tab, you can adjust the alignment of the photo as well as other style attributes.
 +
<br />
  
# [[Drupal_File_Upload|File Upload]].
+
=== Banner image ===
  
# [[Drupal_Story|Story]]
+
Like the regions above, banner images can be added by creating a sub-page and assigning it to the "Site Banner" region:
  
# [[Drupal_RSS_Page|RSS Page]]
+
[[File:SiteBanner.png|framed]]
  
== Profile ==
+
Once you have created the sub-page for the site-banner, you can add an image as File-upload content and it will display with no further action.
  
The "Profile" type can be used to create a profile for a staff or faculty member. With it, you can pull a person's position, contact information, campus location, photo, and office hours from the directory. There is also space to put in biographical information, lists of activities/accomplishments/etc., and related feeds. Also, for faculty, current courses can be pulled from the course catalog.
+
To do this:
 +
* Select "Edit" to edit the site banner sub-page.
 +
* You should now be located in the site banner page and will see that reflected in the path at the top of your content area
 +
* You will go up to the content editor at the top of the screen and click "Add" to add your image.
 +
* Select "File Upload" from the available content types to upload the banner image you wish to add to the banner site
 +
* Save and you should have successfully added your banner image.
 +
<br />
 +
<br />
  
See our [[Faculty_Profiles_in_Drupal|expanded documentation on using Profiles]].
+
= Content Types =
  
== Webform ==
+
Drupal organizes information into '''Content Types''', which have a unique list of fields and a distinct way to display the content. For example, a content type for a news story might have fields for a title, the body of the story, and a dateline. A content type for a user profile might have fields for the person's job title, email address, and telephone number. Drupal organizes the information in these fields and displays them on the site.
  
See the [[Drupal_Webform|article on using the Drupal Webform module]].
+
This section describes each of the types of content available on our site.
  
== Frequently Asked Question ==
+
# [[Drupal_Basic_Content|Basic Content]]
 
+
# [[Drupal_Course_Listing|Course Listing]]
FAQ's can be a great resource for helping new users find information. In Drupal, you will enter each question as a separate piece of content. Each question added will appear, and when clicked on, its answer will be revealed.
+
# [[Drupal_Event|Event]]
 
+
# [[Drupal_Facebook_Element|Facebook Element]]
=== Creating ===
+
# [[Drupal_File_Upload|File Upload]]
 
+
# [[Drupal_FAQ|Frequently Asked Question]]
<ol>
+
# [[Drupal_Gallery|Gallery]]
<li>Make sure you are logged on.</li>
+
# [[Drupal_Google_Calendar|Google Calendar]]
<li>Navigate to the page you wish to add content to.</li>
+
# [[Drupal_MiddLab_Widget|MiddLab Widget]]
<li>Locate the "Edit Console" in the top left of the screen. Click the "Add" tab.</li>
+
# [[Drupal_News|News]]
<ol type="a">
+
# [[Faculty_Profiles_in_Drupal|Profile]]
<li>The screen now lists all the content types.</li>
+
# [[Drupal_Promotional_Calendar|Promotional Calendar]]
</ol>
+
# [[Drupal_Quick_Access|Quick Access]]
<li>Click the "Frequently Asked Question" link.</li>
+
# [[Drupal_Redirector|Redirector]]
<ol type="a">
+
# [[Drupal_RSS_Page|RSS feed]]
<li>The screen now shows the "Frequently Asked Question" editing interface.</li>
+
# [[Drupal_Slideshow|Slideshow]]
</ol>
+
# [[Drupal_Story|Story]]
<li>In the "Question" text field, enter the question you wish to display.</li>
+
# [[Drupal_Subpage_List|Subpage list]]
<li>In the "Answer" text field, enter the answer to your question..</li>
+
# [[Drupal_Webform|Webform]]
<li>If necessary, alter the appearance, set publish dates, and set permissions lists.</li>
 
<ul>
 
<li>Instructions on [https://mediawiki.middlebury.edu/wiki/LIS/Editing_in_Drupal#Appearance_2 appearance], [https://mediawiki.middlebury.edu/wiki/LIS/Editing_in_Drupal#Scheduling scheduling] and [https://mediawiki.middlebury.edu/wiki/LIS/Editing_in_Drupal#Permissions_2 permissions] can be found below.</li>
 
</ul>
 
<li>When you are done adding the content, scroll down and click the "Save" button.</li>
 
<ol type="a">
 
<li>The screen returns to "View" mode.</li>
 
</ol>
 
</ol>
 
 
 
== Gallery ==
 
 
 
This content type can be used to display images in a slideshow.
 
 
 
=== Creating ===
 
 
 
== Redirector ==
 
 
 
=== Creating ===
 
 
 
== Events Calendar ==
 
 
 
You can now add dynamic events calendars to your sites. To do this, use the new Promotional Calendar content type in Drupal. Calendars can be added to the center, left or right sidebars.
 
 
 
Before you add a calendar, you will need to contact the Department of Event Management, x. 5362.  Each department will receive a webName after the content and format of the calendar are determined.  See below for instructions on how to add the calendar to your site AFTER you have received confirmation that a calendar has been created.  (You will receive a calendar webName at that time).
 
 
 
<ol>
 
<li>Go to the page or sidebar where you'd like to add the Calendar</li>
 
<li>Click Add in the Edit Console</li>
 
<li>Select Promotional Calendar from the list of content types</li>
 
<li>Enter your department's webName in the webName field </li>
 
<li>Enter the type of Calendar in the spudType field (see below)</li>
 
<li>Press the save button</li>
 
</ol>
 
 
 
 
 
=== Calendar Types ===
 
 
 
<b>spudType: main</b>
 
A large list of events like you see on the [[http://www.middlebury.edu/events/calendar_of_events/ Campus Events]] page. Should only be used in the center of a page.
 
 
 
<b>spudType: upcoming</b>
 
A list of events like you see on the [[http://www.middlebury.edu/offices/technology/lis/ LIS home page]]. Can be used in the center or a sidebar.
 
 
 
<b>spudType: datefinder</b>
 
A monthly grid calendar. Can be used in the sidebar with a main calendar in the center.
 
 
 
<b>spudType: chooser</b>
 
Put this in the sidebar to let people change the way they see a "main" calendar in the center of the page.
 
 
 
== MiddLab Widget ==
 
 
 
Departments and Offices can add a MiddLab promotional item to their sidebar to show projects that relate to their area. An example of this in action can be seen on the [http://www.middlebury.edu/academics/resources/uro Undergraduate Research] site. To add this:
 
 
 
<ol>
 
<li>Click [Edit] above your site's sidebar.</li>
 
<li>Click Add in the Edit Console.</li>
 
<li>Select MiddLab Widget from the list in the center column.</li>
 
<li>Enter a Title.</li>
 
<li>Check the theme(s), department(s), and office(s) that are of interest.</li>
 
<li>Click Save.</li>
 
</ol>
 
  
 
= Managing Content =
 
= Managing Content =
Line 454: Line 362:
 
=== Images ===
 
=== Images ===
  
 +
====Uploading an Image====
 +
In our site, images are normally uploaded to a hidden '''File Uploads''' page that holds all of the images for a section of the site.
 +
 +
If the '''File Uploads''' page already exists...
 +
# Navigate to the '''File Uploads ''' page.
 +
# Click '''Add Content''' in the editing menu: <br/>[[File:MM-Add_Content.png|300px|none|Add content screenshot]]
 +
# Choose '''File Upload''' in the content list: <br/>[[File:MM-File_Upload.png|300px|none|File upload option screenshot.]]
 +
# Select your file and save the new content.
 +
 +
If the '''File Uploads''' page doesn't exist...
 +
# Add a new Page to your section of the site and title it '''File Uploads'''
 +
# Under the '''Menu and Layout''' tab, choose '''Don't show this page in the menu''' <br/>[[File:MM-Hide_from_menu.png|300px|none|Hide from menu screenshot.]]
 +
# Save the new page.
 +
 +
====Inserting an image into content====
 
<b>Note: These instructions apply to the "Basic Content" and "Story" content types.</b>
 
<b>Note: These instructions apply to the "Basic Content" and "Story" content types.</b>
  
Line 569: Line 492:
 
<li>Click Save.</li>
 
<li>Click Save.</li>
 
</ol>
 
</ol>
 +
 +
=== Pasting from Word ===
 +
When copy/pasting from Microsoft Word, Word includes extra garbage markup that will be hidden in the editor, but show up in the output after the page is saved. Use the "Paste from Word" button on the editor toolbar to automatically strip out this extra markup when copy-pasting from Word.
 +
 +
[[File:Drupal_Paste_From_Word.png|500px]]
 +
 +
 +
If you forget to use the "Paste from Word" toolbar button, use these steps to remove the extra markup:
 +
 +
# Select all text in the visual editor
 +
# Use the toolbar button to copy the text
 +
# Use the "Paste from Word" button on the editor toolbar to automatically strip out the extra markup.
 +
# Save the content node to apply the changes.
 +
 +
 +
For even more drastic cleanup, highlight all text and use the "Remove Formatting" button to clear out all custom styles. You can then add formatting back in using the toolbar buttons.
 +
 +
[[File:Drupal_remove_formatting.png|500px]]
 +
 +
 +
 +
To manually clean up Word markup follow these steps:
 +
[[File:Drupal_Cleanup_Word_Markup.png|500px]]
 +
 +
# Click the "HTML" button in the editor toolbar
 +
# Select the extra markup and delete it.
 +
# Click the "Update" button to save the changes back to the visual editor.
 +
# Save the content node to apply the changes.
 +
 +
=== Tables ===
 +
To add and remove table columns from existing columns in the WYSIWYG editor, first click on a cell in the table and then look for these buttons in the editor:
 +
 +
[[File:Drupal_WYSIWYG_Table_Buttons.png|500px]]
 +
 +
To change column widths and other properties, click in the table-cell you want to change, then use the '''Table Cell Properties''' button:
 +
 +
[[File:Drupal Edit Table Cell Properties.png|500px|Edit table-cell properties including width.]]
 +
 +
=== Embedding Interactive Elements ===
 +
 +
For security reasons, users cannot insert Javascript code into the HTML of the site. To get around this limitation there are short-codes provided to allow embedding interactive widgets for select services, below.
 +
 +
==== MailChimp ====
 +
You can embed a MailChimp campaign in a page with <code>[mailchimp URL]</code>.
 +
Example:
 +
<pre>[mailchimp //middlebury.us7.list-manage.com/generate-js/?u=050d2dfab1151df6a95fe1409&fid=06269&show=10]</pre>
 +
{{note|Note: campaigns must be hosted at <code>middlebury.us7.list-manage.com</code>.}}
  
 
== Permissions ==
 
== Permissions ==
Line 663: Line 633:
 
</ol>
 
</ol>
  
== Scheduling ==
+
== Scheduled Publishing ==
  
Scheduling a piece of content allows you to control when the content is published. This allows you to set a future start date for it to appear on your site, as well as a date for it to be automatically removed from your page. Scheduling is particularly effective for temporary content, or content that gets reused based on a schedule. To set publish dates:
+
Editing the Publish settings on a piece of content allows you to control when the content is published. This allows you to set a future start date for it to appear on your site, as well as a date for it to be automatically removed from your page. The Publishing setting is particularly effective for temporary content, or content that gets reused based on a schedule. To set publish dates:
  
 
<ol>
 
<ol>
Line 674: Line 644:
 
<li>You are now in the editing interface for this content piece.</li>
 
<li>You are now in the editing interface for this content piece.</li>
 
</ol>
 
</ol>
<li>Scroll down and click the "Scheduling" link above the "Save" button.</li>
+
<li>Scroll down and click the "Publishing" link above the "Meta tags" label.</li>
 
<ol type="a">
 
<ol type="a">
 
<li>New text fields appear for setting publish dates and times.</li>
 
<li>New text fields appear for setting publish dates and times.</li>
 
</ol>
 
</ol>
<li>Type the necessary dates and times into the "Publish on" and "Unpublish on" text fields.</li>
+
<li>Type the necessary dates and times into the "Publish on" and/or "Unpublish on" text fields.</li>
 
<li>When you are done setting publish dates for the content, scroll down and click the "Save" button.</li>
 
<li>When you are done setting publish dates for the content, scroll down and click the "Save" button.</li>
 
<ol type="a">
 
<ol type="a">
Line 739: Line 709:
 
</ol>
 
</ol>
 
</ol>
 
</ol>
 
== Reordering ==
 
 
Each time you add or edit a piece of content, it is placed at the top of the page, above any other existing content. To get content to appear in the order you want, you must reorder it yourself. <b>Note: If any content has been made sticky, it will always appear above all other content. If multiple pieces of content are sticky, you can reorder the sticky and non-sticky sections of your page separately.</b>
 
 
<ol>
 
<li>Make sure you are logged on.</li>
 
<li>Navigate to the page who's content you wish to reorder.</li>
 
<li>Find the "Edit Console" in the top left of your window. Click the "Reorder" tab.</li>
 
<ol type="a">
 
<li>The screen now shows the name and type of all content pieces on the page, each with the standard move icon to its left.</li>
 
</ol>
 
<li>Use the icons to drag the content pieces into the order you want them to appear on the page.</li>
 
<li>When you're done, click the "Save configuration" button.</li>
 
<ol type="a">
 
<li>A message appears to notify you that the contents have been reordered.</li>
 
</ol>
 
<li>To return to viewing the page, go to the "Edit Console" and click the "View" tab.</li>
 
</ol>
 
 
To change the order of items in a sidebar or other non-center content region, click on the "Edit" link above that region (or to the left for the Carousel) and follow the steps above.
 
  
 
[[Category:Drupal]]
 
[[Category:Drupal]]

Latest revision as of 14:38, 7 May 2019

Part of the documentation on Drupal.

This page contains materials to help you edit content in Drupal. Information can be found for logging on, adding content, editing existing content, creating new pages, setting permissions, etc. Further, each set of instructions will be accompanied by a link to a step-by-step flash tutorial incorporating screen shots to help you complete each task.

Logging On

Before you can begin creating or editing content, you must first log on to the appropriate server.

  1. Navigate to the page you wish to edit.
  2. Scroll to the bottom of the left column and click the "Site Editor Log On" link.
    1. You are now at the "Middlebury College Central Authentication Service."
  3. Your NetID and password are the same as for your Middlebury email account. Type them in the appropriate fields.
  4. Click the "LOGIN" button
    1. You are returned to the page you were about to edit.
  5. You may begin editing.

The Edit Console

If you are logged in and viewing a page in Drupal where you have editing permission, you will see a multicolored ribbon at the top of your screen with many different actions you can perform on the page. This will not show up when you are viewing a single piece of content, which you can tell because there will be the text node/###### at the end of the URL in your brower's address bar (exception: the Webform content type has its own edit console that will appear when viewing a webform node.

The Edit Console has four sections:

  • Content (blue): These are actions you can perform on content on the current page.
  • Page (green): These are actions you can perform on the current page.
  • Sub-pages (reddish-orange): These are actions you can perform on sub-pages of the current page.
  • Help (purple): These are links to resources that offer editing assistance.

Content

Drupal Edit Console Content.png

The items in this portion of the menu affect content on the current page, which will be the content currently displayed in the middle of your screen.

View

Clicking this link will bring you to the current page so that you can look and the content on that page.

Add

This allows you to add content to the current page. New content will be placed at the top of the page. Clicking this link will bring you to a page that lets you select the Content Type to add.

Reorder

Each time you add or edit a piece of content, it is placed at the top of the page, above any other existing content. To get content to appear in the order you want, you must reorder it yourself. Note: If any content has been made sticky, it will always appear above all other content. If multiple pieces of content are sticky, you can reorder the sticky and non-sticky sections of your page separately.

  • Click the "Reorder" tab. The screen now shows the name and type of all content pieces on the page, each with the standard move icon to its left.
  • Use the icons to drag the content pieces into the order you want them to appear on the page.
  • When you're done, click the "Save configuration" button.
  • A message appears to notify you that the contents have been reordered.

To change the order of items in a sidebar or other non-center content region, click on the "Edit" link above that region (or to the left for the Carousel) and follow the steps above.

Files

This can be used to locate content where an image or document is stored. Paste in the URL of the file on the Drupal site and click "Find!" You will be shown a list of content on the site that references that file. If the file was embedded in content since we upgraded to version 7.x-2.0-beta1 of the Drupal file_entity module (February 8 for www.middlebury.edu or October 23 for other Drupal 7 sites) you will also see a row for wherever it is being used.

Drupal Edit Console Files.png

If you need to delete the file, click on the file title, then click "Delete" link -- this will move the file to the recycle bin. A "Delete" button can also be found at the bottom of the Edit form. To permanently delete the file, search for it again to find it in its recycle bin, then click delete a second time.

Page

Drupal Edit Console Page.png

The items in this portion of the menu affect the current page and all content appearing on that page.

Settings

Page Settings refers to a page's properties. These include the name, URL, permissions, appearance, and location in the navigation bar.

General Settings

  • Page Name: This is the title of the page, as it will appear in the browser tab and in links to the page in search results.
  • URL: This is the fragment of the site URL associated with this page. For example, the URL of the Offices & Services page on the Middlebury site is "offices" as it is located at http://www.middlebury.edu/offices. If you change the URL of a page after it has been created you may break user-created links to that page, though links in the site navigation will update automatically.

Menu and Layout

Click the Don't show this page in the menu to hide the link to the page in the navigation menu. This does not make the page password protected. You will need to change the page permissions for that. Pages which are hidden from the menu cannot be ordered in the menu; they will appear at the bottom of the menu list.

  • Location on screen: See the Page Regions documentation.
  • Max number of child levels to display and Max number of parent levels to display: As the user gets deeper down in the menu tree, higher-level entries will be removed. This keeps a deeply-nested menu from getting too indented. This setting is inherited by any sub-pages.

Appearance

This section allows you to set the page theme. There are several basic themes you can choose from. See the Middlebury themes and MIIS themes documentation for more information about the available options.

Archive

Contents past a certain age will be automatically moved to a secondary page, where they are organized by date, if you choose to use an archive. This is useful for pages where you periodically post information about news and events. Selecting this will prevent you from ordering the items by hand, and instead have them displayed in reverse-chronological order.

Meta Tags

Meta Tags can be used to supply additional information about your content to search engines and other programs accessing your content "behind-the-scenes". They are now shown on your page, but do appear in the HTML source of the page. The Meta Description is used by Facebook when you link to a page from that site. It is also often shown below the page link in search result pages in Google, Yahoo, and Bing.

See the Meta tags documentation for more information.

Permissions

Permissions determine what access users have to the page. These range from not even being able to access the page, all the way to full editing privileges. Information on the page level permissions hierarchy can be found at Monster Menus Permissions.

The All users row refers to anonymous visitors to our site. To make a page password-protected, remove the Read permission from the All users row and add the groups you wish to have access. You are not allowed to give All users any permissions other than Reader.

The Owner of a page is typically the person who created or last updated the page. Don't worry too much about who "owns" the page, unless you don't want that person editing it.

We strongly recommend that you add Groups rather than Individuals to page permissions. This allows you to add and remove members using the Group Manager rather than managing them in Drupal, which is both faster and less error-prone.

Creating and Managing Pages

Most departments have had their architecture built out for them, but there are still pages that must be created. Where a page should appear within your architecture determines where it needs to be created. 2nd tier pages should be created from your main page, 3rd tier pages should be created from the 2nd tier page they supplement, and so on. If done properly, your new page will appear in the proper section of your navigation bar.

Adding a Page

  1. Make sure you are logged on.
  2. Navigate to the parent of the page you are creating.
  3. In the red-orange Sub-pages section at the top of your screen, click the "Add sub-page" tab.
  4. Enter a name for your page in the "Page name" field. The name should be descriptive because:
    • The page name is what appears at the top of your window.
    • The page name appears in the navigation bar.
    • The page name is used in compiling search results.
  5. Enter a URL in the "URL" field.
    • The URL determines the web address for the page.
  6. Scroll down and click the "Create sub-page" button.
    1. The screen now shows your blank page and asks you to add content.

Copying/Moving a Page

To copy or move a page, navigate to the page, then click Copy/Move in the green "Page" section. Select the Mode, then choose the Destination where you want to copy or move the page. You can give the page a new name and URL.

Page Regions

Most of the content you create will be added to the "content" region in the middle of the page. However, you can add other editable regions to your pages, enabling you to use more of the space on this design.

New sub-section

Creates a new left navigation menu section and makes the page the top page of the section.

Sidebar

Sidebar content is created using the "Text for Right Column" block. This block will look up in the page tree until it finds a page with content in the block. That content will then be displayed at the current level of the tree. To override Text for Right Column content from a higher level in the tree, create a new page at the current level with this menu appearance.

For example, if this is your site hierarchy the content on the rightcolumn page will be displayed in the sidebar of all three departments:

  • Home
    • Academics
      • rightcolumn (Using Text for Right Column menu appearance)
      • Biology
      • Chemistry
      • Economics

To create a custom sidebar for Chemistry, create a new rightcolumn page at that level:

  • Home
    • Academics
      • rightcolumn (Using Text for Right Column menu appearance)
      • Biology
      • Chemistry
        • rightcolumn (Using text for Right Column menu appearance)
      • Economics

To create a page using this menu appearance:

  1. Navigate to the level in the site information architecture where you wish to create sidebar content.
  2. Click Add sub-page
  3. Enter a page name. We recommend "Sidebar Content", but you may use whatever name you like.
    **NOTE: If the page name already has a name, go back and click on the ADD SUB-PAGE TAB.
  4. Enter a URL name. We recommend "sidebar", but you may use whatever name you like.
    **NOTE: If it already has a url, go back and click on the ADD SUB-PAGE TAB.
  5. Expand Menu and layout.
  6. Under "Location on screen" choose "Text for right column".
  7. Make other page settings, such as Permissions as you normally would for a new page.
  8. Click Create sub-page.

You can now add content to the sidebar using content types as you normally would for page content. The content you add here will be displayed in the Sidebar. You should also now see an Edit link in the Sidebar. This will allow you to return to content editing for Sidebar content at this level and any other where this Text for Right Column page will be displayed.

Carousel

Created using the "Carousel" block, this region displays content in a scrolling bar at the bottom of the page. This block will look up in the page tree until it find a page with content in the block. That content will then be displayed at the current level of the tree. To override Carousel content from a higher level in the tree, create a new page at the current level with this menu appearance.

For example, if this is your site hierarchy the content on the rightcolumn page will be displayed in the sidebar of all three departments:

  • Home
    • Academics
      • carousel (Using Carousel menu appearance)
      • Biology
      • Chemistry
      • Economics

To create a custom sidebar for Chemistry, create a new carousel page at that level:

  • Home
    • Academics
      • carousel (Using Carousel menu appearance)
      • Biology
      • Chemistry
        • carousel (Using Carousel menu appearance)
      • Economics

To create a page using this menu appearance:

  1. Navigate to the level in the site information architecture where you wish to create carousel content.
  2. Click Settings
  3. Click Add sub-page
  4. Enter a page name. We recommend "Carousel", but you may use whatever name you like.
  5. Enter a URL name. We recommend "carousel", but you may use whatever name you like.
  6. Expand Appearance.
  7. Expand Menu appearance.
  8. Under "Location on screen" choose "Carousel".
  9. Make other page settings, such as Permissions as you normally would for a new page.
  10. Click Create sub-page.


You can now add content to the carousel using content types as you normally would for page content. The content you add here will be displayed in the Carousel. Scroll to the left edge of the Carousel to see the Edit link for the Carousel. This will allow you to return to content editing for content at this level and any other where this Carousel page will be displayed.

If you use the "File Upload" content type to place an image in the Carousel, text cannot be added around the image.

To add an image to the Carousel with additional text:

  1. Navigate to the Carousel Editor
  2. Add a "Basic Content" type.
  3. Provide a title for the content. If you do not wish to have this title show in the Carousel, place the title in between a set of brackets. Example: [Title]
  4. In the WYSIWYG editor, Embed the image in the editor using the directions provided at the following link: http://mediawiki.middlebury.edu/wiki/LIS/Drupal_File_Upload#Embedding_in_Other_Content. Note: If you previously uploaded your image, it may appear in another File Upload folder depending on which level the image was added.
  5. You can adjust the size of the image once it has been placed in the WYSIWYG editor by selecting the image and moving the corners to the size you require.
  6. Add the text that you wish to add around the image within the WYSIWYG editor.
  7. If you wish to include text but need to adjust the alignment of the image within the editor:
    1. Click on the image so that it is selected
    2. Click the Insert/Edit Image button. This button will look like a tree and will appear to the right of the overlapping mountains you used for uploading the image.
    3. In the Insert/Edit Image window, you will see an Appearance tab. In this tab, you can adjust the alignment of the photo as well as other style attributes.


Like the regions above, banner images can be added by creating a sub-page and assigning it to the "Site Banner" region:

SiteBanner.png

Once you have created the sub-page for the site-banner, you can add an image as File-upload content and it will display with no further action.

To do this:

  • Select "Edit" to edit the site banner sub-page.
  • You should now be located in the site banner page and will see that reflected in the path at the top of your content area
  • You will go up to the content editor at the top of the screen and click "Add" to add your image.
  • Select "File Upload" from the available content types to upload the banner image you wish to add to the banner site
  • Save and you should have successfully added your banner image.



Content Types

Drupal organizes information into Content Types, which have a unique list of fields and a distinct way to display the content. For example, a content type for a news story might have fields for a title, the body of the story, and a dateline. A content type for a user profile might have fields for the person's job title, email address, and telephone number. Drupal organizes the information in these fields and displays them on the site.

This section describes each of the types of content available on our site.

  1. Basic Content
  2. Course Listing
  3. Event
  4. Facebook Element
  5. File Upload
  6. Frequently Asked Question
  7. Gallery
  8. Google Calendar
  9. MiddLab Widget
  10. News
  11. Profile
  12. Promotional Calendar
  13. Quick Access
  14. Redirector
  15. RSS feed
  16. Slideshow
  17. Story
  18. Subpage list
  19. Webform

Managing Content

Once a content piece is created and saved, you can always go back and change it. You can edit the content, change the content permissions, adjust the scheduling, set what pages the content appears on, and reorder content on the page. Note: These tasks can also be done while initially creating the content.

Edit Content

When a content piece is created, you can change anything that could also have been initially done during the creation of the content. To do this:

  1. Make sure you are logged on.
  2. Navigate to the page containing the content you wish to edit.
  3. Scroll below the content piece you wish to edit and click the "Edit" link.
    1. You are now in the editing interface for this content piece.
  4. Make the desired changes to your content.
  5. When you are done editing the content, scroll down and click the "Save" button.
    1. The screen returns to "View" mode.

Links

Drupal Editing Links.png

Creating a New Link

  1. Highlight the text you wish to be the link.
  2. Click the "Insert/edit link" button. It looks like a chain link. It is the button on the left in the image above.
    1. The "Insert/edit link" console appears on your screen.
  3. In the "Link URL" text field, put in the URL for the page you wish to link to.
  4. Click the "Insert" button.
    1. The "Insert/edit link" console disappears.
  5. When you are done editing the content, scroll down and click the "Save" button.
    1. The screen returns to "View" mode.

Creating a Link Anchor

  1. Highlight the text you wish to be the anchor target.
  2. Click the "Insert/Edit Anchor" button. It looks like a boat anchor. It is the button on the right in the image above.
  3. In the "Anchor Name" field type a single word to describe your anchor. Do not include the pound (#) symbol in the Anchor Name.
  4. Click the Insert button.
  5. Now highlight the text that you wish to be the link to the anchor.
  6. Click the "Insert/edit link" button. It looks like a chain link. It is the button on the left in the image above.
  7. In the "Link URL" field type the pound (#) symbol and then the word that you entered in step 3.
  8. Click the Insert button.

Removing a Link

  1. Highlight all of the text in the link you wish to remove.
  2. Click the "Unlink" button. It looks like a broken chain link. It is the button in the middle in the image above.

Changing a Link

Follow the directions in the "Creating a New Link" section above. The text you highlight initially will be the full text of the existing link.

Having a Link Open in a New Window or Tab

We strongly advise against setting a link to open in a new window or tab. This interrupts the user's experience. If they wish to get back to your site, most people prefer to use the Back button, which opening a link in a new window breaks. By default, links to sites outside of "www.middlebury.edu" will open in a new browser window or tab when someone clicks on them. If you would like to change this behavior for one of your links:

  1. Highlight the text you wish to be the link.
  2. Click the "Insert/edit link" button. It looks like a chain link.
  3. Click the "Target" menu and select "Open in this window / frame".
  4. Click Update.

Images

Uploading an Image

In our site, images are normally uploaded to a hidden File Uploads page that holds all of the images for a section of the site.

If the File Uploads page already exists...

  1. Navigate to the File Uploads page.
  2. Click Add Content in the editing menu:
    Add content screenshot
  3. Choose File Upload in the content list:
    File upload option screenshot.
  4. Select your file and save the new content.

If the File Uploads page doesn't exist...

  1. Add a new Page to your section of the site and title it File Uploads
  2. Under the Menu and Layout tab, choose Don't show this page in the menu
    Hide from menu screenshot.
  3. Save the new page.

Inserting an image into content

Note: These instructions apply to the "Basic Content" and "Story" content types.

  1. Make sure you are logged on and in the editing interface for the content you wish to edit.
  2. Click in your text in the area you wish to add an image.
  3. Click the "Insert file upload" button. It's the 1st button in the 3rd row.
    1. The "Insert file upload" console appears on your screen.
  4. Use the links the find the files on the "File Uploads" page.
  5. Click the image you wish to use.
    1. A new window appears.
  6. Use this screen to set the properties you want for the image. These cannot be changed later.
  7. When you're done setting the properties, click the "Insert" button.
    1. The window disappears.
  8. To edit the image's settings, make sure it is selected and click the "Insert/edit image" button. It's the 2nd button in the 3rd row.
    1. A new window appears.
  9. Click the appearance tab.
    1. You now see the image's appearance settings.
  10. Edit the image as required.
  11. When you're done editing the image settings, click the "Update" button.
    1. The window disappears.
  12. When you are done editing the content, scroll down and click the "Save" button.
    1. The screen returns to "View" mode.

Video

Note: These instructions apply to the "Basic Content" and "Story" content types.

Videos can be pulled from just about anywhere on the web, including YouTube and MiddTube. The syntax for inserting videos is:[video:URL width:value height:value align:value autoplay:value autorewind:value loop:value image:URL]. The video URL is the address of the site you found the video on. Accepted values for width and height are numbers. Accepted values for align are left and right. Accepted values for autoplay, autorewind and loop are 0 (false) and 1 (true). The image URL is used to change the "splash image" or the image show in the player when the video is not playing. Other than the video URL, all attributes are optional. To insert a video:

  1. Make sure you are logged on and in the editing interface for the content you wish to edit.
  2. Click in the text where you want to add a video.
  3. Enter the line of code above, [video:URL width:value height:value align:value], inputting the desired URL and appropriate values.
  4. When you are done adding the video, scroll down and click the "Save" button.
    1. The screen returns to "View" mode.

YouTube Playlists

You can add a YouTube playlist by adding the playlist ID in the video URL. For example:

[video:http://www.youtube.com/watch?v=DaCP2kdYA4A&p=17B9CA1B31A33C5E]

or

[video:http://www.youtube.com/watch?v=DaCP2kdYA4A&list=17B9CA1B31A33C5E]

In these examples, the playlist ID follows the "p=" or "list=" parts of the URL.

HTML5 Video

Videos from MiddMedia will appear using the browser's built-in video player in the following browsers:

  1. Safari
  2. Mobile Safari for the iPad and iPhone

Audio from MiddMedia will appear using the browser's built-in video player in the following browsers:

  1. Safari
  2. Mobile Safari for the iPad and iPhone
  3. Chrome

Other browsers will fallback to using the Adobe Flash version of the player. Videos from YouTube will play using a player from that site that detects the correct player type to use based on the browser and YouTube user preferences.

Ustream Video

To embed a Ustream video (or channel) use the following syntax: [video:URL] To obtain the correct URL, visit the Ustream channel, click on the Share button and select the Embed option <>. Highlight and copy the URL that has the word /embed/. Insert this link on your Drupal page using the following syntax: [video:http://www.ustream.tv/embed/13154933]

Locations

You can "geo-tag" your content to let people know that it is about a specific place. This is something you might want to do with a news story about student activity in an interesting location, or a program description of a course at a school abroad. This information can then be used to build a dynamic map of the different locations where your content appears. Send us an email if you're interested in creating this type of map. To add a location to your content:

  1. When editing a piece of content, expand the Locations and then Location section at the bottom of the form.
  2. Enter the address information for your locations. For most countries, this will automatically be translated into a Latitude and Longitude when you save the content.
  3. Click Save.

Meta Tags

[Meta Tags] can be used to supply additional information about your content to search engines and other programs accessing your content "behind-the-scenes". They are now shown on your page, but do appear in the HTML source of the page. The Meta Description is used by Facebook when you link to a page from that site. It is also often shown below the page link in search result pages in Google, Yahoo, and Bing.

Because Meta Tags are added to nodes and we often show multiple nodes on each page, they will only work for individual nodes, like individual news stories. If you do not enter a Meta Description, one will be created for your content using the first few sentences from the content body.

To edit the Meta Keywords or Meta Description:

  1. Click the Edit link below the content.
  2. Expand the Meta tags section near the bottom of the edit form.
  3. Enter values for the keywords and/or description fields.
  4. Click Save.

Pasting from Word

When copy/pasting from Microsoft Word, Word includes extra garbage markup that will be hidden in the editor, but show up in the output after the page is saved. Use the "Paste from Word" button on the editor toolbar to automatically strip out this extra markup when copy-pasting from Word.

Drupal Paste From Word.png


If you forget to use the "Paste from Word" toolbar button, use these steps to remove the extra markup:

  1. Select all text in the visual editor
  2. Use the toolbar button to copy the text
  3. Use the "Paste from Word" button on the editor toolbar to automatically strip out the extra markup.
  4. Save the content node to apply the changes.


For even more drastic cleanup, highlight all text and use the "Remove Formatting" button to clear out all custom styles. You can then add formatting back in using the toolbar buttons.

Drupal remove formatting.png


To manually clean up Word markup follow these steps: Drupal Cleanup Word Markup.png

  1. Click the "HTML" button in the editor toolbar
  2. Select the extra markup and delete it.
  3. Click the "Update" button to save the changes back to the visual editor.
  4. Save the content node to apply the changes.

Tables

To add and remove table columns from existing columns in the WYSIWYG editor, first click on a cell in the table and then look for these buttons in the editor:

Drupal WYSIWYG Table Buttons.png

To change column widths and other properties, click in the table-cell you want to change, then use the Table Cell Properties button:

Edit table-cell properties including width.

Embedding Interactive Elements

For security reasons, users cannot insert Javascript code into the HTML of the site. To get around this limitation there are short-codes provided to allow embedding interactive widgets for select services, below.

MailChimp

You can embed a MailChimp campaign in a page with [mailchimp URL]. Example:

[mailchimp //middlebury.us7.list-manage.com/generate-js/?u=050d2dfab1151df6a95fe1409&fid=06269&show=10]
Note: campaigns must be hosted at middlebury.us7.list-manage.com.

Permissions

Hierarchy

Information on the content level permissions hierarchy can be found at Monster Menus Permissions.

How to Change

  1. Make sure you are logged on.
  2. Navigate to the page containing the content who's permissions set you wish to change.
  3. Scroll below the content piece you wish to alter permissions for and click the "Edit" link.
    1. You are now in the editing interface for this content piece.
  4. Scroll down and click the "Who can edit or delete this content" link above the "Save" button.
    1. The list of users with editing privileges appears.
  5. There are 2 ways to add users to this permissions set. You can:
    • Add individuals.
      1. Use the text field to search for a user. As you type, matches will appear below.
      2. Click on a person's name to add them to the list.
    • Add groups.
      1. Click the "Add" button.
        1. A new window pops up.
      2. Use the links to navigate to the group you wish to add.
      3. Once you've found the group, click the "Select" link to the right of the group's name to add them to the list.
        1. The extra window disappears.
  6. When you are done setting the permissions set, scroll down and click the "Save" button.
    1. The screen returns to "View" mode.

Appearance

You have control over 2 appearance features for content. You can choose to make it sticky at the top of the page, and you can change its attribution style.

Sticky

Each time you add or edit a piece of content, it is placed at the top of the page, above any other existing content. By default, content is not sticky, but making content sticky at the top of the page forces it to remain above any other content. To control whether or not content is sticky:

  1. Make sure you are logged on.
  2. Navigate to the page containing the content who's stickiness you wish to change.
  3. Scroll below the content piece you want to make sticky and click the "Edit" link.
    1. You are now in the editing interface for this content piece.
  4. Scroll down and click the "Appearance" link.
    1. You now see the content's appearance properties.
  5. To make the content sticky, make sure the checkbox to make the content sticky at the top of the page is checked.
  6. When you are done altering the stickiness, scroll down and click the "Save" button.
    1. The screen returns to "View" mode.

Attribution

Each piece of content created stores information on who created it and when it was created. By default, content displays a message indicating the user that submitted the content. To change the attribution message:

  1. Make sure you are logged on.
  2. Navigate to the page containing the content who's attribution message you wish to change.
  3. Scroll below the content piece you want to modify and click the "Edit" link.
    1. You are now in the editing interface for this content piece.
  4. Scroll down and click the "Appearance" link.
    1. You now see the content's appearance properties.
  5. Use the "Attribution style" dropdown menu to change the attribution message.
  6. When you are done altering the attribution message, scroll down and click the "Save" button.
    1. The screen returns to "View" mode.

Scheduled Publishing

Editing the Publish settings on a piece of content allows you to control when the content is published. This allows you to set a future start date for it to appear on your site, as well as a date for it to be automatically removed from your page. The Publishing setting is particularly effective for temporary content, or content that gets reused based on a schedule. To set publish dates:

  1. Make sure you are logged on.
  2. Navigate to the page containing the content you wish to schedule.
  3. Scroll below the content piece you wish to schedule and click the "Edit" link.
    1. You are now in the editing interface for this content piece.
  4. Scroll down and click the "Publishing" link above the "Meta tags" label.
    1. New text fields appear for setting publish dates and times.
  5. Type the necessary dates and times into the "Publish on" and/or "Unpublish on" text fields.
  6. When you are done setting publish dates for the content, scroll down and click the "Save" button.
    1. The screen returns to "View" mode.

Pages

If you have content you want to appear on multiple pages, you still only have to create it once. Once it is created, use the following instructions to make it appear on all other desired pages.

  1. Make sure you are logged on.
  2. Navigate to the page containing the content you wish to duplicate.
  3. Go below the content piece and click the "Edit" link.
    1. The screen now shows the editing interface for your content.
  4. Scroll down if necessary and click the "Pages" link above the "Save" button.
    1. A list of the pages that display this content appears, along with 3 new buttons.
  5. You can:
    • Add a page.
      1. Click the "Add..." button.
        1. A window appears with an index of the entire site.
      2. Navigate to the page you wish to add the content to and click the "Select" link on the right hand side.
        1. The window disappears and the new page is added to the list.
    • Replace a page.
      1. Click the name of the page you wish the content to no longer appear on.
      2. Click the "Replace..." button.
        1. A window appears with an index of the entire site.
      3. Navigate to the page you wish to add the content to and click the "Select" link on the right hand side.
        1. The window disappears and the new page is added to the list while the old one has been removed.
    • Delete a page.
      1. Click the name of the page you wish the content to no longer appear on.
      2. Click the "Delete" button.
        1. The name of the page is removed from the list.
  6. When you are done managing the pages, click the "Save" button.
    1. The screen returns to "View" mode.
Powered by MediaWiki