Editing the HCIL Website: Difference between revisions

From hcil
Jump to navigation Jump to search
(Created page with "logging onto the HCIL website: https://hcil.umd.edu/wp-login.php To request access, email hcil-info@cs.umd.edu Posts Featured items on the HCIL are organized by posts (e.g. F...")
 
 
(41 intermediate revisions by 4 users not shown)
Line 1: Line 1:
logging onto the HCIL website:
I ADDED THE TIPS FOR THE CURENT WEBSITE AT THE BOTTOM OF THIS PAGE. 
https://hcil.umd.edu/wp-login.php
 
To request access, email hcil-info@cs.umd.edu
DO NOT REMOVE IT UNTIL WE MOVE TO THE NEW WEBSITE.
 
 
 
== '''INFO for the future website''' ==
 
 
 
To request an account for the HCIL website Wordpress: ask the coordinator or the ischool IT folks + your advisor)
 
'''Wordpress Basics'''
Wordpress is a content management system that enables people to build, design, and update beautiful websites without knowledge of programming and coding. There are five important vocabulary words that are important to understand when using Wordpress.
#Dashboard: The dashboard is where authorized users access the backend to edit, update, and modify the website.
#Theme: The Theme provides the entire website's visual aesthetic, visual design, colors, fonts, etc.. The website can only have one theme.
#Pages: The Pages are where users build, update, and delete consistent web content. Examples include "Contact Us", "About", etc.
#Posts: The Posts are where users can share news, blog posts, and other informational updates. Posts can look alot like Pages.
#Plugins: Plugins are special features that other programmers build and that you can download and install on your website. A good security practice is to never download a plugin unless it as at least 70,000 users and is compatible with your Theme. 
 
'''To login in WordPress dashboard'''
Go to hcil.umd.edu/wp-admin
Use your UMD directory ID to login
 
'''To add an event'''
Thats the easiest thing: add a new Wordpress Event!  No need to select any categories  (see special case of the symposium below).  It will automatically list that event on the Event list, remove it when the date is past.
 
 
'''Adding/Editing/Deleting People'''
Go to Teams on left side
Locate Correct Category [Faculty/Students/Alumni/Collaborators]Click edit under category.
#To Add a person, scroll to bottom of page and click Add a member.
#To Delete a person, click trash can next to person's profile
#To Edit a person, locate the individual by scrolling. You can edit their bio, photo and social media links [especially Personal Webpage, Twitter & Medium links]in profile. To save, click Update at top of page 
 
 
'''Symposium Page'''
 
 
'''Updating WordPress'''
 
 
'''Redirects'''
Under TOOLS there is a Redirect tool.  We already have many.  You can forward anything that starts with hcil.umd.edu to another of our page, or outside
 
'''Pages'''
 
Most content on the HCIL is organized by pages.
Similar to posts, you can add new pages, add media to pages, organize, tag and add a category and featured images.  For pages, featured images appear at the top of the page.
 
 
'''Adding Media'''
 
Click on the ''media'' tab on the left dashboard, click "Add new" and select the file you want.
Your file will appear as https://hcil.umd.edu/wp-content/uploads/Year/Month/name.extension,
e.g. https://hcil.umd.edu/wp-content/uploads/2018/07/test.png
*Make sure to name the file appropriately before uploading - you will not be able to edit the file's URL after uploading*
#Edit images properties: In the image library, click on the image, and click on "edit image" below the image. In the attachment details page, you will be able to rotate images, scale and crop the image.
#Delete images: In the image library, click on the image, and click "Delete Permanently"
 
 
'''to Edit the top Menus'''
 
To edit the HCIL menu (at the top right), look in "Appearance" in the left dashboard. Drag menu items around to change their position and hierarchy.
 
'''to edit the look of Pages'''
The appearance tab on the left dashboard leads to the template which can be edited to make changes the visual appearance of the website. You can change themes, customize website visual design, change widgets.
In editor, you can see the website code. Be very careful... Make copies before changing things.
 
# Themes - change the website theme.
# Customize - customize website theme colors/header/background image/homepage settings
# Widgets - customize widgets for different parts of the website
# Editor - See the style sheet and pHp files. You cannot directly edit the code in the editor, even though several links are hardcoded. You can make link edits in cPanel or by uploading an updated file via FTP.
 
 
== '''INFO FOR THE CURRENT WEBSITE''' ==
 
 
 
 
To request an account for the HCIL website Wordpress: ask the coordinator or the ischool IT folks + your advisor)
 
