academicpages / academicpages.github.io

Github Pages template for academic personal websites, forked from mmistakes/minimal-mistakes
https://academicpages.github.io
MIT License
12.6k stars 44.24k forks source link

Table of Contents support #2100

Open mendax1234 opened 6 months ago

mendax1234 commented 6 months ago

Is your feature request related to a problem? Please describe. A clear and concise description of what the problem is. Ex. I'm always frustrated when [...] In the official minimal mistakes repo, there is a table of contents function which is integrated in the single layout. But in the academicspage fork, this function is missing. Enabling the toc function can make blog posts more clear.

Describe the solution you'd like A clear and concise description of what you want to happen. Add jekyell-toc plugin. Try to refer to what minimal mistakes has done already. Although I think there are much to change.

Describe alternatives you've considered A clear and concise description of any alternative solutions or features you've considered. I haven't thought about the alternative since this function is not available on academicpages now.

Additional context Add any other context or screenshots about the feature request here.

Samir-Rashid commented 2 months ago

I see you have solved this issue (#2357). Please mark this issue as resolved.

For reference, to include a toc put {% include toc %}.

Samir-Rashid commented 2 months ago

@mendax1234 I would appreciate if you make a pull request with the fixes you made to toc on your website. academicpages does not show the toc in the sidebar as it should.

Shunqiang-Feng commented 3 weeks ago

@Samir-Rashid Hi friend. I just put {% include toc %} in the markdown file (about.md), but it seems that It takes up space in the middle of my webpage instead of being on the right side. Is there a way to fix this? My code is as below:

---
permalink: /
title: About
author_profile: true
sitemap: false

toc: true
toc_label: "Content Table"
toc_sticky: true
redirect_from:
  - /about/
  - /about.html
description: "Shunqiang Feng's personal academic page, showcasing his background, research interests, and news."
---
{% include toc %}

I am ...
rjzupkoii commented 3 weeks ago

@Shunqiang-Feng The Markdown files are the main content that is rendered on the right side of the page, in order to adjust the table of contents you need to go into the template files themselves.

Shunqiang-Feng commented 3 weeks ago

Thanks for your reply. I tried to modify the default.yaml, but it also failed. Do you have any suggestion?

---
layout: compress
---

{% include base_path %}

<!DOCTYPE html>
<html lang="{{ site.locale | slice: 0,2 }}" class="no-js">
  <head>
    {% include head.html %} {% include head/custom.html %}
  </head>

  <body>
    {% include browser-upgrade.html %} {% include masthead.html %} {% include toc %}{{ content }}
    <div class="page__footer">
      <footer>
        {% include footer/custom.html %} {% include footer.html %}
      </footer>
    </div>

    {% include scripts.html %}
  </body>
</html>
Samir-Rashid commented 3 weeks ago

@Shunqiang-Feng You can see how to change the styling in this PR https://github.com/academicpages/academicpages.github.io/pull/2450. The HTML for the TOC itself is available in this file for editing https://github.com/academicpages/academicpages.github.io/blob/master/_includes/toc.

Shunqiang-Feng commented 3 weeks ago

oh sorry, I mean, I add " {% include toc %}" in the deafult.html as above. However, my page shows this in the right top side. I am sorry that I didnot find solution in the #2450 you mentioned, do you have any advice? image

Shunqiang-Feng commented 3 weeks ago

Ideally, the text should be centered, with the menu on the right, side by side. However, the image is actually floating above the text content rather than being aligned side by side with it. image

Shunqiang-Feng commented 3 weeks ago

I think I put the {% include toc %} incorrectly

Samir-Rashid commented 3 weeks ago

I am not sure. You can debug the styling in the file which is edited in my PR.