Skip to content

Guide to MacCurdyLab.github.io

Jump to bottom
Monica Gullapalli edited this page Aug 10, 2024 · 23 revisions

Welcome to the MacCurdyLab.github.io wiki!

Here is the guide to add/remove/edit pages to the lab website to further update it.

To get the code onto your local desktop to edit:

  1. Go to the terminal and clone the code:
  2. Make changes into the code cloned on your local machine
  3. Add the files onto the github repository
    • git add .
  4. Commit the changes
    • git commit -m "commit changes"
  5. Push all the changes to the main repository
    • git push origin master

Let me explain the structure of the Lab website with editable elements.

On the Navbar exist:

  • Home
  • News
  • People
  • Research
  • Publications
  • Join Us

Home Page:

This is the main page or the About page of the website.
File location: _pages/about.md
If you want to edit the carousel or the text about the lab on the first page then this is where you have to go.
The news section on the home page displays the 5 latest news articles, and the news section displays the rest.

News Page:

This is the section where the lab adds more news articles to update it.
File location: _pages/news.md
This news.md file links to a news.liquid file which will store all the news articles. This is linked to a liquid file which accesses the _news folder.


Location: /MacCurdyLab.github.io/_news
In this folder you have to create a file named "announcement_number.md"
For now this folder has 45 announcements. For all new announcements i.e news you can create announcement_46.md, announcement_47.md and so on.
The format inside every announcement md is : --- layout: post date: 2022-06-30 inline: true related_posts: false --- Content for news in markdown.

People Page:

This page displays the carousel of images, name of person, their position, description and image.
This has a current member section and an Alumni section.
Location: _pages/people.md
This page only has the base code for the carousel and 2 sections of people: current and alumni.
Images folder structure: assets

  • people
    • carousel
    • current
    • alumni

To change Images in People page:

In Carousel Page:

path: assets/img/people/carousel
The files are named 1.jpg,2.jpg, etc
If you want to add an additional image you can add {number}.jpg format only and it will be added to the carousel.

In Current People:

path: assets/img/people/current
The files are named c1.jpg, c2.jpg, c3.png for convenience. You can name whatever you want as the format for the image or the name is not written in script. To add another image, means to add another person which is described in the later section

In Alumni People:

path: assets/img/people/alumni
The files are named: a1.jpg, a2.png, a3.jpg etc for convenience. You can name whatever you want as the format for the image or the name as it is not written in script. To add another image, means to add another person which is described below.

To add a new person in Current people:

path: _data/people.yml
To the existing file, add another set of details of a person of the following format:

  • name: position: image: description:

The people are displayed in the order they are listed on in this yml document, if you want to change the order of displaying it, arrange accordingly.

To add a new person in Alumni people:

path: _data/alumni.yml
To the existing file, add another set of details of a person of the following format:

  • name: position: image: description:

The people are displayed in the order they are listed on in this yml document, if you want to change the order of displaying it, arrange accordingly.

Research Page:

path: _pages/research.md
This page has all the bootstrap cards for various subtopics of research.
To add another subtopic you need to add this code snippet into the main div tag:
Code snippet for bootstrap card:

<html>
<div class="col-md-4 mb-4">
  <a href="/name-of-subtopic" class="card">
    <img src="/assets/img/name-of-subtopic/da2.png" class="card-img-top" alt="name-of-subtopic">
    <div class="card-body">
      <h5 class="card-title">name-of-subtopic</h5>
    </div>
  </a>
</div>
</html>

In this snippet you replace name-of-subtopic with the new name and the cards are added in order to edit accordingly.

Subtopics in Research Page:

path: _pages/fabrication-automation.md
In this page all the different subtopics are seperated by a "###" markdown. You can further add topics their description and image in plain HTML.

Publications Page:

path: _pages/publications.md
This page has the bib search feature to link to another page with publications where the actual content of publications exist.

To add publications:

path: _bibliography/papers.bib
On this page the publications are arranged in order, in a way that the publication added at the end of the document is shown on the top of the list. The kind of bibtex required to add publications is as follows: 

@article{https://doi.org/10.1002/admt.202301668,
  bibtex_show={true},
  year={},
  publisher={},
  comment = {preview={},
  abbr={},},
  author = {},
  title = {},
  journal = {},
  volume = {},
  number = {},
  pages = {},
  keywords = {},
  doi = {},
  url = {},
  eprint = {},
  pdf = {},
  abstract = {}
}

This sort of code will add another publication on to the page.

To add images to publications:

In the above given snippet there's a part of code written inside comment = {} removing this from the code will allow you to have an image and a small text on the image according to the publication.
You can add/remove/comment that part for each of your publications according to your will.

Join Us Page:

path: _pages/join-us.md
Join us page is very static and displays information about how to contact the lab if someone is interested to join it.
Editing the page would directly involve editing the markdown text on the page.

Clone this wiki locally