'''To add a News item on the front page (right side)'''
You have to add a new Wordpress Post, and Assign Category=featured news.  The posts appear in the order they are posted so if you are catching up with several news items, post the older one first.
 
'''To add an event'''
Thats the easiest thing: add a new Wordpress Event!  No need to select any categories  (see special case of the symposium below).  It will automatically list that event on the Event list, remove it when the date is past.
 
'''Featured faculty and students'''
They are Wordpress Pages, with a category "featured faculty" or "featured students.  Look at the example... there seems to be an added "featured image" but I don't know how that works... or how the shot text for the home page is selected...
 
'''Featured large image that appear at the top of the home page'''
Those are also pages.  Filter by "featured landing" to see examples
Upload your image in Media
Create a new page, tag it as "featured landing"
At the bottom right of the edit page you will be able to select your image as the "featured image"
(warning: in the old example the url for MORE may have been redirected to a different page) Check Tools>redirects.
I do not know what order is used to show pages...
 
'''Adding/Editing/Deleting People'''
 
People (e.g. faculty, current students, etc.) are organized using the participant database in the left dashboard.
To edit people in different categories, click on the participate database tab, and click on the pen icon to the left of each name.
In the "Edit Existing Participant Record" page:
# Change an image by changing the image URL. Most people images are saved in the media library - you will have to manually check the media library URL. You can also change or add a new image under "Personal information" at the bottom of the page.
# Change the category people fall under using "type" and ""Type_2."  Faculty and staff are listed using the "Faculty" type, and "Students" are listed using the "Student" type. If you don't know what category people are listed by, look up another person from that category to see what type they fall into.
# To remove people from different categories, simply remove delete their "type" category. This will remove their profile from the website, but leave their profile intact for any future changes.
#  If adding someone: email them the url of '''New To The HCIL'''. 
# If removing someone:  add them to the alumni page (edited normally in wordpress).
 
To add new people, click on the participant database tab. Several sub-tabs will appear below it.
# The "add participant" sub-tab will create a new record that you can fill in from scratch.
# You can add several people using the "import CSV file" tab, this will allow you to upload several people at once. When uploading the CSV, make sure your columns match those specified in the tab.
 
'''EDIT sponsor list'''
 
