IEEE Web Hosting (EWH)
35
Transcript of IEEE Web Hosting (EWH)
Agenda
Introduction to IEEE web hosting services ( EWH, WordPress and WebInABox).
Quick tutorial on updating EWH websites (HTML)
Quick tutorial on how to use vTools WebInABox
Tutorial on WordPress
Hands-on session
Tutorial on new IEEE R2 website (WordPress)
HTML Hosting
Use a visual HTML editor or text editor to create/edit webpages
Use the IEEE HTML templates available at http://www.ieee.org/about/toolkit/tools/index.html#sect7
Use an FTP client, such as Filezilla and WinSCP to transfer files to and from ewh.ieee.org
Pros & cons
vTools WebInAbox
https://webinabox.vtools.ieee.org
Use the wizard to create a simple website with automatic updates.
Pros and cons
WordPress
Table of Contents
What is WordPress?
Logging in
Themes
Admin Bar
Users
Posts
Pages
Settings (Post Page)
Media Library
Menus
Plugins
Widgets
What is WordPress?
WordPress is a Content Management System(CMS) that powers over 19% of all websites in the world. It enables users to easily publish their content on the web without any coding or expert knowledge. WordPress comes with many robust tools and features that can be extended by thousands of community-driven plugins.
Logging in
Click on the “Login” link
Enter your username and password and click “Log In”.
Your website can be accessed through a link we provide via email. Adding /wp-admin to the end of the URL will bring you to your website’s backend where all changes can be made.
Locating the Themes Page
Click on themes to access themes that IEEE staff have installed and continually maintain
You can mouse-over or click on Dashboard menu items to view their sub-menus
Selecting a Theme
The theme displayed here is the theme your site is currently running
Click to activate the theme
You can preview how a theme will look on your site before activating it
You can select a theme that corresponds with your type of organizational unit.
Using the top Admin Bar
The administrator bar can be used to quickly navigate and access areas where you can add and edit content. Click visit Site to view your site.
You can return to the Dashboard from the dropdown. In this case the site name is Section Template 2.
Users
You can select a user by checking the box next to their username
Change the roll of the selected user
User’s role
Adding a user
Choose a role for the new user. See the list above for the capabilities of each role. See Role Summary above.
Existing users must have a role on another IEEE hosted WordPress site. Generally, the URL begins with sites.ieee.org. If you have your own domain we can configure their sites to support it.
When finished, click Add New User
PostsHovering over the Page menu item on the left side of the Dashboard will bring up the submenu for Pages
All Posts will bring you to a Page where you can manage all of the Pages and their visibility status (shown below)
Posts (continued)
The visual tab is how content will look in the Page. The text tab accepts HTML code for formatting. Javascript is not supported.
Editing the visibility status can change your content to being either public, private or password protected.
Categories can be used to sort and organize your Pages.
Make sure to click update when you’re done!
Post Example
In this example, an image was imported using the WordPress Media Library.
What is a Page?
Pages are static areas that are used to display content that changes infrequently. Pages can include plugins that will dynamically update content for you. Each menu item here is a Page. Pages do not
have to be listed here but by default they are. You can link to a Page from a unique URL using the Menu Manager.
Sub-Pages are shown here. Notice the same title (About Us) which is the parent Page.
Pages
Pages with dashes ( - ) in front of their title are child Pages.
Clicking on the Page title will bring up the edit Page where changes can be made.
Click “Add New” to create a new Page
Quick Edit can be used to quickly change Page settings
Creating a Page
Notice the URL hierarchy. By clicking “Edit” you can change if the Page is enabled and who can see it.
Choose a parent for the current Page. This Page is meant for a top level navigation item so (no parent) is selected
Click update when finished
Creating a child Page (subpage)
Notice how the part of the URL containing /about-us/section-history reflects the parent/child relationship. You can select a Page to be the parent in the right drop-down box.
Parent Page
Reflects Page hierarchy. This particular navigation is called the breadcrumb.
Page you are currently on.
Page you are currently on.
Settings (Post Page)
Choose if you want your front page to directly show Posts or otherwise show a selected page.
Choose where you would like your Post Page to be if your front Page is a static Page. This is best left off (--Select--) if you are using the Posts-in-Page plugin.
Choose a maximum amount of Posts that can be displayed. This also applies for the Posts-in-Page plugin
Media Library
Most images that you want to place on your site should be uploaded through WordPress’ media tool in order to avoid dependencies on outside sources. Videos can be stored in YouTube or myIEEE to save space.
Places that you have put the media will be shown here (usually on a Post or a Page).
Click here to upload media
Adding to your Media Library
You can directly drag and drop files from other places on your computer into this window as well as using the file explorer by clicking “Select Files”.
You can also copy and paste an image or video’s source URL directly into the “File name” field to upload it without ever having to place the file on your computer.
Inserting Media on a Page
Opens up the Media Manager(explained next slide)
Image hyperlink setting
Inserting Media
Insert content directly from a URL.
Alt text will show if the image fails to load. It is good practice to supply Alt Text for all images on your site.
Image hyperlink and dimension settings may be changed here.
Menus
Menus consist of links to Pages in your site and links to external sources. Menus can be placed in both the left and right sidebar as well as the top navigation. For the top navigation, if there is no custom menu, Page ordering (set during Page creation) will decide what Pages are on the menu.
Setting up the menu
After you pick a name for your menu (this won’t be shown on the site) click “Create Menu"
Custom Links, Pages, and Events can all be added to a custom menu. Click “Add to Menu” to add the selected items to the menu.
Setting up the menu cont.
Once placed in the menu, items can be drag & dropped in any order or placed underneath representing a hierarchy. Click save below when you are finished
Be certain to click “Save Menu” to save your changes
Replacing the top-nav menu
By default WordPress uses Pages for top navigation items. This can be overwritten by setting your custom menu as the primary navigation.
Placing a menu in the sidebar
Select the menu you want to display in the custom menu
Displayed menu name
Drag this Widget into either the left or right sidebar
Save when done!
The Promos sidebar can be used to display promotions and/or your logo.
Custom menu result
Plugins
We have selected plugins that are safe and compatible with your site. Some plugins are network activated for all IEEE WordPress sites and others are pre-configured for the WordPress Section Template. To request a new plugin, email [email protected] with the name and justification.
Plugins (continued)
Inactive plugins have all been approved by IEEE staff and can be added by clicking “Activate” under the plugin name
Active plugins are enabled on your site. Network activated plugins (plugins that are enabled for all IEEE WP sites) will not be shown here. Clicking “Deactivate” will make the plugin inactive.
The plugin site is a hub where you can find information and support for a plugin.
Widgets
Widgets add content and features to your sidebars. Some example applications include RSS feeds, text, calendars, and advertisements. Sidebars are visible by default on all Pages of your site. Some Widgets come WordPress whereas others are added through plugins.
Custom Menu Widget
Links Widget
Upcoming Events (All-in-One Event Calendar) Widget
Archives Widget
Widgets (continued)
Drag and drop Widgets in the order you want them to be displayed (top to bottom)
Widgets have a drop down menu to edit the way they are displayed.
Thank You!
Thank you for viewing this tutorial. If you require
additional assistance, email IEEE Information
Technology at [email protected].