The sponsors displayed on the Sponsors page are stored in the Participants Database (not great but that's that). To see them click "Participants Database" on the left of the Wordpress Admin page, and then filter by records based on the type you want to see. For example, to show the active sponsors show the records with "type that contains 'active sponsor'. The two types are "Active Sponsor" and "Past Sponsor".  You can add/delete/edit new values just like you add/edit people.
To see/edit the symposium sponsors you need to show the records with 'type_2 that contains 'symposium sponsor.'
WARNING:  for some reason someone retagged all the 2019 sponsors to "Former Sponsor' which 1) is not correct and 2) make them dissappear entirely (as the word former is not the same as the work past).
 
 
 
'''Database management in cPANEL'''
 
You can also update faculty or students by making changes in the database in Cpanel.  Ask the password from the coordinator.
 
TRs are also updated there.
Research too?
 
'''Symposium Page'''
 
Before starting a new year you need to archive the info of the most recent symposium page.  Create a new normal page, and copy and paste the code found in the recent version (there is a "copy to new draft" button, or use the code editor to copy the html).  Then make sure the "event archive" points to that new page (with the archived code/content). There are 2 locations for those archive: a tab on the symposium page itself, and the event archive page.
 
The symposium webpage is not easy to edit...  The webpage is made of various parts that are saved in different Wordpress Pages:  Go to "all pages" and filter by category "HCIL Symposium".  You will find Program, Sponsor etc. (watchout, there are also a lot of old versions used for the archived events).
 
Be very careful editing the program page:  none of the editor work properlly...  So we have to do it in html absolutely.  You can create a temporary page and then copy and paste the html in the Program page when you are ready (use the "code editor" to do that.  (see the "..." menu at the top right of the editor)
 
The top header information (with the date and Register button) can be changed by editing the one and only Wordpress Event of type "HCIL symposium".  The format of that header is defined in php: you have to look in "appearance > editor" and find the php for "event-meta-event-single"!!! (ridiculous really).
 
The menu items are generated automatically from the pages of type Symposium. So adding a page adds a menu item! 
Note that in 2019 we removed the tab with the directions to CSIC (there is a backup of it as a normal page). It could be added back in 2020
 
'''Security'''
Go to DASHBOARD (at the top left), and select UPDATES.  Update the widgets and themes often. 
 
 
'''Redirects'''
Under TOOLS there is a Redirect tool.  We already have many.  You can forward anything that starts with hcil.umd.edu to another of our page, or outside
 
'''Pages'''
 
Most content on the HCIL is organized by pages.
Similar to posts, you can add new pages, add media to pages, organize, tag and add a category and featured images.  For pages, featured images appear at the top of the page.
 
'''more about Posts'''


Posts
Featured items on the HCIL are organized by posts (e.g. Featured News, Featured Alumni).
Featured items on the HCIL are organized by posts (e.g. Featured News, Featured Alumni).
Edit Posts by clicking on "Posts" in the left tab. While editing, you may run into issues with weird spacing or hidden formatting. Switch to the HTML or "text" view and delete or edit HTML as necessary.


1. Create a new post by clicking "Add new" button.  
Edit Posts by clicking on "Posts" in the dashboard on the left side of the screen. While editing, you may run into issues with weird spacing or hidden formatting. Switch to the HTML or "text" view and delete or edit HTML as necessary.
2. Add Images or video by clicking "Add media." You can either upload your own media, or add media from the media library.
 
# Create a new post by clicking "add new" button.  
# Add images or video by clicking "Add media." You can either upload your own media, or add media from the media library.
# Preview any changes you make before publishing. The last thing you want to do is delete some else's work
# Organize posts into featured items by checking the appropriate category. If multiple posts are checked in a category (e.g. featured publication), the links to the different posts will rotate between the images. If you only want a featured item to remain static, uncheck the any other posts featured in that category.
# Tags - you can tag your posts with keywords. However, this feature is not used often.
# Featured images allow you to change the image link to the post.  You can either upload your own media, or add media from the media library
 
'''Adding Media'''
 
Click on the ''media'' tab on the left dashboard, click "Add new" and select the file you want.
Your file will appear as https://hcil.umd.edu/wp-content/uploads/Year/Month/name.extension,
e.g. https://hcil.umd.edu/wp-content/uploads/2018/07/test.png
*Make sure to name the file appropriately before uploading - you will not be able to edit the file's URL after uploading*
#Edit images properties: In the image library, click on the image, and click on "edit image" below the image. In the attachment details page, you will be able to rotate images, scale and crop the image.
#Delete images: In the image library, click on the image, and click "Delete Permanently"
 
 
'''to Edit the top Menus'''
 
To edit the HCIL menu (at the top right), look in "Appearance" in the left dashboard. Drag menu items around to change their position and hierarchy.
 
 
'''to edit the look of Pages'''
The appearance tab on the left dashboard leads to the template which can be edited to make changes the visual appearance of the website. You can change themes, customize website visual design, change widgets.
In editor, you can see the website code. Be very careful... Make copies before changing things.
 
# Themes - change the website theme.
# Customize - customize website theme colors/header/background image/homepage settings
# Widgets - customize widgets for different parts of the website
# Editor - See the style sheet and pHp files. You cannot directly edit the code in the editor, even though several links are hardcoded. You can make link edits in cPanel or by uploading an updated file via FTP.
 


[[File:HCIL Posts.png|thumb|Editing HCIL Posts]]
<gallery>
HCIL Posts.png|Editing HCIL Posts
HCIL MediaLibrary.png|Edit Image Library
HCIL Menu.png| Edit Menu
HCIL EditPeople.png| Edit People
HCIL_PeopleType.png|Change People Category
</gallery>

Latest revision as of 23:11, 8 June 2020

I ADDED THE TIPS FOR THE CURENT WEBSITE AT THE BOTTOM OF THIS PAGE.

DO NOT REMOVE IT UNTIL WE MOVE TO THE NEW WEBSITE.


INFO for the future website

To request an account for the HCIL website Wordpress: ask the coordinator or the ischool IT folks + your advisor)

Wordpress Basics Wordpress is a content management system that enables people to build, design, and update beautiful websites without knowledge of programming and coding. There are five important vocabulary words that are important to understand when using Wordpress.

  1. Dashboard: The dashboard is where authorized users access the backend to edit, update, and modify the website.
  2. Theme: The Theme provides the entire website's visual aesthetic, visual design, colors, fonts, etc.. The website can only have one theme.
  3. Pages: The Pages are where users build, update, and delete consistent web content. Examples include "Contact Us", "About", etc.
  4. Posts: The Posts are where users can share news, blog posts, and other informational updates. Posts can look alot like Pages.
  5. Plugins: Plugins are special features that other programmers build and that you can download and install on your website. A good security practice is to never download a plugin unless it as at least 70,000 users and is compatible with your Theme.

To login in WordPress dashboard Go to hcil.umd.edu/wp-admin Use your UMD directory ID to login

To add an event Thats the easiest thing: add a new Wordpress Event! No need to select any categories (see special case of the symposium below). It will automatically list that event on the Event list, remove it when the date is past.


Adding/Editing/Deleting People Go to Teams on left side Locate Correct Category [Faculty/Students/Alumni/Collaborators]Click edit under category.

  1. To Add a person, scroll to bottom of page and click Add a member.
  2. To Delete a person, click trash can next to person's profile
  3. To Edit a person, locate the individual by scrolling. You can edit their bio, photo and social media links [especially Personal Webpage, Twitter & Medium links]in profile. To save, click Update at top of page


Symposium Page


Updating WordPress


Redirects Under TOOLS there is a Redirect tool. We already have many. You can forward anything that starts with hcil.umd.edu to another of our page, or outside

Pages

Most content on the HCIL is organized by pages. Similar to posts, you can add new pages, add media to pages, organize, tag and add a category and featured images. For pages, featured images appear at the top of the page.


Adding Media

Click on the media tab on the left dashboard, click "Add new" and select the file you want. Your file will appear as https://hcil.umd.edu/wp-content/uploads/Year/Month/name.extension, e.g. https://hcil.umd.edu/wp-content/uploads/2018/07/test.png

  • Make sure to name the file appropriately before uploading - you will not be able to edit the file's URL after uploading*
  1. Edit images properties: In the image library, click on the image, and click on "edit image" below the image. In the attachment details page, you will be able to rotate images, scale and crop the image.
  2. Delete images: In the image library, click on the image, and click "Delete Permanently"


to Edit the top Menus

To edit the HCIL menu (at the top right), look in "Appearance" in the left dashboard. Drag menu items around to change their position and hierarchy.


to edit the look of Pages The appearance tab on the left dashboard leads to the template which can be edited to make changes the visual appearance of the website. You can change themes, customize website visual design, change widgets. In editor, you can see the website code. Be very careful... Make copies before changing things.

  1. Themes - change the website theme.
  2. Customize - customize website theme colors/header/background image/homepage settings
  3. Widgets - customize widgets for different parts of the website
  4. Editor - See the style sheet and pHp files. You cannot directly edit the code in the editor, even though several links are hardcoded. You can make link edits in cPanel or by uploading an updated file via FTP.


INFO FOR THE CURRENT WEBSITE

To request an account for the HCIL website Wordpress: ask the coordinator or the ischool IT folks + your advisor)

To add a News item on the front page (right side) You have to add a new Wordpress Post, and Assign Category=featured news. The posts appear in the order they are posted so if you are catching up with several news items, post the older one first.

To add an event Thats the easiest thing: add a new Wordpress Event! No need to select any categories (see special case of the symposium below). It will automatically list that event on the Event list, remove it when the date is past.

Featured faculty and students They are Wordpress Pages, with a category "featured faculty" or "featured students. Look at the example... there seems to be an added "featured image" but I don't know how that works... or how the shot text for the home page is selected...

Featured large image that appear at the top of the home page Those are also pages. Filter by "featured landing" to see examples Upload your image in Media Create a new page, tag it as "featured landing" At the bottom right of the edit page you will be able to select your image as the "featured image" (warning: in the old example the url for MORE may have been redirected to a different page) Check Tools>redirects. I do not know what order is used to show pages...

Adding/Editing/Deleting People

People (e.g. faculty, current students, etc.) are organized using the participant database in the left dashboard. To edit people in different categories, click on the participate database tab, and click on the pen icon to the left of each name. In the "Edit Existing Participant Record" page:

  1. Change an image by changing the image URL. Most people images are saved in the media library - you will have to manually check the media library URL. You can also change or add a new image under "Personal information" at the bottom of the page.
  2. Change the category people fall under using "type" and ""Type_2." Faculty and staff are listed using the "Faculty" type, and "Students" are listed using the "Student" type. If you don't know what category people are listed by, look up another person from that category to see what type they fall into.
  3. To remove people from different categories, simply remove delete their "type" category. This will remove their profile from the website, but leave their profile intact for any future changes.
  4. If adding someone: email them the url of New To The HCIL.
  5. If removing someone: add them to the alumni page (edited normally in wordpress).

To add new people, click on the participant database tab. Several sub-tabs will appear below it.

  1. The "add participant" sub-tab will create a new record that you can fill in from scratch.
  2. You can add several people using the "import CSV file" tab, this will allow you to upload several people at once. When uploading the CSV, make sure your columns match those specified in the tab.

EDIT sponsor list

The sponsors displayed on the Sponsors page are stored in the Participants Database (not great but that's that). To see them click "Participants Database" on the left of the Wordpress Admin page, and then filter by records based on the type you want to see. For example, to show the active sponsors show the records with "type that contains 'active sponsor'. The two types are "Active Sponsor" and "Past Sponsor". You can add/delete/edit new values just like you add/edit people. To see/edit the symposium sponsors you need to show the records with 'type_2 that contains 'symposium sponsor.' WARNING: for some reason someone retagged all the 2019 sponsors to "Former Sponsor' which 1) is not correct and 2) make them dissappear entirely (as the word former is not the same as the work past).


Database management in cPANEL

You can also update faculty or students by making changes in the database in Cpanel. Ask the password from the coordinator.

TRs are also updated there. Research too?

Symposium Page

Before starting a new year you need to archive the info of the most recent symposium page. Create a new normal page, and copy and paste the code found in the recent version (there is a "copy to new draft" button, or use the code editor to copy the html). Then make sure the "event archive" points to that new page (with the archived code/content). There are 2 locations for those archive: a tab on the symposium page itself, and the event archive page.

The symposium webpage is not easy to edit... The webpage is made of various parts that are saved in different Wordpress Pages: Go to "all pages" and filter by category "HCIL Symposium". You will find Program, Sponsor etc. (watchout, there are also a lot of old versions used for the archived events).

Be very careful editing the program page: none of the editor work properlly... So we have to do it in html absolutely. You can create a temporary page and then copy and paste the html in the Program page when you are ready (use the "code editor" to do that. (see the "..." menu at the top right of the editor)

The top header information (with the date and Register button) can be changed by editing the one and only Wordpress Event of type "HCIL symposium". The format of that header is defined in php: you have to look in "appearance > editor" and find the php for "event-meta-event-single"!!! (ridiculous really).

The menu items are generated automatically from the pages of type Symposium. So adding a page adds a menu item! Note that in 2019 we removed the tab with the directions to CSIC (there is a backup of it as a normal page). It could be added back in 2020

Security Go to DASHBOARD (at the top left), and select UPDATES. Update the widgets and themes often.


Redirects Under TOOLS there is a Redirect tool. We already have many. You can forward anything that starts with hcil.umd.edu to another of our page, or outside

Pages

Most content on the HCIL is organized by pages. Similar to posts, you can add new pages, add media to pages, organize, tag and add a category and featured images. For pages, featured images appear at the top of the page.

more about Posts

Featured items on the HCIL are organized by posts (e.g. Featured News, Featured Alumni).

Edit Posts by clicking on "Posts" in the dashboard on the left side of the screen. While editing, you may run into issues with weird spacing or hidden formatting. Switch to the HTML or "text" view and delete or edit HTML as necessary.

  1. Create a new post by clicking "add new" button.
  2. Add images or video by clicking "Add media." You can either upload your own media, or add media from the media library.
  3. Preview any changes you make before publishing. The last thing you want to do is delete some else's work
  4. Organize posts into featured items by checking the appropriate category. If multiple posts are checked in a category (e.g. featured publication), the links to the different posts will rotate between the images. If you only want a featured item to remain static, uncheck the any other posts featured in that category.
  5. Tags - you can tag your posts with keywords. However, this feature is not used often.
  6. Featured images allow you to change the image link to the post. You can either upload your own media, or add media from the media library

Adding Media

Click on the media tab on the left dashboard, click "Add new" and select the file you want. Your file will appear as https://hcil.umd.edu/wp-content/uploads/Year/Month/name.extension, e.g. https://hcil.umd.edu/wp-content/uploads/2018/07/test.png

  • Make sure to name the file appropriately before uploading - you will not be able to edit the file's URL after uploading*
  1. Edit images properties: In the image library, click on the image, and click on "edit image" below the image. In the attachment details page, you will be able to rotate images, scale and crop the image.
  2. Delete images: In the image library, click on the image, and click "Delete Permanently"


to Edit the top Menus

To edit the HCIL menu (at the top right), look in "Appearance" in the left dashboard. Drag menu items around to change their position and hierarchy.


to edit the look of Pages The appearance tab on the left dashboard leads to the template which can be edited to make changes the visual appearance of the website. You can change themes, customize website visual design, change widgets. In editor, you can see the website code. Be very careful... Make copies before changing things.

  1. Themes - change the website theme.
  2. Customize - customize website theme colors/header/background image/homepage settings
  3. Widgets - customize widgets for different parts of the website
  4. Editor - See the style sheet and pHp files. You cannot directly edit the code in the editor, even though several links are hardcoded. You can make link edits in cPanel or by uploading an updated file via FTP.